/* ==========================================================================
   skin-mincho.css — 建設業向けの見た目（採用サイト見本「デザイン5 上品」準拠）

   正本: rapportia-recruit-theme/assets/css/skins/mincho.css
   旧デザイン（カフェ・個人店向け：パステルの blob・筆記体ロゴ・角丸・影）を
   このファイル1枚で上書きする。全CSSの最後に読み込む。

   特徴:
     - 明朝体。字間を広く取り、線を細く
     - 色をほとんど使わない（墨色 #1F2723 ＋ グレー）。写真と余白で見せる
     - 角丸・影・装飾 blob を使わない。罫線は 1px
     - ボタンは角ばった細いアウトライン＋矢印
   ========================================================================== */

:root {
  --color-navy:       #1F2723;
  --color-yellow:     #6E7F78;
  --color-teal:       #55605A;
  --color-coral:      #6E7F78;
  --color-pink:       #E2E4E3;
  --color-lightblue:  #E2E4E3;
  --color-text:       #2A312E;
  --color-text-light: #6B736F;
  --color-bg:         #F6F6F4;
  --color-border:     #E2E4E3;

  --font-heading: 'Shippori Mincho', 'Hiragino Mincho ProN', 'Yu Mincho', serif;
  --font-body:    'Noto Serif JP', 'Hiragino Mincho ProN', 'Yu Mincho', serif;

  --radius-sm: 0px;
  --radius-md: 0px;
  --radius-lg: 0px;
  --shadow-sm: none;
  --shadow-md: none;
  --shadow-lg: none;

  --c-ink:  #1F2723;
  --c-mute: #6B736F;
  --c-line: #E2E4E3;
}

body { letter-spacing: 0.06em; line-height: 2; }
h1, h2, h3, h4, h5, h6 { font-weight: 500; letter-spacing: 0.1em; }

/* ---------- 旧デザインの装飾を消す ---------- */
.blob,
.hero__blobs,
.page-header__blobs,
.cta-section__blobs,
.thanks-section__blobs,
.coming-soon__blobs,
.profile__image-blob,
.industry-card__icon,
.plan-card__icon,
.plan-detail-card__icon,
.contact-info__icon,
.thanks-icon,
.coming-soon__icon { display: none !important; }

/* ---------- ヘッダー: 白・細い線・文字ロゴ ---------- */
.site-header {
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--c-line);
}
.site-header::after { display: none; }

.logo-wordmark {
  display: block;
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.22em;
  color: var(--c-ink);
  white-space: nowrap;
  line-height: 1.4;
}
.logo-wordmark--footer { color: #fff; font-size: 22px; margin-bottom: 16px; }
.header-tagline { color: var(--c-mute); letter-spacing: 0.2em; }

.nav-list a { color: var(--c-ink); font-weight: 400; letter-spacing: 0.14em; text-transform: none; }
.nav-list a::after { background: var(--c-ink); height: 1px; }
.nav-list li.current a,
.mobile-nav-list li.current a { background: transparent; box-shadow: inset 0 -1px 0 var(--c-ink); }
.nav-cta {
  background: transparent !important;
  color: var(--c-ink) !important;
  border: 1px solid var(--c-ink);
  border-radius: 0 !important;
  font-weight: 400;
  letter-spacing: 0.14em;
  box-shadow: none !important;
}
.nav-cta:hover { background: var(--c-ink) !important; color: #fff !important; }

/* ---------- 見出し: 英字ラベルは線＋字間 ---------- */
.section { padding: 120px 0; }
.section-header { margin-bottom: 72px; }
.section-label {
  font-family: var(--font-heading);
  font-size: 12.5px;
  font-weight: 400;
  letter-spacing: 0.4em;
  text-transform: none;
  color: var(--c-mute);
  margin-bottom: 14px;
}
.section-label::before {
  content: '';
  display: inline-block;
  width: 28px;
  height: 1px;
  margin-right: 12px;
  vertical-align: 4px;
  background: var(--c-mute);
}
.section-title {
  font-weight: 500;
  letter-spacing: 0.12em;
  line-height: 1.8;
  font-size: clamp(24px, 3.2vw, 34px);
}
.section-desc { color: var(--c-mute); }

/* ---------- ボタン: 角ばった細いアウトライン＋矢印 ---------- */
.btn {
  border-radius: 0 !important;
  font-family: var(--font-heading);
  font-weight: 500;
  letter-spacing: 0.16em;
  box-shadow: none !important;
}
.btn:hover { transform: none !important; }
.btn::after { content: '→'; margin-left: 10px; font-family: var(--font-body); }
.btn--primary { background: var(--c-ink); border: 1px solid var(--c-ink); color: #fff; }
.btn--primary:hover { background: #000; border-color: #000; color: #fff; }
.btn--outline { background: transparent; border: 1px solid var(--c-ink); color: var(--c-ink); }
.btn--outline:hover { background: var(--c-ink); color: #fff; }
.btn--white { background: #fff; color: var(--c-ink); border: 1px solid #fff; }
.btn--white:hover { background: transparent; color: #fff; }

/* ---------- Hero: 全面写真・中央・白の明朝 ---------- */
.hero {
  min-height: clamp(600px, 92vh, 860px);
  background: var(--c-ink);
  color: #fff;
  padding: 120px 0;
}
.hero__media { position: absolute; inset: 0; z-index: 0; }
.hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.6) brightness(0.95);
  animation: rapportia-slow-zoom 30s ease-out forwards;
}
.hero__media::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(31, 39, 35, 0.50) 0%, rgba(31, 39, 35, 0.62) 100%);
}
@keyframes rapportia-slow-zoom { from { transform: scale(1.06); } to { transform: scale(1); } }

.hero__inner {
  position: relative;
  z-index: 1;
  display: block;
  grid-template-columns: none;
  text-align: center;
}
.hero__content { max-width: 820px; margin: 0 auto; }
.hero__eyebrow {
  font-family: var(--font-heading);
  color: rgba(255, 255, 255, 0.85);
  letter-spacing: 0.4em;
  font-size: 13px;
  font-weight: 400;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.6);
}
.hero__title,
.hero__title em {
  color: #fff;
  font-weight: 500;
  letter-spacing: 0.16em;
  line-height: 1.7;
  text-shadow: 0 2px 26px rgba(0, 0, 0, 0.4);
}
.hero__title { font-size: clamp(28px, 4.6vw, 50px); }
.hero__desc {
  color: rgba(255, 255, 255, 0.92);
  letter-spacing: 0.1em;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.5);
}
.hero__actions { justify-content: center; }
.hero .btn--primary { background: #fff; color: var(--c-ink); border-color: #fff; }
.hero .btn--primary:hover { background: transparent; color: #fff; }
.hero .btn--outline { border-color: rgba(255, 255, 255, 0.7); color: #fff; }
.hero .btn--outline:hover { background: #fff; color: var(--c-ink); }

/* ---------- 下層ページの見出し: 写真＋墨色の重ね ---------- */
.page-header {
  min-height: unset !important;
  padding: 128px 0 112px;
  color: #fff;
  background:
    linear-gradient(180deg, rgba(31, 39, 35, 0.66) 0%, rgba(31, 39, 35, 0.78) 100%),
    url('../../img/photos/page-trench.jpg') center 55% / cover no-repeat,
    var(--c-ink);
}
.page-header__label,
.page-header__sub {
  font-family: var(--font-heading);
  color: rgba(255, 255, 255, 0.8) !important;
  letter-spacing: 0.4em;
  text-transform: none;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.5);
}
.page-header__title {
  color: #fff !important;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.4);
}
.page-header__desc,
.page-header p { color: rgba(255, 255, 255, 0.88) !important; text-shadow: 0 1px 10px rgba(0, 0, 0, 0.5); }

/* ---------- 3つの特長: カードをやめ、罫線で区切る ---------- */
.reasons__grid { gap: 0; }
.reason-card {
  background: transparent;
  border-left: 1px solid var(--c-line);
  padding: 8px 32px;
}
.reason-card:first-child { border-left: 0; }
.reason-card:hover { transform: none; }
.reason-card__big { font-weight: 400; color: var(--c-ink); }
.reason-card__title {
  font-weight: 500;
  letter-spacing: 0.12em;
  border-top: 1px solid var(--c-ink);
}

/* ---------- 対象の会社 ---------- */
.industries__grid { gap: 0; border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); }
.industry-card {
  background: transparent;
  border: 0;
  border-left: 1px solid var(--c-line);
  padding: 36px 24px;
}
.industry-card:first-child { border-left: 0; }
.industry-card__title { font-weight: 500; letter-spacing: 0.14em; margin: 0; }

/* ---------- 料金カード ---------- */
.plan-card,
.plan-detail-card,
.includes-card {
  background: #fff;
  border: 1px solid var(--c-line);
  transform: none !important;
}
.plan-card--featured,
.plan-detail-card--featured { border-color: var(--c-ink); }
.plan-card__head,
.plan-detail-card__head { background: transparent !important; color: var(--c-ink) !important; }
.plan-card__name,
.plan-card__price,
.plan-card__price-num,
.plan-card__price-unit,
.plan-detail-card__name,
.plan-detail-card__price,
.plan-detail-card__price-num,
.plan-detail-card__price-unit { color: var(--c-ink) !important; }
.plan-card__price-num,
.plan-detail-card__price-num { font-family: var(--font-heading); font-weight: 400; }
.plan-card__price-unit,
.plan-detail-card__price-unit { white-space: nowrap; letter-spacing: 0.04em; }
.plan-card__price,
.plan-detail-card__price { flex-wrap: wrap; align-items: baseline; column-gap: 6px; }
.plan-card__badge,
.plan-detail-card__badge,
.plan-detail-card__tag {
  background: var(--c-ink) !important;
  color: #fff !important;
  border-radius: 0 !important;
  letter-spacing: 0.2em;
}

/* ---------- 納品後 ---------- */
.support-item {
  background: transparent;
  border: 0;
  border-top: 1px solid var(--c-line);
  padding: 40px 8px;
}
.support-item__num { background: transparent !important; color: var(--c-ink); }
.support-item__n { font-family: var(--font-heading); font-weight: 400; color: var(--c-ink); }
.support-item__unit { color: var(--c-mute); }

/* ---------- 制作の流れ ---------- */
.process-step { background: transparent; border: 0; border-top: 1px solid var(--c-line); }
.process-step__num {
  background: transparent !important;
  color: var(--c-mute) !important;
  font-family: var(--font-heading);
  font-weight: 400;
  letter-spacing: 0.24em;
  border: 0 !important;
}
.process-step__free { background: transparent; color: var(--c-ink); border: 1px solid var(--c-ink); border-radius: 0; }
.process-step__arrow { opacity: 0.3; }

/* ---------- プロフィール ---------- */
.profile__photo { border-radius: 0 !important; aspect-ratio: 3 / 4; object-fit: cover; filter: saturate(0.7); }
.profile__promise li::before { color: var(--c-ink); }

/* ---------- 実績 ---------- */
.works-card,
.works-list-item { background: transparent; box-shadow: none; border-radius: 0; }
.works-card:hover,
.works-list-item:hover { transform: none; }
.works-card__thumb img,
.works-list-item__thumb img { filter: saturate(0.85); }
.works-card__body { padding: 20px 0 0; }
.works-card__title { font-weight: 500; letter-spacing: 0.1em; }

/* ---------- FAQ ---------- */
.faq-item { background: transparent; border: 0; border-bottom: 1px solid var(--c-line); border-radius: 0; box-shadow: none; }
.faq-question__icon { background: transparent !important; color: var(--c-mute) !important; font-family: var(--font-heading); }

/* ---------- 私たちについて・その他 ---------- */
.about-block--alt { background: var(--color-bg); }
.about-value-card,
.recruit-card,
.contact-info__item,
.contact-gmail { background: transparent; border: 1px solid var(--c-line); box-shadow: none; }
.about-value-card__num { font-family: var(--font-heading); font-weight: 400; color: var(--c-mute); }
.legal-table th { background: var(--color-bg); }

/* ---------- CTA・フッター ----------
   ページ末尾の CTA（墨色）と、全ページ共通のフッターCTA が続くため、
   フッターCTA は明るい面にして2段の区切りを見せる。 */
.cta-section { background: var(--c-ink) !important; padding: 128px 0; }
.cta-section__sub {
  font-family: var(--font-heading);
  color: rgba(255, 255, 255, 0.7) !important;
  letter-spacing: 0.4em;
}
.cta-section__title { color: #fff !important; font-weight: 500; letter-spacing: 0.12em; }
.cta-section__desc,
.cta-section__note { color: rgba(255, 255, 255, 0.8) !important; }

.footer-cta { background: var(--color-bg) !important; padding: 104px 0; border-top: 1px solid var(--c-line); }
.footer-cta__label {
  font-family: var(--font-heading);
  color: var(--c-mute) !important;
  letter-spacing: 0.4em;
}
.footer-cta__title { color: var(--c-ink) !important; font-weight: 500; letter-spacing: 0.12em; }
.footer-cta p,
.footer-cta__note { color: var(--c-mute) !important; }
.footer-cta a:not(.btn) { color: var(--c-ink); }

.footer-body { background: #161C19; }
.footer-body__inner { grid-template-columns: 1fr 1.7fr; gap: 56px; }
.footer-nav { grid-template-columns: repeat(3, minmax(max-content, 1fr)); gap: 32px 40px; }
.footer-nav__group a { white-space: nowrap; font-weight: 400; letter-spacing: 0.08em; }
.footer-nav__group a .nowrap,
.footer-desc .nowrap { display: inline-block; }

/* 料金は2枚（定価・上位）。3列のままだと右に穴が空く */
.plans-grid,
.plans-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 820px; margin-left: auto; margin-right: auto; }
.footer-nav__heading { color: rgba(255, 255, 255, 0.45); letter-spacing: 0.2em; }
.footer-bottom { background: #111513; border-top: 1px solid rgba(255, 255, 255, 0.06); }
.copyright { color: rgba(255, 255, 255, 0.5); letter-spacing: 0.12em; }

/* ==========================================================================
   スマートフォン
   ========================================================================== */
@media (max-width: 900px) {
  .reasons__grid { grid-template-columns: 1fr; }
  .reason-card { border-left: 0; border-top: 1px solid var(--c-line); padding: 40px 8px; }
  .reason-card:first-child { border-top: 0; }
  .hero { min-height: auto; padding: 96px 0; }
}

@media (max-width: 600px) {
  body { letter-spacing: 0.02em; line-height: 1.9; }
  .section { padding: 64px 0; }
  .section-header { margin-bottom: 40px; }
  .section-title { font-size: 22px; letter-spacing: 0.04em; line-height: 1.7; }
  .section-label { letter-spacing: 0.24em; font-size: 11.5px; }
  .hero__title,
  .hero__title em { font-size: 26px; letter-spacing: 0.06em; line-height: 1.6; }
  .hero__eyebrow { letter-spacing: 0.16em; font-size: 12px; }
  .hero__desc { letter-spacing: 0.02em; }
  .page-header { padding: 72px 0 64px; }
  .page-header__title { letter-spacing: 0.06em; }
  .industries__grid { grid-template-columns: 1fr; }
  .industry-card { border-left: 0; border-top: 1px solid var(--c-line); padding: 24px 8px; }
  .industry-card:first-child { border-top: 0; }
  .cta-section,
  .footer-cta { padding: 64px 0; }
  .footer-body__inner { grid-template-columns: 1fr; gap: 40px; }
  .footer-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 20px; }
  .footer-nav__group a { white-space: nowrap; letter-spacing: 0.02em; font-size: 13px; }
  .footer-nav__group a[href*="eatery"] { white-space: normal; }
  .plans-grid,
  .plans-detail-grid { grid-template-columns: 1fr; }
  .logo-wordmark { font-size: 16px; letter-spacing: 0.14em; }
  .btn { letter-spacing: 0.08em; }
}
