:root {
      --bg: #fff8f8;
      --primary: #c0405a;
      --secondary: #e89aaa;
      --fill: #fff0f3;
      --fill-deep: #ffe8ee;
      --fill-strong: #ffd9e5;
      --text: #3d2a2a;
      --muted: #5a3040;
      --soft: #7a5060;
      --border: #f0d0d8;
      --white: #ffffff;
      --shadow: 0 16px 34px rgba(192, 64, 90, 0.16);
    }

    * {
      box-sizing: border-box;
    }

    body {
      margin: 0;
      background: linear-gradient(180deg, #fff8f8 0%, #fff0f3 52%, #fff8f8 100%);
      color: var(--text);
      font-family: "Noto Sans JP", system-ui, sans-serif;
      line-height: 1.9;
      letter-spacing: 0;
    }

    .page {
      width: min(100%, 390px);
      min-height: 100vh;
      margin: 0 auto;
      background: var(--bg);
      overflow: hidden;
    }

    .pr-bar {
      padding: 4px 12px;
      background: #f5e0e5;
      color: var(--soft);
      font-size: 10px;
      line-height: 1.4;
      text-align: center;
    }

    .fv {
      position: relative;
    }

    .fv img {
      display: block;
      width: 100%;
      height: auto;
      margin: 0;
      padding: 0;
    }

    .fv-cta-link {
      position: absolute;
      left: 50%;
      bottom: 24px;
      display: block;
      width: 86%;
      height: 58px;
      border-radius: 50px;
      transform: translateX(-50%);
    }

    .cta-block {
      padding: 20px 22px 28px;
      background: linear-gradient(180deg, #fff0f3 0%, #ffe8ee 100%);
      text-align: center;
    }

    .cta-lead {
      margin: 0 0 10px;
      color: var(--primary);
      font-size: 13px;
      font-weight: 700;
      line-height: 1.5;
    }

    .cta {
      display: flex;
      width: 100%;
      min-height: 58px;
      align-items: center;
      justify-content: center;
      padding: 14px 18px;
      background: var(--primary);
      border: 1px solid #a92f47;
      border-radius: 50px;
      box-shadow: var(--shadow);
      color: #ffffff;
      font-size: 16px;
      font-weight: 700;
      line-height: 1.35;
      text-align: center;
      text-decoration: none;
    }

    .cta-note {
      margin: 10px 0 0;
      color: var(--soft);
      font-size: 12px;
      font-weight: 700;
      line-height: 1.55;
    }

    .section {
      padding: 38px 22px;
      border-top: 1px solid rgba(240, 208, 216, 0.76);
    }

    .section.rose {
      background:
        radial-gradient(circle at 100% 4%, rgba(255, 217, 229, 0.78), transparent 34%),
        linear-gradient(180deg, #fff8f8 0%, #fff0f3 100%);
    }

    .section.ivory {
      background:
        linear-gradient(90deg, rgba(255, 248, 225, 0.8), transparent 58%),
        #fffdf8;
    }

    .section.deep {
      background: linear-gradient(180deg, #fff0f3 0%, #ffd9e5 100%);
    }

    h1,
    h2 {
      margin: 0;
      color: var(--text);
      font-family: "Noto Serif JP", serif;
      font-weight: 700;
      line-height: 1.62;
      letter-spacing: 0;
    }

    h2 {
      font-size: 20px;
    }

    p {
      margin: 16px 0 0;
      color: var(--muted);
      font-size: 14px;
      line-height: 1.9;
    }

    .emphasis {
      margin-top: 20px;
      padding: 14px 16px;
      background: rgba(255, 255, 255, 0.78);
      border-left: 4px solid var(--secondary);
      border-radius: 0 10px 10px 0;
      color: var(--muted);
      font-family: "Noto Serif JP", serif;
      font-size: 15px;
      font-weight: 700;
      line-height: 1.75;
    }

    .steps {
      display: grid;
      gap: 12px;
      margin-top: 22px;
    }

    .step {
      display: grid;
      grid-template-columns: 58px 1fr;
      gap: 12px;
      align-items: center;
      padding: 15px 14px;
      background: rgba(255, 255, 255, 0.86);
      border: 1px solid var(--border);
      border-radius: 12px;
      box-shadow: 0 10px 22px rgba(192, 64, 90, 0.08);
    }

    .step-mark {
      display: flex;
      width: 50px;
      height: 50px;
      align-items: center;
      justify-content: center;
      background: var(--fill-deep);
      border: 1px solid var(--secondary);
      border-radius: 50%;
      color: var(--primary);
      font-size: 12px;
      font-weight: 700;
      line-height: 1.2;
      text-align: center;
    }

    .step-title {
      color: var(--text);
      font-size: 14px;
      font-weight: 700;
      line-height: 1.55;
    }

    .step-sub {
      margin-top: 3px;
      color: var(--soft);
      font-size: 12px;
      font-weight: 500;
      line-height: 1.55;
    }

    .small-note {
      margin-top: 14px;
      color: var(--soft);
      font-size: 11px;
      line-height: 1.6;
    }

    .card-list {
      display: grid;
      gap: 10px;
      margin: 20px 0 0;
      padding: 0;
      list-style: none;
    }

    .card-list li {
      position: relative;
      padding: 13px 14px 13px 40px;
      background: rgba(255, 255, 255, 0.9);
      border: 1px solid var(--border);
      border-radius: 12px;
      color: var(--muted);
      font-size: 14px;
      font-weight: 700;
      line-height: 1.6;
    }

    .card-list li::before {
      position: absolute;
      top: 15px;
      left: 15px;
      width: 15px;
      height: 15px;
      content: "";
      background: var(--fill-deep);
      border: 1px solid var(--secondary);
      border-radius: 50%;
    }

    .feature-list {
      display: grid;
      gap: 8px;
      margin: 22px 0 0;
      padding: 0;
      list-style: none;
    }

    .feature-list li {
      color: var(--muted);
      font-size: 14px;
      font-weight: 500;
      line-height: 1.7;
    }

    .disclaimer {
      margin: 0 22px 28px;
      padding: 16px;
      background: #fff5f7;
      border: 1px solid var(--border);
      border-radius: 10px;
      color: var(--soft);
      font-size: 12px;
      line-height: 1.75;
    }

    .disclaimer p {
      margin: 0 0 8px;
      color: var(--soft);
      font-size: 12px;
    }

    footer {
      padding: 18px 16px 24px;
      background: #ffe8ee;
      color: var(--soft);
      font-size: 11px;
      line-height: 1.8;
      text-align: center;
    }

    footer p {
      margin: 0 0 6px;
      color: var(--soft);
      font-size: 11px;
    }

    @media (min-width: 391px) {
      body {
        padding: 20px 0;
      }

      .page {
        border-radius: 18px;
        box-shadow: 0 20px 60px rgba(122, 80, 96, 0.14);
      }
    }