/* ========================================
   LP専用スタイルシート
   設計基準: 黄金比(1:1.618) / 白銀比(1:1.414)
   osu10navi.site / LP/style.css
   ======================================== */

/* ▼ CSS変数（デザイントークン）▼ */
:root {
  /* --- フォントサイズ（黄金比・白銀比） --- */
  /* base=16px, 黄金比φ=1.618, 白銀比√2≒1.414 */
  --fs-xs:   11px;   /* 16 ÷ 1.414         */
  --fs-sm:   13px;   /* 16 ÷ 1.236         */
  --fs-base: 16px;   /* ベース              */
  --fs-md:   20px;   /* 16 × 1.236（白銀比） */
  --fs-lg:   26px;   /* 16 × 1.618（黄金比） */
  --fs-xl:   42px;   /* 16 × 1.618²        */

  /* --- カラーパレット（くすみカラー） --- */
  --color-main:    hsl(28, 58%, 54%);   /* テラコッタオレンジ（主役） */
  --color-main-d:  hsl(28, 58%, 44%);   /* 同 ダーク               */
  --color-main-l:  hsl(28, 58%, 94%);   /* 同 ペール               */
  --color-accent:  hsl(168, 32%, 44%);  /* セージグリーン（補色）    */
  --color-accent-l:hsl(168, 32%, 93%);  /* 同 ペール               */
  --color-danger:  hsl(0, 52%, 56%);    /* くすみレッド（警告）      */
  --color-danger-l:hsl(0, 52%, 96%);    /* 同 ペール               */
  --color-warn:    hsl(42, 72%, 52%);   /* くすみアンバー（注意）    */
  --color-warn-l:  hsl(42, 72%, 96%);   /* 同 ペール               */
  --color-bg:      hsl(40, 38%, 97%);   /* オフホワイト（背景）     */
  --color-surface: #ffffff;             /* カード背景              */
  --color-text:    hsl(220, 14%, 22%);  /* チャコールグレー（本文）  */
  --color-muted:   hsl(220, 10%, 50%);  /* ミュートグレー（補助文）  */
  --color-border:  hsl(220, 12%, 88%);  /* ボーダー                */

  /* --- スペーシング（黄金比） --- */
  --sp-xs:  8px;
  --sp-sm:  13px;   /* 8 × 1.618   */
  --sp-md:  21px;   /* 13 × 1.618  */
  --sp-lg:  34px;   /* 21 × 1.618  */
  --sp-xl:  55px;   /* 34 × 1.618  */

  /* --- コンテナ幅 --- */
  --container-w: 680px;   /* スマホ最適化メイン幅  */
  --container-outer: 720px;

  /* --- 角丸 --- */
  --radius-sm:  12px;
  --radius-md:  20px;
  --radius-lg:  32px;
  --radius-pill:9999px;

  /* --- シャドウ --- */
  --shadow-sm: 0 4px 12px hsla(220,14%,22%, 0.08);
  --shadow-md: 0 10px 32px hsla(220,14%,22%, 0.12);
  --shadow-lg: 0 24px 64px hsla(220,14%,22%, 0.16);
}

/* ▼ リセット＆ベース ▼ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
  font-family: "M PLUS Rounded 1c", "Hiragino Maru Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
  font-size: var(--fs-base);
  line-height: 1.75;
  color: var(--color-text);
  background-color: var(--color-bg);
  /* 薄いドット模様背景 */
  background-image: radial-gradient(circle, hsla(28,40%,60%,0.1) 1px, transparent 1px);
  background-size: 24px 24px;
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--color-main); text-decoration: none; }
a:hover { text-decoration: underline; }
ul, ol { list-style: none; }

/* ▼ レイアウト ▼ */
.lp-container {
  max-width: var(--container-w);
  margin-inline: auto;
  padding-inline: var(--sp-md);
}

.lp-section {
  padding-block: var(--sp-xl);
}

/* ▼ ヘッダー ▼ */
.lp-header {
  background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%);
  color: #fff;
  padding-block: var(--sp-xl);
  position: relative;
  overflow: hidden;
  text-align: center;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.lp-header::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 60%),
              radial-gradient(circle at 80% 20%, rgba(255,153,0,0.15) 0%, transparent 50%);
  animation: rotateMesh 20s linear infinite;
  pointer-events: none;
}

@keyframes rotateMesh {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.lp-header__badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: hsla(0,0%,100%,0.18);
  border: 1px solid hsla(0,0%,100%,0.35);
  border-radius: var(--radius-pill);
  padding: 6px 16px;
  font-size: var(--fs-sm);
  font-weight: 700;
  margin-bottom: var(--sp-sm);
  backdrop-filter: blur(4px);
}

.lp-header__title {
  font-size: clamp(20px, 6vw, var(--fs-xl));
  font-weight: 800;
  line-height: 1.4;
  letter-spacing: -0.02em;
  margin-bottom: var(--sp-sm);
  position: relative;
  font-feature-settings: "palt";
  word-break: keep-all;
  overflow-wrap: break-word;
  text-shadow: 0 2px 8px rgba(0,0,0,0.4);
}

.lp-header__title em {
  font-style: normal;
  background: hsla(42,100%,65%,0.9);
  color: hsl(28,60%,20%);
  padding: 2px 8px;
  border-radius: 6px;
  display: inline-block;
  white-space: nowrap; /* 枠内での改行を「絶対」に防ぐ */
}

.lp-header__sub {
  font-size: var(--fs-md);
  opacity: 0.9;
  font-weight: 600;
}

/* ▼ ナビちゃん吹き出し ▼ */
.navich-block {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-sm);
  margin-block: var(--sp-md);
}

.navich-block.navich-right {
  flex-direction: row-reverse;
}

.navich-block__img {
  width: 80px;        /* 白銀比: 80×1.414=113px → ちょうど吹き出しの高さと対応 */
  height: 80px;
  border-radius: 50%;
  border: 3px solid var(--color-main);
  object-fit: cover;
  flex-shrink: 0;
  background-color: var(--color-main-l);
  box-shadow: var(--shadow-sm);
}

.navich-block__name {
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--color-main);
  text-align: center;
  margin-top: 4px;
}

.navich-block__bubble {
  background: var(--color-surface);
  border-radius: var(--radius-md);
  padding: var(--sp-md);
  box-shadow: var(--shadow-sm);
  border: 2px solid var(--color-border);
  position: relative;
  flex: 1;
}

/* 吹き出しのしっぽ（左向き）*/
.navich-block__bubble::before {
  content: '';
  position: absolute;
  left: -12px;
  top: 20px;
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right: 12px solid var(--color-border);
}
.navich-block__bubble::after {
  content: '';
  position: absolute;
  left: -9px;
  top: 22px;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-right: 10px solid var(--color-surface);
}

/* 右向き吹き出し */
.navich-right .navich-block__bubble::before {
  left: auto;
  right: -12px;
  border-right: none;
  border-left: 12px solid var(--color-border);
}
.navich-right .navich-block__bubble::after {
  left: auto;
  right: -9px;
  border-right: none;
  border-left: 10px solid var(--color-surface);
}

/* トラブル（困り顔）シーン */
.navich-block--trouble .navich-block__bubble {
  border-color: hsl(0,52%,80%);
  background: hsl(0,52%,98%);
}
.navich-block--trouble .navich-block__bubble::before { border-right-color: hsl(0,52%,80%); }
.navich-block--trouble .navich-block__bubble::after  { border-right-color: hsl(0,52%,98%); }
.navich-block--trouble.navich-right .navich-block__bubble::before { border-left-color: hsl(0,52%,80%); border-right: none; }
.navich-block--trouble.navich-right .navich-block__bubble::after  { border-left-color: hsl(0,52%,98%); border-right: none; }

/* 解決（笑顔）シーン */
.navich-block--success .navich-block__bubble {
  border-color: hsl(168,32%,70%);
  background: hsl(168,32%,97%);
}
.navich-block--success .navich-block__bubble::before { border-right-color: hsl(168,32%,70%); }
.navich-block--success .navich-block__bubble::after  { border-right-color: hsl(168,32%,97%); }
.navich-block--success.navich-right .navich-block__bubble::before { border-left-color: hsl(168,32%,70%); border-right: none; }
.navich-block--success.navich-right .navich-block__bubble::after  { border-left-color: hsl(168,32%,97%); border-right: none; }

/* ▼ セクションタイトル装飾 ▼ */
.lp-section-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--fs-sm);
  font-weight: 800;
  color: #fff;
  background: var(--color-main);
  border-radius: var(--radius-pill);
  padding: 5px 16px;
  margin-bottom: var(--sp-sm);
  letter-spacing: 0.05em;
}

.lp-section-label--danger  { background: var(--color-danger); }
.lp-section-label--accent  { background: var(--color-accent); }
.lp-section-label--warn    { background: var(--color-warn); color: hsl(42,60%,20%); }

.lp-h2 {
  font-size: var(--fs-lg);
  font-weight: 800;
  line-height: 1.35;
  color: var(--color-text);
  margin-bottom: var(--sp-sm);
  position: relative;
  padding-bottom: 12px;
}

.lp-h2::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 60px;
  height: 4px;
  background: linear-gradient(90deg, var(--color-main), var(--color-warn));
  border-radius: 4px;
}

.lp-h3 {
  font-size: var(--fs-md);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-text);
  margin-bottom: var(--sp-xs);
  padding-left: 12px;
  border-left: 4px solid var(--color-main);
}

/* 重要な部分にマーカー線を引く */
strong { 
  background-image: linear-gradient(transparent 60%, rgba(255, 235, 59, 0.6) 60%); 
  padding: 0 2px; 
  background-repeat: no-repeat;
  background-size: 0% 100%;
  transition: background-size 1.0s cubic-bezier(0.2, 0.8, 0.2, 1);
}
strong.is-visible { background-size: 100% 100%; }

/* マーカー強調 */
.mark-o { background-image: linear-gradient(transparent 58%, hsla(28,90%,65%,0.5) 58%); font-weight: 700; background-repeat: no-repeat; background-size: 0% 100%; transition: background-size 1.0s cubic-bezier(0.2, 0.8, 0.2, 1); }
.mark-r { background-image: linear-gradient(transparent 58%, hsla(0,80%,70%,0.5) 58%); font-weight: 700; background-repeat: no-repeat; background-size: 0% 100%; transition: background-size 1.0s cubic-bezier(0.2, 0.8, 0.2, 1); }
.mark-g { background-image: linear-gradient(transparent 58%, hsla(168,60%,60%,0.5) 58%); font-weight: 700; background-repeat: no-repeat; background-size: 0% 100%; transition: background-size 1.0s cubic-bezier(0.2, 0.8, 0.2, 1); }

.mark-o.is-visible, .mark-r.is-visible, .mark-g.is-visible { background-size: 100% 100%; }

/* ▼ カード ▼ */
.lp-card {
  background: var(--color-surface);
  border-radius: var(--radius-lg);
  padding: var(--sp-lg);
  box-shadow: var(--shadow-md);
  border: 1.5px solid var(--color-border);
  margin-block: var(--sp-md);
}

.lp-card--danger {
  background: var(--color-danger-l);
  border-color: hsl(0,52%,80%);
}

.lp-card--accent {
  background: var(--color-accent-l);
  border-color: hsl(168,32%,70%);
}

.lp-card--warn {
  background: var(--color-warn-l);
  border-color: hsl(42,72%,70%);
}

/* ▼ 法的根拠ボックス ▼ */
.law-box {
  border: 2px solid var(--color-accent);
  border-radius: var(--radius-md);
  padding: var(--sp-md);
  background: var(--color-accent-l);
  position: relative;
  margin-block: var(--sp-md);
}

.law-box__label {
  position: absolute;
  top: -14px;
  left: var(--sp-md);
  background: var(--color-accent);
  color: #fff;
  font-size: var(--fs-xs);
  font-weight: 800;
  padding: 3px 14px;
  border-radius: var(--radius-pill);
  letter-spacing: 0.1em;
}

.law-box__list {
  margin-top: var(--sp-xs);
  padding-left: var(--sp-md);
}

.law-box__list li {
  list-style: disc;
  font-size: var(--fs-sm);
  color: hsl(168,40%,25%);
  line-height: 1.8;
  margin-bottom: 4px;
}

.law-box__list li strong {
  color: hsl(168,40%,20%);
}

/* ▼ ステップボックス ▼ */
.step-list {
  counter-reset: step-counter;
  display: flex;
  flex-direction: column;
  gap: var(--sp-sm);
}

.step-item {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-sm);
  background: var(--color-surface);
  border-radius: var(--radius-md);
  padding: var(--sp-md);
  box-shadow: var(--shadow-sm);
  border: 1.5px solid var(--color-border);
  position: relative;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.step-item:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

.step-item__num {
  counter-increment: step-counter;
  min-width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--color-main);
  color: #fff;
  font-size: var(--fs-md);
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 4px 0 var(--color-main-d);
}

.step-item__body { flex: 1; }
.step-item__title { font-size: var(--fs-md); font-weight: 700; margin-bottom: 4px; }
.step-item__desc  { font-size: var(--fs-sm); color: var(--color-muted); line-height: 1.7; }

/* ▼ 警告バナー ▼ */
.alert-box {
  display: flex;
  gap: var(--sp-sm);
  align-items: flex-start;
  background: var(--color-danger-l);
  border: 2px solid hsl(0,52%,70%);
  border-radius: var(--radius-md);
  padding: var(--sp-md);
  margin-block: var(--sp-md);
}

.alert-box__icon {
  font-size: 28px;
  flex-shrink: 0;
  line-height: 1;
}

/* ▼ CTAセクション（CSSのみ・黄金比ボタン） ▼ */
.lp-cta-section {
  background: linear-gradient(145deg, hsl(28,55%,48%) 0%, hsl(0,52%,50%) 60%, hsl(330,45%,45%) 100%);
  padding-block: var(--sp-xl);
  text-align: center;
  position: relative;
  overflow: hidden;
}

.lp-cta-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    60deg,
    transparent,
    transparent 14px,
    hsla(0,0%,100%,0.05) 14px,
    hsla(0,0%,100%,0.05) 28px
  );
  pointer-events: none;
}

.lp-cta-inner {
  position: relative;
  color: #fff;
}

.lp-cta-badge {
  display: inline-block;
  background: hsla(42,100%,65%,0.25);
  border: 1px solid hsla(42,100%,75%,0.5);
  border-radius: var(--radius-pill);
  padding: 5px 18px;
  font-size: var(--fs-xs);
  font-weight: 700;
  letter-spacing: 0.1em;
  margin-bottom: var(--sp-sm);
}

.lp-cta-heading {
  font-size: clamp(var(--fs-md), 4vw, var(--fs-lg));
  font-weight: 800;
  line-height: 1.35;
  margin-bottom: var(--sp-sm);
  text-shadow: 0 2px 8px hsla(0,0%,0%,0.2);
}

.lp-cta-sub {
  font-size: var(--fs-sm);
  opacity: 0.88;
  margin-bottom: var(--sp-lg);
  line-height: 1.8;
}

/* CTAボタン（黄金比: 幅320px × 高さ198px → ボタン高さ58pxで幅=58×1.618≒94→実使用は幅max320, 高さ58） */
.lp-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: min(320px, 100%);
  height: 58px;                    /* 黄金比: 320÷1.618≒198→視認性のためコンパクト調整 */
  background: hsl(42, 95%, 52%);   /* くすみゴールド */
  color: hsl(28, 60%, 18%);
  font-size: var(--fs-md);
  font-weight: 800;
  border-radius: var(--radius-pill);
  box-shadow: 0 6px 0 hsl(38,75%,38%), 0 12px 24px hsla(38,95%,52%,0.4);
  text-decoration: none;
  letter-spacing: 0.03em;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  margin-bottom: var(--sp-sm);
  position: relative;
  overflow: hidden;
}

.lp-cta-btn::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 50%;
  height: 100%;
  background: linear-gradient(90deg, transparent, hsla(0,0%,100%,0.4), transparent);
  transform: skewX(-20deg);
  animation: shine 3s infinite;
}

@keyframes shine {
  0% { left: -100%; }
  20% { left: 200%; }
  100% { left: 200%; }
}

.lp-cta-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 9px 0 hsl(38,75%,38%), 0 16px 32px hsla(0,0%,0%,0.25);
  text-decoration: none;
  color: hsl(28, 60%, 18%);
}

.lp-cta-btn:active {
  transform: translateY(2px);
  box-shadow: 0 4px 0 hsl(38,75%,38%), 0 8px 16px hsla(0,0%,0%,0.2);
}

.lp-cta-btn__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: hsla(0,0%,0%,0.12);
  border-radius: 50%;
  font-size: 16px;
}

.lp-cta-note {
  font-size: var(--fs-xs);
  opacity: 0.7;
  margin-top: var(--sp-xs);
}

/* ▼ ナビちゃんCTAカード ▼ */
.navich-cta-card {
  background: var(--color-surface);
  border-radius: var(--radius-lg);
  padding: var(--sp-lg);
  box-shadow: var(--shadow-lg);
  max-width: 480px;
  margin-inline: auto;
  margin-bottom: var(--sp-lg);
  display: flex;
  align-items: center;
  gap: var(--sp-md);
  text-align: left;
  border: 2px solid hsla(42,80%,60%,0.3);
}

.navich-cta-card__img {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid var(--color-main);
  flex-shrink: 0;
}

.navich-cta-card__text { color: var(--color-text); }
.navich-cta-card__name { font-size: var(--fs-xs); font-weight: 700; color: var(--color-main); margin-bottom: 4px; }
.navich-cta-card__msg  { font-size: var(--fs-sm); line-height: 1.65; font-weight: 600; }

/* ▼ フッター ▼ */
.lp-footer {
  background: hsl(220,14%,18%);
  color: hsla(0,0%,100%,0.6);
  text-align: center;
  padding-block: var(--sp-lg);
  font-size: var(--fs-xs);
}

.lp-footer a { color: hsla(0,0%,100%,0.5); }
.lp-footer a:hover { color: #fff; }
.lp-footer__links {
  display: flex;
  justify-content: center;
  gap: var(--sp-md);
  margin-bottom: var(--sp-sm);
  flex-wrap: wrap;
}

/* ▼ アニメーション ▼ */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes pulse-border {
  0%, 100% { box-shadow: 0 0 0 0 hsla(28,80%,54%,0.4); }
  50%       { box-shadow: 0 0 0 10px hsla(28,80%,54%,0); }
}

.fade-in-up {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.fade-in-up.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.pulse-anim {
  animation: pulse-border 2.2s ease-in-out infinite;
}

/* ▼ ユーティリティ ▼ */
.text-center { text-align: center; }
.text-sm     { font-size: var(--fs-sm); }
.text-xs     { font-size: var(--fs-xs); }
.text-muted  { color: var(--color-muted); }
.text-danger { color: var(--color-danger); }
.text-accent { color: var(--color-accent); }
.font-bold   { font-weight: 700; }
.font-black  { font-weight: 800; }
.mb-sm       { margin-bottom: var(--sp-sm); }
.mb-md       { margin-bottom: var(--sp-md); }
.mb-lg       { margin-bottom: var(--sp-lg); }
.mt-sm       { margin-top: var(--sp-sm); }
.mt-md       { margin-top: var(--sp-md); }
.divider     { border: none; border-top: 2px dashed var(--color-border); margin-block: var(--sp-lg); }

/* ▼ レスポンシブ（スマホ最適化） ▼ */
@media (max-width: 520px) {
  :root {
    --fs-lg: 22px;
    --fs-md: 18px;
    --sp-xl: 40px;
    --sp-lg: 28px;
  }
  .lp-header {
    padding-block: var(--sp-lg);
  }
  .navich-block__img {
    width: 64px;
    height: 64px;
  }
  .lp-card { padding: var(--sp-md); }
  .navich-cta-card { flex-direction: column; text-align: center; }
}

/* ▼ パンくずリスト ▼ */
.lp-breadcrumbs {
  background: var(--color-surface);
  padding: 8px 16px;
  font-size: 11px;
  color: var(--color-muted);
  overflow-x: auto;
  white-space: nowrap;
  border-bottom: 1px solid var(--color-border);
}
.lp-breadcrumbs a {
  color: var(--color-main);
  text-decoration: none;
}
.lp-breadcrumbs a:hover {
  text-decoration: underline;
}
.lp-breadcrumbs span.separator {
  margin: 0 4px;
}

/* ▼ 権威性（トラスト）バッジ ▼ */
.lp-trust-badge {
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 6px;
  padding: 10px 14px;
  margin: 16px auto 0;
  max-width: 90%;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  color: #166534;
  box-shadow: 0 2px 4px rgba(0,0,0,0.02);
}
.lp-trust-badge i {
  font-size: 16px;
  color: #22c55e;
}

/* ▼ 追従型CTA (フローティング) ▼ */
.floating-cta {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.65);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-top: 1px solid rgba(255, 255, 255, 0.3);
  padding: 16px 20px;
  box-shadow: 0 -10px 40px rgba(0,0,0,0.08);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
  transform: translateY(100%);
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.floating-cta.is-visible {
  transform: translateY(0);
}
.floating-cta__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  max-width: 480px;
  background: linear-gradient(135deg, #ff9900 0%, #ff7700 100%);
  color: #fff;
  font-weight: 800;
  font-size: 16px;
  letter-spacing: 0.5px;
  padding: 16px 24px;
  border-radius: 40px;
  text-decoration: none;
  box-shadow: 0 8px 24px rgba(255,119,0,0.4), inset 0 2px 0 rgba(255,255,255,0.2);
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  animation: pulse-cta 3s infinite;
}
.floating-cta__btn:hover {
  transform: translateY(-2px) scale(1.02);
  box-shadow: 0 12px 32px rgba(255,119,0,0.5), inset 0 2px 0 rgba(255,255,255,0.3);
  text-decoration: none;
}
@keyframes pulse-cta {
  0% { transform: scale(1); box-shadow: 0 8px 24px rgba(255,119,0,0.4), inset 0 2px 0 rgba(255,255,255,0.2); }
  50% { transform: scale(1.02); box-shadow: 0 12px 32px rgba(255,119,0,0.5), inset 0 2px 0 rgba(255,255,255,0.3); }
  100% { transform: scale(1); box-shadow: 0 8px 24px rgba(255,119,0,0.4), inset 0 2px 0 rgba(255,255,255,0.2); }
}

/* LPメインコンテンツ下部に余白を追加 (フローティング分) */
body {
  padding-bottom: 90px;
}