/* わかば紹介LP スタイル（清潔感・安心感重視、既存LPと統一デザイン） */
:root {
  --wakaba-green: #0A4A49;
  --wakaba-orange: rgb(224, 92, 42);
  --wakaba-line: #06C755;
  --wakaba-cream: #F6F4EC;
  --wakaba-beige: #FAF7F0;
  --wakaba-text: #333;
  --wakaba-border: #e3e9e5;
  --wakaba-gift-border: #D9C9A3;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  color: var(--wakaba-text);
  line-height: 1.8;
  padding-bottom: 70px;
  background: #fff;
}
h1, h2, h3 { color: var(--wakaba-green); margin: 0 0 16px; line-height: 1.4; }
h2 { font-size: 1.6em; text-align: center; }
h3 { font-size: 1.15em; }
p { margin: 0 0 14px; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }

.lp-header {
  display: flex; align-items: center; padding: 14px 20px;
  background: #fff; border-bottom: 1px solid var(--wakaba-border);
}
.lp-logo { display: flex; align-items: center; gap: 8px; font-weight: 700; text-decoration: none; color: var(--wakaba-green); }
.lp-logo img { width: 32px; height: 32px; }

/* ①ヒーロー */
.hero { max-width: 900px; margin: 0 auto; padding: 36px 20px; text-align: center; background: var(--wakaba-beige); }
.hero-eyebrow { color: #8a7a5c; font-size: 14px; font-weight: 700; letter-spacing: .02em; }
.hero h1 { font-size: clamp(28px, 5vw, 40px); }
.hero-lead { font-size: 15px; margin-top: 8px; }
.hero-image { border-radius: 0; margin: 24px auto 0; max-width: 600px; box-shadow: 0 4px 16px rgba(0,0,0,.08); }
@media (min-width: 981px) {
  .hero { display: grid; grid-template-columns: minmax(0,1fr) minmax(400px,0.9fr); align-items: center; gap: 40px; text-align: left; max-width: 1100px; }
  .hero-copy { display: flex; flex-direction: column; justify-content: center; }
  .hero-image { margin: 0; }
}
@media (max-width: 980px) { .hero-image { order: -1; } }
@media (max-width: 600px) { .hero-image { max-height: 280px; object-fit: cover; } }

/* 特典ボックス（共通） */
.gift-box {
  background: #fff; border: 2px solid var(--wakaba-gift-border); border-radius: 12px;
  padding: 20px 24px; margin: 20px 0; text-align: center;
}
.gift-label { font-size: 14px; font-weight: 700; color: var(--wakaba-orange); margin-bottom: 6px; }
.gift-main { font-size: 1.6em; font-weight: 700; color: var(--wakaba-green); margin-bottom: 4px; }
.gift-main strong { color: var(--wakaba-orange); font-size: 1.3em; }
.gift-plus { font-size: 15px; font-weight: 700; color: var(--wakaba-green); margin: 0; }

.hero-cta, .final-cta-buttons { display: flex; justify-content: center; margin-top: 16px; }
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  height: 56px; padding: 0 32px; border-radius: 28px; text-decoration: none;
  font-weight: 700; font-size: 16px; min-width: 260px;
}
.btn-line { background: var(--wakaba-line); color: #fff; }

/* ②こんなお悩み */
.worries { max-width: 800px; margin: 0 auto; padding: 44px 20px; text-align: center; }
.worries-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; max-width: 500px; margin: 0 auto 20px; }
.worry-card { background: var(--wakaba-cream); border-radius: 10px; padding: 18px 8px; font-weight: 700; color: var(--wakaba-green); font-size: 14px; }
.worries-note { font-size: 14px; color: #666; }

/* ③紹介特典 */
.gift-section { background: var(--wakaba-beige); padding: 44px 20px; }
.gift-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; max-width: 800px; margin: 24px auto 0; }
.gift-card { background: #fff; border: 1px solid var(--wakaba-gift-border); border-radius: 14px; padding: 28px 20px; text-align: center; }
.gift-card-label { font-weight: 700; color: var(--wakaba-orange); margin-bottom: 10px; font-size: 14px; }
.gift-card h3 { font-size: 1.3em; }
.gift-card p { font-size: 14px; color: #555; margin-bottom: 0; }

/* ④わかばについて */
.about { max-width: 900px; margin: 0 auto; padding: 44px 20px; text-align: center; }
.about-photos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 24px; }
.about-photos img { aspect-ratio: 1/1; object-fit: cover; border-radius: 8px; }

/* ⑤初回の流れ */
.flow { background: var(--wakaba-cream); padding: 44px 20px; }
.flow-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 16px; max-width: 900px; margin: 24px auto 0; text-align: center; }
.flow-step { background: #fff; border-radius: 12px; padding: 20px 12px; }
.step-num { display: block; font-size: 28px; font-weight: 700; color: var(--wakaba-orange); margin-bottom: 6px; }
.flow-step h3 { font-size: 14px; margin: 0; }

/* ⑥反り腰猫背チェック */
.check-detail { max-width: 800px; margin: 0 auto; padding: 44px 20px; text-align: center; }
.check-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; margin-top: 24px; text-align: left; }
.check-card { background: #fff; border: 1px solid var(--wakaba-border); border-radius: 14px; padding: 20px; }
.check-card p { font-size: 14px; margin-bottom: 0; }

/* ⑦Philosophy */
.philosophy {
  max-width: 800px; margin: 44px auto; padding: 36px 24px; text-align: center;
  background: var(--wakaba-green); border-radius: 12px;
}
.philosophy h2 { color: #fff; }
.philosophy p { color: rgba(255,255,255,.9); font-size: 15px; }

/* ⑧紹介方法 */
.how-to { max-width: 800px; margin: 0 auto; padding: 44px 20px; text-align: center; }
.how-to-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 16px; margin: 24px 0; }
.how-to-step { background: var(--wakaba-cream); border-radius: 12px; padding: 20px 12px; }
.how-to-step p { font-size: 14px; margin: 0; }
.how-to-note { font-weight: 700; color: var(--wakaba-green); margin-top: 20px; }
.how-to-list { list-style: none; padding: 0; max-width: 500px; margin: 12px auto 0; text-align: left; }
.how-to-list li { padding: 10px 0 10px 28px; border-bottom: 1px solid var(--wakaba-border); position: relative; font-size: 14px; }
.how-to-list li::before { content: "・"; position: absolute; left: 8px; color: var(--wakaba-orange); font-weight: 700; }

/* ⑨最終CTA */
.final-cta { background: var(--wakaba-beige); padding: 48px 20px; }
.final-cta-inner { max-width: 600px; margin: 0 auto; text-align: center; }
.gift-box-final { background: var(--wakaba-cream); }
.final-note { font-size: 13px; color: #666; margin-top: 12px; }
.final-sub { font-size: 13px; }
.final-sub a { color: var(--wakaba-green); text-decoration: underline; }

/* フッター */
.lp-footer { background: var(--wakaba-green); color: #fff; text-align: center; padding: 32px 20px; font-size: 13px; }
.lp-footer img { width: 32px; margin: 0 auto 8px; }
.lp-footer a { color: #fff; text-decoration: underline; }

/* LINE固定バー */
.mobile-bar {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 100; height: 60px;
}
.mobile-bar a {
  display: flex; align-items: center; justify-content: center; height: 100%;
  background: var(--wakaba-line); color: #fff; text-decoration: none;
  font-weight: 700; font-size: 16px;
}

@media (max-width: 600px) {
  .worries-grid { grid-template-columns: repeat(2, 1fr); }
  .about-photos { grid-template-columns: repeat(3, 1fr); }
  .btn { min-width: 0; width: 100%; }
}