:root {
  --warm:    #FAF7F2;
  --sand:    #F0E9DF;
  --dark:    #3D2E1A;
  --mid:     #5A4A36;
  --muted:   #8A7560;
  --light:   #C8B89A;
  --green:   #4A6741;
  --green-d: #3D5836;
  --cream:   #FDFAF4;
  --rust:    #B5541C;
}

html { scroll-behavior: smooth; }

/* 共通グリーンボタン */
.btn-green {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  background-color: var(--green);
  color: var(--cream);
  padding: 1rem 2.5rem;
  border-radius: 9999px;
  font-family: 'Klee One', cursive;
  font-weight: 600;
  font-size: 1.05rem;
  letter-spacing: 0.06em;
  box-shadow: 0 4px 14px rgba(0,0,0,0.2);
  min-width: 240px;
  transition: background-color 0.2s;
  text-decoration: none;
}
.btn-green:hover { background-color: var(--green-d); }
.btn-green .btn-arrow {
  position: absolute;
  right: 1.5rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.1rem;
  opacity: 0.85;
  line-height: 1;
}
.btn-green .btn-arrow-left {
  position: absolute;
  left: 1.5rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.2rem;
  opacity: 0.85;
  line-height: 1;
}
body { font-family: 'Klee One', cursive; background: var(--warm); color: var(--dark); font-size: 16px; }
@media (min-width: 1024px) { body { font-size: 17px; } }

.fm, .fk { font-family: 'Klee One', cursive; }

/* 背景色 */
.bg-warm    { background-color: var(--warm)    !important; }
.bg-sand    { background-color: var(--sand)    !important; }
.bg-dark    { background-color: var(--dark)    !important; }
.bg-green   { background-color: var(--green)   !important; }
.bg-green-d { background-color: var(--green-d) !important; }
.bg-cream   { background-color: var(--cream)   !important; }

/* テキスト色 */
.text-dark  { color: var(--dark)  !important; }
.text-mid   { color: var(--mid)   !important; }
.text-muted { color: var(--muted) !important; }
.text-light { color: var(--light) !important; }
.text-green { color: var(--green) !important; }
.text-cream { color: var(--cream) !important; }
.text-rust  { color: var(--rust)  !important; }

/* ボーダー色 */
.border-dark { border-color: var(--dark) !important; }

/* ホバー */
.hover\:bg-green-d:hover { background-color: var(--green-d) !important; }
.hover\:text-green:hover { color: var(--green) !important; }

/* Tailwindのfrom-darkをCSS変数で上書き（グラデーション用） */
.from-dark { --tw-gradient-from: var(--dark) !important; }

/* KVセクション */
.kv-section { height: 90vh; }
.kv-img     { position: absolute; inset: 0; }

@media (max-width: 1023px) {
  .kv-section   { height: 100vw; }
  .kv-img       { object-position: center center !important; }
  section.py-24 { padding-top: 3rem !important; padding-bottom: 3rem !important; }
  section.py-20 { padding-top: 2.5rem !important; padding-bottom: 2.5rem !important; }
}

@media (max-width: 639px) {
  .kv-section        { height: auto !important; }
  .kv-section picture { display: block; }
  .kv-img            { position: relative !important; inset: auto !important; width: 100%; height: auto !important; object-fit: cover !important; display: block; }
}

/* ケーススタディ アコーディオン */
.case-accordion { border-radius: 1rem; overflow: hidden; margin-bottom: 0.75rem; border: 1px solid #E8E0D8; }
.case-accordion summary { list-style: none; cursor: pointer; padding: 1rem 1.25rem; display: flex; align-items: center; justify-content: space-between; background: #fff; font-family: 'Klee One', cursive; font-size: 0.875rem; font-weight: 700; color: var(--dark); letter-spacing: 0.04em; }
.case-accordion summary::-webkit-details-marker { display: none; }
.case-accordion summary .arrow { transition: transform 0.25s; font-size: 0.7rem; color: #B8A88A; }
.case-accordion[open] summary .arrow { transform: rotate(180deg); }
.case-content { padding: 1rem; background: #fff; border-top: 1px solid #E8E0D8; }

/* 見出しマーカーハイライト */
.mark { position:relative; display:inline-block; }
.mark::before {
  content:'';
  position:absolute;
  left:-2px; right:-2px;
  bottom:1px;
  height:11px;
  border-radius:4px;
  z-index:0;
}
.mark > * { position:relative; z-index:1; }
.mark-pink::before  { background:rgba(240,160,176,0.4); }
.mark-green::before { background:rgba(122,184,112,0.28); }

/* ケーススタディ */
.cs-card-engawa { background:#EEF5EC; }
.cs-card-other  { background:#F0F0F0; }
.cs-badge { display:inline-block; padding:0.25rem 1rem; border-radius:9999px; font-family:'Klee One',cursive; font-size:0.82rem; font-weight:400; line-height:1.4; }
.cs-badge-engawa { background:#4A6741; color:#FAF7F2; }
.cs-badge-other  { background:#A0A0A0; color:#FAF7F2; }
.cs-price { font-size:1.5rem; font-family:'Klee One',cursive; }
.cs-price-engawa { font-weight:600; color:#2E4228; }
.cs-price-other  { font-weight:400; color:#3D2E1A; opacity:0.8; }
.cs-price-unit { font-family:'Klee One',cursive; font-size:0.65rem; font-weight:300; }
.cs-price-unit-engawa { color:#6A8E62; }
.cs-price-unit-other  { color:#8A7560; }
.cs-breakdown { display:flex; flex-direction:column; gap:0.25rem; font-size:0.75rem; font-family:'Klee One',cursive; border-top-width:1px; border-top-style:solid; padding-top:0.5rem; margin-top:0.75rem; font-weight:300; }
.cs-breakdown-engawa { border-color:#C8DCC4; color:#6A8E62; }
.cs-breakdown-other  { border-color:#D8D8D8; color:#8A8A8A; margin-top:0; }
.cs-row { display:flex; justify-content:space-between; }
.cs-underline { position:absolute; bottom:-6px; right:0; width:120px; height:8px; }

/* ケース3 二重線 PC拡張 */
@media (min-width: 640px) {
  .case3-underline { width: 240px !important; }
}

/* SP 行間抑制 */
@media (max-width: 639px) {
  .sp-lh-tight { line-height: 1.55 !important; }
}

/* きっかけ ruby dots SP 詰め */
@media (max-width: 639px) {
  h2 ruby rt { line-height: 0.2 !important; transform: translateY(3px); }
}

/* フィーチャーエリア画像コンテナ */
.feat-img-wrap { height: 120px; }
@media (min-width: 640px) { .feat-img-wrap { height: 160px; } }

/* 空間ページ：写真プレースホルダー */
.photo-placeholder {
  background: #E8E2D8;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #A89880;
  font-size: 0.8rem;
  font-family: 'Klee One', cursive;
  letter-spacing: 0.05em;
}