/* ============================================================
   Site Tone — TOPの深緑・生成り・ゴールドを全ページへ展開
   既存のページ固有CSSの後に読み込み、構造を変えずに統一する。
   ============================================================ */

:root {
  --tone-green-deep: #103923;
  --tone-green: #1f5e3b;
  --tone-green-soft: #e8efe8;
  --tone-ivory: #f7f7f1;
  --tone-gold: #c8a24d;
  --tone-gold-light: #f0d78f;
  --tone-ink: #203027;
  --tone-line: rgba(31, 94, 59, .14);
}

body:not(.home-page) {
  background: var(--tone-ivory);
}

body:not(.home-page) main {
  background: #fbfcf9;
}

/* ── Header: TOPのファーストビューと同じ深緑へ ── */
body:not(.home-page) .site-header {
  background: rgba(16, 57, 35, .96);
  border-bottom-color: rgba(255, 255, 255, .12);
  box-shadow: 0 8px 30px rgba(7, 32, 19, .12);
}

body:not(.home-page) .site-header.is-scrolled {
  background: rgba(16, 57, 35, .98);
  border-bottom-color: rgba(255, 255, 255, .14);
  box-shadow: 0 10px 30px rgba(7, 32, 19, .2);
}

body:not(.home-page) .site-header__logo-mark,
body:not(.home-page) .site-header__logo-text {
  filter: brightness(0) invert(1);
}

body:not(.home-page) .site-nav__link {
  color: rgba(255, 255, 255, .88);
}

body:not(.home-page) .site-nav__link:hover,
body:not(.home-page) .site-nav__link.is-active {
  color: #fff;
  background: rgba(255, 255, 255, .1);
}

body:not(.home-page) .site-header__ctas .btn--primary {
  background: transparent;
  border-color: rgba(255, 255, 255, .58);
  color: #fff;
  box-shadow: none;
}

body:not(.home-page) .site-header__ctas .btn--primary:hover {
  background: rgba(255, 255, 255, .1);
  border-color: #fff;
}

body:not(.home-page) .site-header__hamburger span {
  background: #fff;
}

body:not(.home-page) .site-nav-drawer {
  background: #f7f8f3;
}

/* ── Lower-page hero: 線画の街をブランド背景として継承 ── */
body:not(.home-page) .page-hero {
  position: relative;
  isolation: isolate;
  min-height: clamp(430px, 55vw, 590px);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  padding: calc(var(--header-h) + 76px) 0 72px;
  text-align: left;
  background:
    linear-gradient(90deg, rgba(9, 43, 26, .97) 0%, rgba(14, 58, 36, .9) 45%, rgba(18, 70, 43, .54) 74%, rgba(9, 36, 23, .32) 100%),
    linear-gradient(180deg, rgba(7, 31, 18, .2), rgba(7, 31, 18, .48)),
    url("../images/hero-city-sketch-v1.webp") center 48% / cover no-repeat;
}

body:not(.home-page) .page-hero::after {
  content: "";
  position: absolute;
  inset: -20%;
  z-index: -1;
  background: radial-gradient(circle at 72% 48%, rgba(240, 215, 143, .19), transparent 33%);
  filter: blur(32px);
}

body:not(.home-page) .page-hero .container {
  width: 100%;
  text-align: left;
}

body:not(.home-page) .page-hero .breadcrumb,
body:not(.home-page) .service-hero__breadcrumb,
body:not(.home-page) .company-hero__breadcrumb {
  justify-content: flex-start;
  margin: 0 0 28px;
}

body:not(.home-page) .service-hero__label {
  display: none;
}

body:not(.home-page) .page-hero__title {
  max-width: 980px;
  margin: 0;
  color: var(--tone-gold-light);
  font-size: clamp(2.35rem, 4.25vw, 4.8rem);
  font-weight: 600;
  line-height: 1.23;
  letter-spacing: -.045em;
  text-shadow: 0 5px 28px rgba(4, 24, 14, .28);
}

body:not(.home-page) .support-hero .page-hero__title {
  max-width: 1180px;
  font-size: clamp(2.55rem, 4vw, 4.35rem);
}

body:not(.home-page) .support-hero .page-hero__title > span {
  display: block;
  white-space: nowrap;
}

body:not(.home-page) .support-hero .page-hero__title .hero-title-segment {
  display: inline;
}

/*
 * 11〜13インチ相当では、デスクトップ用の強制1行表示が見出しを
 * 画面外へ押し出していた。文節ごとに自然改行させ、文字を切らない。
 */
@media (max-width: 1023px) {
  body:not(.home-page) .support-hero .page-hero__title > span,
  body:not(.home-page) .support-hero .page-hero__title .hero-title-segment {
    white-space: normal;
  }

  body:not(.home-page) .support-hero .page-hero__title .hero-title-segment {
    display: block;
  }
}

body:not(.home-page) .page-hero__desc {
  max-width: 780px;
  margin: 28px 0 0;
  color: rgba(255, 255, 255, .84);
  font-size: clamp(.98rem, 1.25vw, 1.08rem);
  line-height: 1.95;
  opacity: 1;
  text-shadow: 0 2px 16px rgba(4, 24, 14, .28);
}

body:not(.home-page) .service-hero__actions {
  justify-content: flex-start;
  gap: 14px;
  margin-top: 32px;
}

body:not(.home-page) .page-hero .btn--secondary {
  background: #9b7628;
  border-color: #9b7628;
  color: #fff;
  box-shadow: 0 12px 28px rgba(4, 24, 14, .2);
}

body:not(.home-page) .page-hero .btn--secondary:hover {
  background: #86631d;
  border-color: #86631d;
}

/* ── Sections and typography ── */
body:not(.home-page) .section {
  padding: 88px 0;
}

body:not(.home-page) .section--bg,
body:not(.home-page) .service-main,
body:not(.home-page) .support-section:nth-of-type(even) {
  background: #f0f3ed;
}

body:not(.home-page) .section__head {
  max-width: 900px;
  margin: 0 0 46px;
  text-align: left;
}

body:not(.home-page) .section__label {
  display: none;
}

body:not(.home-page) .section__title,
body:not(.home-page) .company-philosophy .section__title {
  color: var(--tone-ink);
  font-size: clamp(2rem, 3.5vw, 3.45rem);
  font-weight: 650;
  line-height: 1.38;
  letter-spacing: -.035em;
}

body:not(.home-page) .section__desc {
  max-width: 760px;
  margin: 0;
  color: #5b655f;
}

/* ── Cards: 影を抑え、余白と紙の質感で見せる ── */
body:not(.home-page) :is(
  .service-card,
  .service-blueprint__scope,
  .handled-service__body,
  .company-mvv-card,
  .company-business-card,
  .company-plus-one__body,
  .partner-benefit-card,
  .partner-merit-card,
  .support-grid-list li,
  .support-flow li,
  .support-process li,
  .support-faq details,
  .contact-form,
  .contact-info-box,
  .work-card,
  .work-detail__info-box,
  .work-detail__related,
  .recruit-persona-card,
  .recruit-value-card,
  .recruit-message__card,
  .recruit-coming-soon
) {
  border-color: var(--tone-line);
  border-radius: 22px;
  box-shadow: 0 16px 44px rgba(31, 64, 42, .055);
}

body:not(.home-page) .service-card {
  padding: clamp(28px, 4vw, 52px);
}

body:not(.home-page) .service-card__number,
body:not(.home-page) .support-flow span,
body:not(.home-page) .support-process span {
  border: 0;
  background: #efe3bc;
  color: #765719;
}

body:not(.home-page) :is(
  .service-card__title,
  .company-mvv-card h3,
  .company-business-card h3,
  .partner-benefit-card__title,
  .partner-merit-card__title,
  .support-flow strong,
  .support-faq summary,
  .contact-form__title,
  .contact-info-box__title,
  .work-detail__section-title
) {
  color: var(--tone-green-deep);
}

body:not(.home-page) .service-card__aside,
body:not(.home-page) .service-blueprint__scope,
body:not(.home-page) .company-plus-one__body,
body:not(.home-page) .form-note,
body:not(.home-page) .form-privacy {
  background: #eff3ec;
  border-color: rgba(31, 94, 59, .12);
}

body:not(.home-page) .company-table {
  border-color: var(--tone-line);
  border-radius: 22px;
  box-shadow: 0 16px 44px rgba(31, 64, 42, .055);
}

body:not(.home-page) .company-table th {
  color: var(--tone-green-deep);
  background: #e5eee6;
  border-right-color: rgba(31, 94, 59, .14);
}

body:not(.home-page) .contact-layout {
  padding-top: 76px;
}

body:not(.home-page) .form-input,
body:not(.home-page) .form-select,
body:not(.home-page) .form-textarea {
  min-height: 52px;
  border-color: rgba(31, 94, 59, .18);
  border-radius: 12px;
  background: #fcfdfb;
}

body:not(.home-page) .form-textarea {
  min-height: 140px;
}

body:not(.home-page) .contact-line-box {
  border-radius: 22px;
  box-shadow: 0 16px 40px rgba(6, 132, 59, .11);
}

body:not(.home-page) .work-card__body {
  padding: 26px;
}

body:not(.home-page) .work-detail {
  padding-top: 80px;
}

/* ── CTA and footer ── */
body:not(.home-page) .cta-banner {
  padding: 88px 0;
  background: #fbfcf9;
}

body:not(.home-page) .cta-banner .container {
  position: relative;
  overflow: hidden;
  padding: 72px clamp(24px, 6vw, 84px);
  border: 1px solid rgba(240, 215, 143, .24);
  border-radius: 30px;
  background:
    radial-gradient(circle at 82% 20%, rgba(200, 162, 77, .18), transparent 34%),
    linear-gradient(130deg, #103923 0%, #1f5e3b 64%, #2d7048 100%);
  box-shadow: 0 24px 60px rgba(10, 45, 27, .13);
}

body:not(.home-page) .cta-banner__title {
  color: var(--tone-gold-light);
  font-size: clamp(1.9rem, 3vw, 3rem);
  line-height: 1.4;
}

body:not(.home-page) .site-footer,
body:not(.home-page) .thanks-footer {
  background: var(--tone-green-deep);
  border-top: 1px solid rgba(240, 215, 143, .2);
}

/* ── Recruit page ── */
body:not(.home-page) .recruit-hero {
  min-height: clamp(590px, 72vw, 760px);
  display: flex;
  align-items: flex-end;
  padding: calc(var(--header-h) + 84px) 0 88px;
  text-align: left;
  background:
    linear-gradient(90deg, rgba(9, 43, 26, .97), rgba(14, 58, 36, .86) 52%, rgba(9, 36, 23, .3)),
    url("../images/hero-city-sketch-v1.webp") center / cover no-repeat;
}

body:not(.home-page) .recruit-hero::before {
  background: radial-gradient(circle at 73% 45%, rgba(240, 215, 143, .2), transparent 34%);
}

body:not(.home-page) .recruit-hero__inner {
  width: min(100%, var(--max-w));
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 var(--sp-6);
  text-align: left;
}

body:not(.home-page) .recruit-hero__badge {
  display: none;
}

body:not(.home-page) .recruit-hero__title {
  max-width: 900px;
  color: #fff;
  font-size: clamp(2.7rem, 5vw, 5.4rem);
  font-weight: 600;
  letter-spacing: -.05em;
}

body:not(.home-page) .recruit-hero__title em {
  color: var(--tone-gold-light);
}

body:not(.home-page) .recruit-hero__desc {
  max-width: 740px;
  margin: 28px 0 34px;
  color: rgba(255, 255, 255, .84);
}

body:not(.home-page) .recruit-hero__inner > div:last-child {
  justify-content: flex-start !important;
}

body:not(.home-page) .recruit-hero .btn--primary {
  background: #9b7628;
  border-color: #9b7628;
  color: #fff;
  box-shadow: 0 12px 28px rgba(4, 24, 14, .2);
}

body:not(.home-page) .recruit-hero .btn--outline {
  border-color: rgba(255, 255, 255, .65);
  color: #fff;
  background: transparent;
}

body:not(.home-page) .recruit-hero .btn--outline:hover {
  border-color: #fff;
  color: #fff;
  background: rgba(255, 255, 255, .1);
}

body:not(.home-page) :is(.recruit-message, .recruit-persona, .recruit-jobs, .recruit-values) {
  padding-top: 88px;
  padding-bottom: 88px;
}

body:not(.home-page) :is(.recruit-persona__label, .recruit-jobs__label, .recruit-values__label, .recruit-message__label) {
  display: none;
}

/* ── Privacy page ── */
body:not(.home-page) .privacy-body {
  padding: calc(var(--header-h) + 70px) 0 96px;
  background:
    linear-gradient(180deg, #edf2eb 0, #fbfcf9 420px),
    #fbfcf9;
}

body:not(.home-page) .privacy-max {
  max-width: 920px;
  padding: 54px clamp(24px, 6vw, 72px) 72px;
  border: 1px solid var(--tone-line);
  border-radius: 28px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 22px 60px rgba(31, 64, 42, .07);
}

body:not(.home-page) .privacy-body h1 {
  color: var(--tone-green-deep);
  font-size: clamp(2.2rem, 4vw, 3.8rem);
  letter-spacing: -.04em;
}

body:not(.home-page) .privacy-body h2 {
  margin-top: 54px;
  padding-bottom: 12px;
  border-bottom-color: rgba(31, 94, 59, .14);
  color: var(--tone-green-deep);
}

/* ── Thanks page ── */
body:not(.home-page) .thanks-page {
  min-height: calc(100svh - 80px);
  padding: calc(var(--header-h) + 70px) 24px 76px;
  background:
    linear-gradient(90deg, rgba(9, 43, 26, .91), rgba(14, 58, 36, .67)),
    url("../images/hero-city-real-v1.webp") center / cover no-repeat;
}

body:not(.home-page) .thanks-card {
  max-width: 680px;
  padding: clamp(34px, 6vw, 64px);
  border: 1px solid rgba(240, 215, 143, .34);
  border-radius: 30px;
  background: rgba(250, 251, 247, .97);
  box-shadow: 0 28px 80px rgba(4, 24, 14, .28);
}

body:not(.home-page) .thanks-title {
  color: var(--tone-green-deep);
  font-size: clamp(2rem, 4vw, 3.25rem);
}

body:not(.home-page) .thanks-reply {
  border-color: var(--tone-line);
  border-radius: 18px;
  background: #edf2eb;
}

body:not(.home-page) .thanks-links__item {
  border-radius: 999px;
  background: var(--tone-green);
  color: #fff;
}

/* ── Mobile ── */
@media (max-width: 767px) {
  body:not(.home-page) .page-hero {
    min-height: 560px;
    padding: calc(var(--header-h) + 46px) 0 54px;
    background:
      linear-gradient(180deg, rgba(9, 43, 26, .9), rgba(9, 43, 26, .72)),
      url("../images/hero-city-sketch-mobile-v1.webp") center / cover no-repeat;
  }

  body:not(.home-page) .page-hero .breadcrumb {
    margin-bottom: 22px;
  }

  body:not(.home-page) .page-hero__title {
    font-size: clamp(2.05rem, 9.3vw, 3.05rem);
    line-height: 1.28;
  }

  body:not(.home-page) .support-hero .page-hero__title > span {
    white-space: normal;
  }

  body:not(.home-page) .support-hero .page-hero__title .hero-title-segment {
    display: block;
    white-space: normal;
  }

  body:not(.home-page) .page-hero__desc {
    margin-top: 22px;
    font-size: .94rem;
    line-height: 1.85;
  }

  body:not(.home-page) .service-hero__actions,
  body:not(.home-page) .support-hero__actions {
    flex-direction: column;
    align-items: stretch;
  }

  body:not(.home-page) .section {
    padding: 64px 0;
  }

  body:not(.home-page) .section__head {
    margin-bottom: 34px;
  }

  body:not(.home-page) .section__title,
  body:not(.home-page) .company-philosophy .section__title {
    font-size: clamp(1.8rem, 8vw, 2.45rem);
  }

  body:not(.home-page) .cta-banner {
    padding: 64px 16px;
  }

  body:not(.home-page) .cta-banner .container {
    padding: 48px 22px;
    border-radius: 24px;
  }

  body:not(.home-page) .recruit-hero {
    min-height: 650px;
    padding: calc(var(--header-h) + 52px) 0 60px;
    background:
      linear-gradient(180deg, rgba(9, 43, 26, .89), rgba(9, 43, 26, .7)),
      url("../images/hero-city-sketch-mobile-v1.webp") center / cover no-repeat;
  }

  body:not(.home-page) .recruit-hero__inner {
    padding: 0 var(--sp-4);
  }

  body:not(.home-page) .recruit-hero__title {
    font-size: clamp(2.25rem, 10vw, 3.2rem);
  }

  body:not(.home-page) :is(.recruit-message, .recruit-persona, .recruit-jobs, .recruit-values) {
    padding-top: 64px;
    padding-bottom: 64px;
  }

  body:not(.home-page) .privacy-body {
    padding: calc(var(--header-h) + 28px) 14px 64px;
  }

  body:not(.home-page) .privacy-max {
    padding: 30px 20px 48px;
    border-radius: 22px;
  }

  body:not(.home-page) .thanks-page {
    padding: calc(var(--header-h) + 34px) 16px 52px;
    background:
      linear-gradient(180deg, rgba(9, 43, 26, .87), rgba(9, 43, 26, .67)),
      url("../images/hero-city-real-mobile-v1.webp") center / cover no-repeat;
  }

  body:not(.home-page) .thanks-card {
    padding: 34px 20px;
    border-radius: 24px;
  }
}

@media (max-width: 480px) {
  body:not(.home-page) .support-hero .page-hero__title {
    font-size: 1.5rem;
    line-height: 1.52;
  }
}

@media (prefers-reduced-motion: reduce) {
  body:not(.home-page) .page-hero::after {
    filter: none;
  }
}
