/* ============================================================
  内装リフォームページ専用スタイル（naiso.css）
  共通スタイル css/style.css + css/gaiheki.css を継承し、
  このページ固有のセクションのみここで定義します。
============================================================ */

/* ============================================================
  リフォームメニューセクション
============================================================ */
.naiso-menu-section {
  background: var(--navy);
  padding: 88px 0 72px;
}
.naiso-menu-section .section-eyebrow {
  background: rgba(200,168,90,.15);
  border-color: rgba(200,168,90,.3);
}
.naiso-menu-section .section-title { color: var(--white); }
.naiso-menu-section .section-copy  { color: rgba(255,255,255,.75); }

.naiso-menu-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  margin-top: 48px;
}

.naiso-menu-card {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--r-xl);
  overflow: hidden;
  transition: transform var(--dur-fast) var(--ease-soft),
              box-shadow var(--dur-fast) var(--ease-soft);
}
@media (hover:hover) {
  .naiso-menu-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 48px rgba(0,0,0,.3);
  }
  .naiso-menu-card:hover .naiso-menu-card__img img {
    transform: scale(1.04);
  }
}

.naiso-menu-card__img {
  aspect-ratio: 3 / 2;
  overflow: hidden;
}
.naiso-menu-card__img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .6s var(--ease-soft);
}

.naiso-menu-card__body {
  padding: 22px 20px 20px;
}
.naiso-menu-card h3 {
  font-family: var(--font-heading);
  font-size: 18px;
  line-height: 1.5;
  color: var(--white);
  margin-bottom: 10px;
}
.naiso-menu-card p {
  font-size: 13px;
  line-height: 1.9;
  color: rgba(255,255,255,.68);
  font-family: var(--font-body);
}
.naiso-menu-card__price {
  margin-top: 14px;
  font-family: var(--font-body);
  font-size: 12px;
  color: rgba(255,255,255,.55);
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.1);
}
.naiso-menu-card__price span {
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 700;
  color: var(--gold);
  margin-left: 4px;
}

/* ============================================================
  レスポンシブ
============================================================ */
@media (max-width: 1024px) {
  .naiso-menu-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  .naiso-menu-section { padding: 64px 0 52px; }
  .naiso-menu-grid    { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .naiso-menu-card h3 { font-size: 16px; }
}

@media (max-width: 640px) {
  .naiso-menu-grid { grid-template-columns: 1fr; }
}
