/*
Theme Name: 退職給付金ドットコム LP（男女兼用版）
Theme URI: https://taishoku-kyufu.com/
Author: 株式会社HIKARI
Author URI: https://hp.hikari-work.co.jp/
Description: 退職給付金ドットコム専用LPテーマ。有効化時に法定3ページ（プライバシー／特商法／運営会社）を自動作成＋テンプレ自動割当。Meta Pixel・Microsoft Clarity対応。
Version: 1.8.0
Tested up to: 6.7
Requires at least: 5.0
Requires PHP: 7.4
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: taishoku-kyufu-mens
*/

:root {
  --text:#1A2C4D;
  --text-2:#4A5568;
  --text-3:#8A93A0;
  --bg:#FFFFFF;
  --bg-cream:#F4F1EA;
  --bg-soft:#F7F4ED;
  /* Primary = Navy（信頼） */
  --coral:#1B4D8C;
  --coral-2:#0E3266;
  --coral-light:#DCE7F2;
  --coral-bg:#F0F4FA;
  /* Accent = Orange（行動・強調） */
  --accent:#FF7A00;
  --accent-2:#D86200;
  --accent-light:#FFE0C2;
  --accent-bg:#FFF6EB;
  /* Highlight */
  --gold:#FFC83D;
  --hl:#FFE066;
  /* CTA Green */
  --line:#06C755;
  --line-dark:#04A546;
  /* UI */
  --border:#E2DDD0;
  --shadow-sm:0 2px 8px rgba(27,77,140,.10);
  --shadow-md:0 8px 24px rgba(0,0,0,.07);
  --shadow-lg:0 12px 40px rgba(27,77,140,.16);
}
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
  color:var(--text);
  background:var(--bg-cream);
  line-height:1.7;
  font-weight:500;
  font-size:15px;
  -webkit-font-smoothing:antialiased;
}
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }
.wrapper {
  max-width:480px;
  margin:0 auto;
  background:#FFFFFF;
  overflow:hidden;
  box-shadow:0 0 30px rgba(0,0,0,.06);
  padding-bottom:80px;
}
.hl { background:linear-gradient(transparent 60%, var(--hl) 60%); padding:0 2px; }
.num-serif { font-family:"Noto Serif JP",serif; font-weight:900; }

/* ============== HEADER ============== */
.site-header {
  position:sticky;
  top:0;
  z-index:100;
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  border-bottom:1px solid var(--border);
  padding:8px 14px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.logo {
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:900;
  font-size:14px;
  color:var(--text);
  line-height:1.2;
}
.logo-mark {
  width:30px; height:30px;
  background:linear-gradient(135deg,var(--coral) 0%,var(--coral-2) 100%);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:#fff;
  font-family:"Noto Serif JP",serif;
  font-size:15px;
  box-shadow:0 2px 8px rgba(27,77,140,.32);
}
.logo small { display:block; font-size:9px; color:var(--text-3); font-weight:700; line-height:1; margin-top:3px; letter-spacing:.04em; }
.header-cta {
  background:var(--accent);
  color:#fff;
  padding:8px 14px;
  border-radius:20px;
  font-size:12px;
  font-weight:900;
  display:flex;
  align-items:center;
  gap:5px;
  box-shadow:0 2px 6px rgba(255,122,0,.35);
}
.header-cta::before { content:"📞"; font-size:13px; }

/* ============== URGENT BANNER ============== */
.urgent {
  background:var(--text);
  color:#fff;
  text-align:center;
  padding:9px 14px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
}
.urgent .pulse {
  display:inline-block;
  width:8px; height:8px;
  background:var(--accent);
  border-radius:50%;
  margin-right:7px;
  animation:pulse 1.5s infinite;
  vertical-align:middle;
}
.urgent b { color:var(--gold); }
@keyframes pulse {
  0%,100% { opacity:1; transform:scale(1); }
  50% { opacity:.5; transform:scale(1.3); }
}

/* ============== HERO ============== */
.hero {
  position:relative;
  background:#1a1a1a;
  color:#fff;
  overflow:hidden;
  padding:30px 16px 30px;
}
.hero-bg {
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(26,26,26,.45) 0%, rgba(26,26,26,.78) 70%, rgba(26,26,26,.92) 100%),
    url('images/hero.jpg') center center/cover;
  z-index:0;
}
.hero-bg::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 60%, var(--coral-2) 220%);
  opacity:.4;
}
.hero-content { position:relative; z-index:2; }
.hero-tag {
  display:inline-block;
  background:var(--gold);
  color:var(--text);
  padding:5px 14px;
  border-radius:20px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.06em;
  margin-bottom:14px;
}
.hero-tag::before { content:"★ "; }
.hero-loss-prefix {
  color:var(--gold);
  font-size:14px;
  font-weight:900;
  margin-bottom:6px;
  letter-spacing:.04em;
}
.hero-loss-prefix::before { content:"⚠ "; }
.hero-headline {
  font-family:"Noto Serif JP",serif;
  font-size:30px;
  font-weight:900;
  line-height:1.35;
  letter-spacing:.02em;
  margin-bottom:12px;
  text-shadow:0 2px 12px rgba(0,0,0,.4);
}
.hero-headline .arrow {
  color:var(--gold);
  font-family:sans-serif;
  margin:0 4px;
}
.hero-headline .big {
  color:var(--gold);
  font-size:46px;
  display:inline-block;
  line-height:1;
}
.hero-headline .strike {
  color:#A8B5C8;
  text-decoration:line-through;
  text-decoration-color:var(--accent);
  text-decoration-thickness:3px;
  font-size:22px;
}
.hero-sub {
  font-size:14px;
  margin-bottom:18px;
  opacity:.95;
  line-height:1.65;
}
.hero-sub strong { color:var(--gold); font-weight:900; }
.trust-row {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:6px;
  margin-bottom:16px;
}
.trust-pill {
  background:rgba(255,255,255,.1);
  backdrop-filter:blur(4px);
  border:1px solid rgba(255,217,61,.3);
  border-radius:8px;
  padding:8px 6px;
  text-align:center;
  font-size:11px;
  font-weight:700;
}
.trust-pill .num {
  display:block;
  font-family:"Noto Serif JP",serif;
  font-size:20px;
  font-weight:900;
  color:var(--gold);
  line-height:1;
  margin-bottom:3px;
}
.trust-pill .num small { font-size:11px; }

.line-cta {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  background:var(--line);
  color:#fff;
  padding:20px 18px;
  border-radius:50px;
  font-size:19px;
  font-weight:900;
  letter-spacing:.04em;
  text-align:center;
  box-shadow:0 6px 0 var(--line-dark), 0 10px 28px rgba(6,199,85,.45);
  border:2px solid #fff;
  margin-top:4px;
  position:relative;
  overflow:hidden;
  animation:ctaPulse 1.8s ease-in-out infinite;
}
.line-cta::after {
  content:"";
  position:absolute;
  top:0; bottom:0;
  left:-60%;
  width:40%;
  background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.55) 50%, transparent 100%);
  transform:skewX(-20deg);
  animation:ctaShine 2.6s ease-in-out infinite;
  pointer-events:none;
}
.line-cta:active {
  transform:translateY(2px);
  box-shadow:0 4px 0 var(--line-dark), 0 6px 14px rgba(6,199,85,.35);
  animation-play-state:paused;
}
.line-cta::before {
  content:"";
  display:inline-block;
  width:22px;
  height:22px;
  flex-shrink:0;
  background-color:#fff;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'><path d='M19.23 15.26l-2.54-.29a1.99 1.99 0 0 0-1.64.57l-1.84 1.84a15.07 15.07 0 0 1-6.59-6.59l1.85-1.85c.43-.43.64-1.03.57-1.64l-.29-2.52A2.01 2.01 0 0 0 6.75 3H5.03c-1.13 0-2.07.94-2 2.07.53 8.54 7.36 15.36 15.89 15.89 1.13.07 2.07-.87 2.07-2v-1.72c.01-1.01-.75-1.86-1.76-1.98z'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'><path d='M19.23 15.26l-2.54-.29a1.99 1.99 0 0 0-1.64.57l-1.84 1.84a15.07 15.07 0 0 1-6.59-6.59l1.85-1.85c.43-.43.64-1.03.57-1.64l-.29-2.52A2.01 2.01 0 0 0 6.75 3H5.03c-1.13 0-2.07.94-2 2.07.53 8.54 7.36 15.36 15.89 15.89 1.13.07 2.07-.87 2.07-2v-1.72c.01-1.01-.75-1.86-1.76-1.98z'/></svg>") center/contain no-repeat;
  position:relative;
  z-index:1;
}
@keyframes ctaPulse {
  0%, 100% { transform:scale(1); box-shadow:0 6px 0 var(--line-dark), 0 10px 28px rgba(6,199,85,.45); }
  50% { transform:scale(1.025); box-shadow:0 7px 0 var(--line-dark), 0 14px 36px rgba(6,199,85,.55); }
}
@keyframes ctaShine {
  0% { left:-60%; }
  60%, 100% { left:120%; }
}
.cta-note {
  text-align:center;
  font-size:11px;
  margin-top:10px;
  opacity:.9;
}

/* ============== LEGAL ASSURE（違法ではない訴求）============== */
.legal-assure {
  background:linear-gradient(180deg, #FFF8EC 0%, #fff 100%);
  padding:36px 16px 32px;
  border-bottom:1px solid var(--border);
  position:relative;
}
.legal-assure .legal-eyebrow {
  display:block;
  text-align:center;
  background:var(--line);
  color:#fff;
  font-size:11px;
  font-weight:900;
  letter-spacing:.15em;
  padding:5px 14px;
  border-radius:999px;
  width:fit-content;
  margin:0 auto 10px;
  box-shadow:0 3px 10px rgba(6,199,85,.3);
}
.legal-assure .legal-eyebrow::before { content:"✓ "; }
.legal-assure .section-title {
  margin-bottom:8px;
}
.legal-lead {
  text-align:center;
  font-size:13px;
  color:var(--text-2);
  line-height:1.8;
  margin-bottom:22px;
}
.legal-lead b { color:var(--line-dark); }
.legal-points { display:flex; flex-direction:column; gap:10px; }
.legal-point {
  display:flex;
  gap:14px;
  background:#fff;
  border:1px solid var(--border);
  border-left:4px solid var(--line);
  border-radius:10px;
  padding:14px 14px;
  box-shadow:0 2px 8px rgba(6,199,85,.08);
  align-items:flex-start;
}
.legal-check {
  flex:0 0 34px;
  width:34px; height:34px;
  background:var(--line);
  color:#fff;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  font-size:17px;
  line-height:1;
  box-shadow:0 3px 8px rgba(6,199,85,.3);
  margin-top:2px;
}
.legal-body { flex:1; min-width:0; }
.legal-body h4 {
  font-size:14px;
  font-weight:900;
  color:var(--text);
  margin-bottom:4px;
  line-height:1.5;
}
.legal-body h4 .hl-green { color:var(--line-dark); }
.legal-body p {
  font-size:12px;
  color:var(--text-2);
  line-height:1.7;
}
.legal-base {
  margin-top:14px;
  text-align:center;
  font-size:10.5px;
  color:var(--text-3);
  line-height:1.6;
}
.legal-base b { color:var(--text-2); font-weight:700; }

/* ============== INTERVIEW VIDEO ============== */
.interview {
  background:#fff;
  padding:36px 16px 32px;
  border-bottom:1px solid var(--border);
}
.interview-video {
  background:#0a0e18;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 12px 32px rgba(0,0,0,.18);
  position:relative;
  aspect-ratio:16/9;
  margin:0 auto;
}
.interview-video video {
  width:100%; height:100%;
  display:block;
  background:#000;
  object-fit:contain;
}
.interview-meta {
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:14px;
  padding:12px 14px;
  background:linear-gradient(135deg, var(--coral) 0%, var(--coral-2) 100%);
  color:#fff;
  border-radius:10px;
}
.interview-tag {
  display:inline-block;
  background:var(--accent);
  color:#fff;
  padding:4px 10px;
  border-radius:20px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.05em;
  flex:0 0 auto;
}
.interview-caption {
  font-size:12.5px;
  font-weight:700;
  line-height:1.5;
  flex:1;
}
.interview-caption b { color:var(--gold); }
.interview-fallback {
  background:#222;
  color:#aaa;
  padding:60px 20px;
  text-align:center;
  font-size:13px;
  line-height:1.7;
}

/* ============== アドバイザー ============== */
.leader {
  background:#fff;
  padding:32px 16px;
  display:flex;
  gap:16px;
  align-items:center;
  border-bottom:1px solid var(--border);
}
.leader-photo {
  flex:0 0 110px;
  width:110px;
  height:130px;
  border-radius:12px;
  overflow:hidden;
  background:#D4C4B8;
  box-shadow:0 6px 16px rgba(0,0,0,.12);
  border:3px solid #fff;
}
.leader-photo img { width:100%; height:100%; object-fit:cover; }
.leader-body { flex:1; min-width:0; }
.leader-tag {
  display:inline-block;
  background:var(--coral-light);
  color:var(--coral-2);
  padding:3px 10px;
  border-radius:8px;
  font-size:10px;
  font-weight:900;
  margin-bottom:8px;
}
.leader-quote {
  font-family:"Noto Serif JP",serif;
  font-size:17px;
  font-weight:900;
  line-height:1.45;
  color:var(--text);
  margin-bottom:10px;
  padding-left:10px;
  border-left:3px solid var(--coral);
}
.leader-name { margin-bottom:6px; font-size:13px; }
.leader-name strong { font-weight:900; margin-right:6px; }
.leader-name small {
  font-size:10px;
  color:var(--text-3);
  display:block;
  margin-top:2px;
}
.leader-text {
  font-size:11px;
  color:var(--text-2);
  line-height:1.7;
}

/* ============== セクション共通 ============== */
.section-eyebrow {
  text-align:center;
  color:var(--coral);
  font-weight:900;
  font-size:12px;
  letter-spacing:.18em;
  margin-bottom:8px;
}
.section-eyebrow::before, .section-eyebrow::after { content:"─"; margin:0 8px; opacity:.5; }
.section-title {
  text-align:center;
  font-family:"Noto Serif JP",serif;
  font-size:22px;
  font-weight:900;
  line-height:1.5;
  margin-bottom:24px;
  color:var(--text);
}
.section-title .hl { font-style:normal; }

/* ============== PAIN ============== */
.pain {
  background:var(--bg-cream);
  padding:40px 16px;
  position:relative;
}
.pain-photo-wrap {
  position:relative;
  margin:0 -16px;
  height:280px;
  background:
    linear-gradient(180deg, transparent 0%, rgba(250,246,242,.95) 90%),
    url('images/pain.jpg') center 30%/cover,
    #D4C4B8;
}
.pain-bubbles {
  margin-top:-120px;
  position:relative;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  padding:0 4px;
}
.bubble {
  background:#fff;
  color:var(--text);
  padding:12px 10px;
  border-radius:14px;
  text-align:center;
  font-size:12px;
  font-weight:700;
  line-height:1.5;
  box-shadow:0 8px 20px rgba(0,0,0,.08);
  border:1px solid var(--border);
  position:relative;
}
.bubble strong { color:var(--accent-2); display:inline; font-weight:900; }

/* ============== SOLUTION ============== */
.solution {
  background:linear-gradient(180deg, var(--bg-soft), var(--coral-light));
  padding:32px 16px;
  text-align:center;
}
.solution-flag {
  display:inline-block;
  background:var(--coral);
  color:#fff;
  padding:8px 22px;
  border-radius:30px;
  font-size:12px;
  font-weight:700;
  margin-bottom:16px;
  position:relative;
}
.solution-flag::after {
  content:"▼";
  color:var(--coral);
  position:absolute;
  bottom:-16px;
  left:50%;
  transform:translateX(-50%);
  font-size:14px;
}
.solution-title {
  font-family:"Noto Serif JP",serif;
  font-size:22px;
  font-weight:900;
  line-height:1.5;
  color:var(--text);
  margin-bottom:8px;
}
.solution-title em { font-style:normal; color:var(--accent-2); }
.solution-sub { color:var(--text-2); font-size:13px; }

/* ============== VALUE BOX ============== */
.value-box {
  margin:24px 16px;
  background:#fff;
  border:3px solid var(--coral);
  border-radius:16px;
  padding:20px 14px 18px;
  text-align:center;
  position:relative;
  box-shadow:var(--shadow-lg);
}
.value-tag {
  position:absolute;
  top:-14px; left:50%;
  transform:translateX(-50%);
  background:var(--coral);
  color:#fff;
  font-weight:900;
  padding:5px 18px;
  border-radius:20px;
  font-size:12px;
  white-space:nowrap;
}
.value-headline {
  font-weight:900;
  font-size:14px;
  margin:6px 0 12px;
  color:var(--text);
}
.value-price {
  display:flex;
  justify-content:center;
  align-items:baseline;
  gap:5px;
  margin:8px 0;
}
.value-price .label { font-size:13px; color:var(--text-2); font-weight:700; }
.value-price .num {
  font-family:"Noto Serif JP",serif;
  font-size:42px;
  font-weight:900;
  color:var(--accent-2);
  line-height:1;
}
.value-price .yen { font-size:18px; font-weight:900; color:var(--accent-2); }
.value-meta { font-size:11px; color:var(--text-3); margin-top:6px; }
.value-box .line-cta { margin-top:14px; }

/* ============== REASONS ============== */
.reasons { padding:40px 16px; background:#fff; }
.reason-card {
  background:var(--bg-cream);
  border-radius:14px;
  padding:18px 16px;
  margin-bottom:12px;
  display:flex;
  gap:14px;
  align-items:flex-start;
  border:1px solid var(--border);
}
.reason-num {
  flex:0 0 50px;
  height:50px;
  background:var(--coral);
  color:#fff;
  border-radius:50%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  line-height:1;
  box-shadow:0 4px 10px rgba(27,77,140,.3);
}
.reason-num small { font-size:9px; font-weight:700; }
.reason-num strong { font-family:"Noto Serif JP",serif; font-size:22px; font-weight:900; }
.reason-content { flex:1; }
.reason-content h3 { font-size:16px; font-weight:900; line-height:1.5; margin-bottom:5px; }
.reason-content p { font-size:12px; color:var(--text-2); line-height:1.7; }

/* ============== MECHANISM（仕組み解説）============== */
.mechanism {
  background:linear-gradient(180deg, #fff 0%, var(--accent-bg) 100%);
  padding:40px 16px 36px;
  border-bottom:1px solid var(--border);
}
.mechanism-lead {
  text-align:center;
  font-size:13px;
  color:var(--text-2);
  margin-top:-8px;
  margin-bottom:22px;
  line-height:1.7;
}
.mech-card {
  display:flex;
  gap:14px;
  align-items:flex-start;
  background:#fff;
  border:1px solid var(--border);
  border-left:4px solid var(--accent);
  border-radius:12px;
  padding:16px 14px;
  margin-bottom:10px;
  box-shadow:0 4px 14px rgba(255,122,0,.08);
}
.mech-num {
  flex:0 0 46px;
  width:46px; height:46px;
  background:linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%);
  color:#fff;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:"Noto Serif JP",serif;
  font-size:20px;
  font-weight:900;
  line-height:1;
  box-shadow:0 4px 10px rgba(255,122,0,.3);
}
.mech-body { flex:1; min-width:0; }
.mech-body h3 {
  font-size:15px;
  font-weight:900;
  color:var(--text);
  line-height:1.5;
  margin-bottom:5px;
}
.mech-body h3 .emp {
  color:var(--accent-2);
  background:linear-gradient(transparent 60%, var(--hl) 60%);
  padding:0 2px;
}
.mech-body p {
  font-size:12px;
  color:var(--text-2);
  line-height:1.7;
}
.mechanism-note {
  text-align:center;
  font-size:11px;
  color:var(--text-3);
  margin-top:14px;
  line-height:1.6;
}

/* ============== TESTIMONIALS ============== */
.testimonials { padding:40px 16px; background:#fff; }
.testi-card {
  background:var(--bg-cream);
  border-radius:16px;
  padding:18px;
  margin-bottom:14px;
  box-shadow:var(--shadow-sm);
  border:1px solid var(--border);
}
.testi-head {
  display:flex;
  gap:12px;
  align-items:center;
  margin-bottom:12px;
}
.testi-photo {
  width:64px; height:64px;
  border-radius:50%;
  background:#D4C4B8 center/cover;
  flex:0 0 64px;
  border:3px solid #fff;
  box-shadow:0 4px 12px rgba(0,0,0,.1);
  overflow:hidden;
}
.testi-photo img { width:100%; height:100%; object-fit:cover; }
.testi-meta { flex:1; }
.testi-name { font-weight:900; font-size:14px; }
.testi-job { font-size:11px; color:var(--text-3); }
.testi-stars { color:var(--gold); font-size:13px; letter-spacing:1px; }
.testi-result {
  background:#fff;
  border:2px dashed var(--accent);
  border-radius:10px;
  padding:10px 8px;
  margin-bottom:10px;
  display:flex;
  align-items:center;
  justify-content:space-around;
  gap:4px;
}
.testi-result .ba { text-align:center; flex:1; }
.testi-result .ba small {
  display:block;
  font-size:9px;
  color:var(--text-3);
  font-weight:700;
}
.testi-result .ba .v {
  font-family:"Noto Serif JP",serif;
  font-weight:900;
  color:var(--text-2);
  font-size:16px;
  line-height:1;
}
.testi-result .ba.up .v {
  color:var(--accent-2);
  font-size:22px;
}
.testi-result .arrow {
  color:var(--accent);
  font-weight:900;
  font-size:18px;
}
.testi-result .gain {
  background:var(--gold);
  color:var(--text);
  font-weight:900;
  padding:3px 9px;
  border-radius:12px;
  font-size:11px;
  margin-left:auto;
}
.testi-quote {
  font-size:13px;
  color:var(--text-2);
  line-height:1.75;
  position:relative;
  padding-left:14px;
}
.testi-quote::before {
  content:"“";
  position:absolute;
  left:-2px; top:-8px;
  font-family:"Noto Serif JP",serif;
  font-size:30px;
  color:var(--accent);
  line-height:1;
}

/* ============== STEPS ============== */
.steps { background:var(--bg-cream); padding:40px 16px; }
.step-list { position:relative; }
.step-list::before {
  content:"";
  position:absolute;
  left:26px;
  top:30px;
  bottom:30px;
  width:2px;
  background:var(--coral-light);
}
.step-item {
  display:flex;
  gap:14px;
  align-items:flex-start;
  background:#fff;
  border-radius:14px;
  padding:14px 14px 14px 12px;
  margin-bottom:10px;
  box-shadow:var(--shadow-sm);
  position:relative;
  border:1px solid var(--border);
}
.step-circle {
  flex:0 0 40px;
  height:40px;
  background:var(--coral);
  color:#fff;
  border-radius:50%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  line-height:1;
  box-shadow:0 4px 10px rgba(27,77,140,.3);
}
.step-circle small { font-size:8px; font-weight:700; }
.step-circle strong { font-family:"Noto Serif JP",serif; font-size:18px; font-weight:900; }
.step-circle.done { background:var(--gold); color:var(--text); }
.step-body { flex:1; }
.step-body h4 { font-size:15px; font-weight:900; margin-bottom:3px; }
.step-body p { font-size:12px; color:var(--text-2); line-height:1.6; }

/* ============== COMPARISON ============== */
.compare { padding:40px 16px; background:#fff; }
.compare-table {
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  background:#fff;
  border-radius:14px;
  overflow:hidden;
  box-shadow:var(--shadow-md);
  font-size:11px;
  border:1px solid var(--border);
}
.compare-table th, .compare-table td {
  padding:11px 5px;
  text-align:center;
  border-bottom:1px solid var(--border);
  border-right:1px solid var(--border);
}
.compare-table th:last-child, .compare-table td:last-child { border-right:none; }
.compare-table thead th {
  background:var(--bg-cream);
  font-weight:900;
  color:var(--text);
  font-size:11px;
  line-height:1.3;
}
.compare-table thead th.us {
  background:var(--coral);
  color:#fff;
}
.compare-table tbody th {
  background:var(--bg-cream);
  text-align:left;
  padding-left:8px;
  font-weight:700;
  font-size:10.5px;
}
.compare-table .yes { color:var(--accent-2); font-weight:900; font-size:16px; }
.compare-table .meh { color:var(--text-3); font-weight:900; }
.compare-table .no { color:#999; }
.compare-table td.us-cell {
  background:var(--coral-bg);
  font-weight:900;
  color:var(--coral-2);
}

/* ============== FAQ ============== */
.faq { padding:40px 16px; background:var(--bg-cream); }
.faq-item {
  background:#fff;
  border-radius:12px;
  margin-bottom:8px;
  overflow:hidden;
  border:1px solid var(--border);
}
.faq-q {
  display:flex;
  gap:10px;
  align-items:center;
  padding:14px;
  cursor:pointer;
  font-weight:700;
  font-size:13px;
  line-height:1.5;
  list-style:none;
}
.faq-q::-webkit-details-marker { display:none; }
.faq-q::after {
  content:"＋";
  margin-left:auto;
  color:var(--accent);
  font-weight:900;
  font-size:18px;
  transition:transform .2s;
}
.faq-item[open] .faq-q::after { content:"−"; }
.faq-q .qmark {
  flex:0 0 26px;
  height:26px;
  background:var(--coral);
  color:#fff;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:"Noto Serif JP",serif;
  font-weight:900;
}
.faq-a {
  padding:0 14px 14px 50px;
  font-size:12px;
  color:var(--text-2);
  line-height:1.8;
}

/* ============== CONTACT CTA ============== */
.contact-cta {
  background:linear-gradient(135deg, var(--coral) 0%, var(--coral-2) 100%);
  color:#fff;
  padding:36px 16px;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.contact-cta::before {
  content:"";
  position:absolute;
  top:-50%; right:-30%;
  width:200px; height:200px;
  background:rgba(255,255,255,.06);
  border-radius:50%;
}
.contact-cta-inner { position:relative; z-index:1; }
.contact-cta h2 {
  font-family:"Noto Serif JP",serif;
  font-size:22px;
  font-weight:900;
  line-height:1.5;
  margin-bottom:8px;
}
.contact-cta p { font-size:13px; margin-bottom:20px; opacity:.95; }
.contact-cta .line-cta {
  background:#fff;
  color:var(--coral-2);
  box-shadow:0 6px 0 rgba(255,255,255,.5), 0 10px 24px rgba(0,0,0,.2);
}

/* ============== FOOTER ============== */
.footer {
  background:var(--text);
  color:#DDD3CB;
  padding:30px 16px 24px;
  font-size:11px;
  line-height:1.8;
}
.footer-logo { font-weight:900; color:#fff; font-size:14px; margin-bottom:10px; }
.footer p { margin-bottom:8px; opacity:.8; }
.company-info { margin:14px 0; padding:12px 0; border-top:1px solid #444; border-bottom:1px solid #444; }
.company-info > div { display:flex; gap:10px; padding:4px 0; font-size:11px; }
.company-info dt { flex:0 0 60px; color:#fff; font-weight:700; opacity:.7; }
.company-info dd { flex:1; opacity:.9; }
.footer-links { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:14px; }
.footer-links a { color:var(--coral-light); }
.footer-copy { font-size:10px; opacity:.6; padding-top:10px; border-top:1px solid #444; }

/* ============== STICKY BOTTOM CTA ============== */
.sticky-cta {
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  z-index:90;
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(8px);
  border-top:1px solid var(--border);
  padding:8px 12px;
  display:flex;
  gap:8px;
  box-shadow:0 -4px 16px rgba(0,0,0,.08);
  max-width:480px; margin:0 auto;
}
.sticky-cta .line-cta {
  flex:1;
  padding:13px;
  font-size:13px;
  margin-top:0;
  box-shadow:0 3px 0 var(--line-dark);
}
.sticky-cta .tel-btn {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:13px 14px;
  background:var(--accent);
  color:#fff;
  border-radius:50px;
  font-size:12px;
  font-weight:900;
  box-shadow:0 3px 0 var(--accent-2);
}
.sticky-cta .tel-btn::before { content:"📞"; }

@media (max-width:360px) {
  .hero-headline { font-size:25px; }
  .hero-headline .big { font-size:34px; }
  .section-title { font-size:19px; }
  body { font-size:14px; }
}