/* ============================================================
   services.css — 事業内容ページ固有スタイル
   ============================================================ */

/* ---------- Lead Section ---------- */
.lead-section {
  padding: 140px 0 120px;
  background: var(--paper);
  position: relative; overflow: hidden;
}
.lead-section .sec-watermark { top: 40px; right: -60px }
.lead-grid {
  display: grid; grid-template-columns: 1fr 1.2fr; gap: 80px;
  align-items: start;
}
.lead-body {
  font-size: 17px; line-height: 2.2; letter-spacing: .06em;
  color: var(--ink);
}
.lead-body p { margin: 0 0 28px }
.lead-body p:last-child { margin-bottom: 0 }

/* ---------- Manufacturing ---------- */
.manufacturing {
  padding: 140px 0;
  background: var(--ink);
  color: #fff;
  position: relative; overflow: hidden;
}
.manufacturing .sec-watermark { bottom: 30px; left: -40px; color: rgba(255,255,255,.04) }
.mfg-grid {
  margin-top: 56px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 32px;
}
.mfg-card {
  padding: 44px 36px;
  border: 1px solid rgba(255,255,255,.15);
  background: rgba(255,255,255,.03);
  transition: border-color .3s, background .3s;
}
.mfg-card:hover {
  border-color: rgba(255,255,255,.3);
  background: rgba(255,255,255,.06);
}
.mfg-card-num {
  font-family: var(--mono); font-size: 11px; letter-spacing: .2em;
  color: rgba(255,255,255,.45);
  margin-bottom: 20px;
}
.mfg-card-title {
  font-family: var(--en); font-weight: 500; font-size: 28px;
  letter-spacing: .04em; text-transform: uppercase;
  margin: 0 0 6px;
}
.mfg-card-title-ja {
  font-size: 16px; font-weight: 600; letter-spacing: .12em;
  color: rgba(255,255,255,.9);
  margin-bottom: 24px;
}
.mfg-card-text {
  font-size: 15px; line-height: 2; letter-spacing: .04em;
  color: rgba(255,255,255,.8);
  margin: 0 0 28px;
}
.mfg-card-text:last-child { margin-bottom: 0 }
.mfg-equip-label {
  font-family: var(--mono); font-size: 10px; letter-spacing: .2em;
  color: rgba(255,255,255,.5);
  margin-bottom: 12px;
  text-transform: uppercase;
}
.mfg-equip-list {
  margin: 0; padding: 0; list-style: none;
}
.mfg-equip-list li {
  padding: 8px 0;
  border-top: 1px solid rgba(255,255,255,.1);
  font-size: 14px; letter-spacing: .04em;
  color: rgba(255,255,255,.75);
}

/* ---------- Distribution ---------- */
.distribution {
  padding: 140px 0;
  background: var(--paper-2);
  position: relative; overflow: hidden;
}
.distribution .sec-watermark { top: 60px; right: -40px }
.dist-grid {
  margin-top: 56px;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;
}
.dist-card {
  padding: 40px 32px;
  border: 1px solid var(--line);
  background: var(--paper);
  transition: border-color .3s;
}
.dist-card:hover { border-color: var(--ink) }
.dist-card-num {
  font-family: var(--mono); font-size: 11px; letter-spacing: .2em;
  color: var(--slate-2);
  margin-bottom: 18px;
}
.dist-card-title {
  font-family: var(--en); font-weight: 500; font-size: 22px;
  letter-spacing: .04em; text-transform: uppercase;
  color: var(--ink); margin: 0 0 4px;
}
.dist-card-title-ja {
  font-size: 15px; font-weight: 600; letter-spacing: .1em;
  color: var(--ink); margin-bottom: 20px;
}
.dist-card-text {
  font-size: 14px; line-height: 2; letter-spacing: .04em;
  color: var(--slate); margin: 0 0 12px;
}
.dist-card-text:last-child { margin-bottom: 0 }
.dist-card-year {
  font-family: var(--mono); font-size: 10px; letter-spacing: .18em;
  color: var(--slate-2); margin-top: 16px;
}

/* ---------- Product Categories ---------- */
.categories {
  padding: 140px 0;
  background: var(--ink-deep);
  color: #fff;
  position: relative; overflow: hidden;
}
.categories .sec-watermark { top: 60px; right: -30px; color: rgba(255,255,255,.04) }
.cat-grid {
  margin-top: 56px;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
}
.cat-item {
  padding: 28px 24px;
  border: 1px solid rgba(255,255,255,.12);
  transition: border-color .3s, background .3s;
}
.cat-item:hover {
  border-color: rgba(255,255,255,.3);
  background: rgba(255,255,255,.04);
}
.cat-item-num {
  font-family: var(--mono); font-size: 10px; letter-spacing: .18em;
  color: rgba(255,255,255,.4);
  margin-bottom: 12px;
}
.cat-item-name {
  font-size: 15px; font-weight: 600; letter-spacing: .08em;
  color: #fff;
}

/* ---------- Product Redirect (compact) ---------- */
.cat-redirect {
  margin-top: 48px;
}
.cat-redirect p {
  font-size: 17px; line-height: 2; letter-spacing: .06em;
  color: rgba(255,255,255,.85);
  margin: 0 0 24px;
}

/* ---------- Strengths ---------- */
.strengths {
  padding: 140px 0;
  background: var(--paper);
  position: relative; overflow: hidden;
}
.strengths .sec-watermark { bottom: -20px; left: -40px }
.str-grid {
  margin-top: 56px;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;
}
.str-card {
  padding: 44px 36px;
  border: 1px solid var(--line);
  background: var(--white);
  transition: border-color .3s;
}
.str-card:hover { border-color: var(--ink) }
.str-card-num {
  font-family: var(--en); font-weight: 500; font-size: 48px;
  letter-spacing: .02em; color: var(--ink);
  line-height: 1; margin-bottom: 18px;
}
.str-card-title {
  font-size: 18px; font-weight: 600; letter-spacing: .08em;
  color: var(--ink); margin-bottom: 16px;
}
.str-card-text {
  font-size: 14px; line-height: 2; letter-spacing: .04em;
  color: var(--slate); margin: 0;
}

/* ---------- CTA Section ---------- */
.svc-cta {
  padding: 120px 0;
  background: var(--ink);
  color: #fff;
  position: relative; overflow: hidden;
}
.svc-cta .sec-watermark { bottom: -30px; right: -30px; color: rgba(255,255,255,.04) }
.svc-cta-inner {
  display: grid; grid-template-columns: 1fr 1fr; gap: 80px;
  align-items: end;
}
.svc-cta-lead {
  font-size: 17px; line-height: 2; letter-spacing: .06em;
  color: rgba(255,255,255,.85);
  margin: 32px 0 0;
}
.svc-cta-card {
  padding: 40px;
  border: 1px solid rgba(255,255,255,.2);
  background: rgba(255,255,255,.03);
}
.svc-cta-card .label {
  font-family: var(--mono); font-size: 11px; letter-spacing: .2em;
  color: rgba(255,255,255,.6); margin-bottom: 14px;
  display: flex; align-items: center; gap: 14px;
}
.svc-cta-card .label::before {
  content: ""; width: 24px; height: 1px; background: rgba(255,255,255,.4);
}
.svc-cta-tel {
  font-family: var(--en); font-weight: 500; font-size: 48px;
  line-height: 1; letter-spacing: .02em;
  margin: 0 0 6px; display: block;
}
.svc-cta-hours {
  font-size: 13px; letter-spacing: .14em;
  color: rgba(255,255,255,.7); margin-bottom: 28px;
}
.svc-cta-actions { display: flex; gap: 14px; flex-wrap: wrap }

/* ============================================================
   Responsive — Services page
   ============================================================ */
@media (max-width: 1100px) {
  .lead-grid { grid-template-columns: 1fr; gap: 48px }
  .mfg-grid { grid-template-columns: 1fr }
  .dist-grid { grid-template-columns: 1fr }
  .cat-grid { grid-template-columns: repeat(2, 1fr) }
  .str-grid { grid-template-columns: 1fr }
  .svc-cta-inner { grid-template-columns: 1fr; gap: 48px }
}
@media (max-width: 720px) {
  .page-hero { height: 220px }
  .page-hero .container { padding-bottom: 28px }
  .page-hero-title { font-size: clamp(36px, 10vw, 56px) }
  .lead-section, .manufacturing, .distribution,
  .categories, .strengths, .svc-cta { padding: 72px 0 }
  .lead-body { font-size: 15px; line-height: 2 }
  .mfg-card, .dist-card, .str-card { padding: 28px 22px }
  .mfg-card-title { font-size: 22px }
  .mfg-card-text { font-size: 14px }
  .dist-card-title { font-size: 18px }
  .cat-grid { grid-template-columns: 1fr }
  .cat-item { padding: 22px 20px }
  .str-card-num { font-size: 36px }
  .str-card-title { font-size: 16px }
  .svc-cta-tel { font-size: 32px }
  .svc-cta-card { padding: 28px 20px }
  .svc-cta-hours { font-size: 12px }
  .btn-fill { min-width: auto; width: 100%; font-size: 12px; padding: 18px 20px }
}