/* ---- 页面外壳：只负责居中与背景，不修改区块内部任何样式 ---- */
    html {
      background: #efeae1;
    }

    body {
      margin: 0;
      padding: 36px 20px 60px;
      background: #efeae1;
      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
    }

    .page-shell {
      max-width: 1140px;
      margin: 0 auto;
    }

    @media (max-width:640px) {
      body {
        padding: 16px 10px 32px;
      }
    }

    /* ============================================================
   ADDED BLOCK — CTA 按钮 / 图片链接 / 底部悬浮条
   （与原始区块样式隔离，全部以 #smd-ball 或 .smd-sticky 为前缀）
   ============================================================ */

    /* --- 图片超链接 --- */
    #smd-ball .smd-img-link {
      display: block;
      text-decoration: none;
      border-radius: 14px;
      overflow: hidden;
      margin: 14px auto 0;
      width: fit-content;
      max-width: 100%;
      cursor: pointer;
      box-shadow: 0 1px 0 rgba(73, 100, 119, .08);
      transition: box-shadow .3s ease, transform .3s ease;
    }

    #smd-ball .smd-img-link img {
      display: block;
      max-width: 100%;
      height: auto;
      border-radius: 14px;
      transition: transform .45s cubic-bezier(.2, .7, .3, 1);
    }

    #smd-ball .smd-img-link:hover {
      box-shadow: 0 12px 32px rgba(52, 93, 135, .22);
      transform: translateY(-1px);
    }

    #smd-ball .smd-img-link:hover img {
      transform: scale(1.015);
    }

    #smd-ball .smd-img-link:focus-visible {
      outline: 3px solid rgba(52, 93, 135, .45);
      outline-offset: 3px;
    }

    /* --- CTA 容器 --- */
    #smd-ball .smd-cta {
      margin: 26px auto 4px;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 11px;
    }

    #smd-ball .smd-cta__hint {
      margin: 0;
      font-family: Arial, Helvetica, sans-serif;
      font-size: 11.5px;
      letter-spacing: .06em;
      color: var(--smd-muted);
      text-transform: uppercase;
    }

    /* --- 主按钮 --- */
    .smd-btn {
      position: relative;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 16px 34px 16px 36px;
      border-radius: 999px;
      background: linear-gradient(135deg, #345d87 0%, #4b8587 100%);
      color: #fff;
      text-decoration: none;
      font-family: Arial, Helvetica, sans-serif;
      font-size: 14.5px;
      font-weight: 700;
      line-height: 1;
      letter-spacing: .1em;
      text-transform: uppercase;
      box-shadow:
        0 10px 24px rgba(52, 93, 135, .26),
        0 1px 0 rgba(255, 255, 255, .28) inset;
      transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
      -webkit-tap-highlight-color: transparent;
    }

    .smd-btn::before {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: inherit;
      background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .28) 50%, transparent 70%);
      transform: translateX(-120%);
      transition: transform .7s ease;
      pointer-events: none;
    }

    .smd-btn:hover {
      transform: translateY(-2px);
      box-shadow: 0 15px 32px rgba(52, 93, 135, .34), 0 1px 0 rgba(255, 255, 255, .3) inset;
      filter: saturate(1.06);
    }

    .smd-btn:hover::before {
      transform: translateX(120%);
    }

    .smd-btn:active {
      transform: translateY(0);
      box-shadow: 0 6px 16px rgba(52, 93, 135, .28);
    }

    .smd-btn:focus-visible {
      outline: 3px solid rgba(52, 93, 135, .45);
      outline-offset: 4px;
    }

    .smd-btn__arrow {
      display: inline-block;
      font-size: 15px;
      line-height: 1;
      transition: transform .22s ease;
    }

    .smd-btn:hover .smd-btn__arrow {
      transform: translateX(4px);
    }

    /* 首屏按钮加一圈很轻的呼吸光环，吸引视线 */
    .smd-btn--pulse::after {
      content: "";
      position: absolute;
      inset: -3px;
      border-radius: inherit;
      border: 1px solid rgba(52, 93, 135, .35);
      animation: smd-halo 2.8s ease-out infinite;
      pointer-events: none;
    }

    @keyframes smd-halo {
      0% {
        opacity: .7;
        transform: scale(1);
      }

      70% {
        opacity: 0;
        transform: scale(1.06);
      }

      100% {
        opacity: 0;
        transform: scale(1.06);
      }
    }

    @media (prefers-reduced-motion:reduce) {

      .smd-btn,
      .smd-btn::before,
      #smd-ball .smd-img-link,
      #smd-ball .smd-img-link img,
      .smd-btn__arrow {
        transition: none !important;
      }

      .smd-btn--pulse::after {
        animation: none !important;
        display: none;
      }
    }

    /* ============================================================
       底部悬浮条（只保留一个按钮）
       ============================================================ */
    .smd-sticky {
      position: fixed;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 9990;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 14px 20px calc(14px + env(safe-area-inset-bottom));
      background: rgba(255, 253, 248, .96);
      -webkit-backdrop-filter: blur(14px) saturate(1.15);
      backdrop-filter: blur(14px) saturate(1.15);
      border-top: 1px solid rgba(73, 100, 119, .18);
      box-shadow: 0 -10px 30px rgba(53, 65, 74, .1);
      font-family: Arial, Helvetica, sans-serif;
    }

    .smd-sticky .smd-btn {
      min-width: 300px;
      justify-content: center;
      padding: 19px 48px;
      font-size: 17px;
      font-weight: 700;
      letter-spacing: .02em;
      text-transform: none;
    }

    .smd-sticky .smd-btn__arrow {
      font-size: 18px;
    }

    /* 悬浮条占位，避免遮住页尾 */
    body {
      padding-bottom: 100px;
    }

    @media (max-width:640px) {
      .smd-sticky {
        padding: 12px 14px calc(12px + env(safe-area-inset-bottom));
      }

      .smd-sticky .smd-btn {
        flex: 1 1 auto;
        min-width: 0;
        padding: 16px 24px;
        font-size: 15px;
      }

      body {
        padding-bottom: 88px;
      }
    }
  
    #smd-ball {
      --smd-bg: #f8f5ee;
      --smd-paper: #fffdf8;
      --smd-blue: #e6eef7;
      --smd-sky: #e7f3f5;
      --smd-mint: #e7efe6;
      --smd-peach: #f7e9df;
      --smd-lavender: #eee9f5;
      --smd-blue-ink: #345d87;
      --smd-teal: #4b8587;
      --smd-orange: #c77d50;
      --smd-ink: #35414a;
      --smd-muted: #69757b;
      --smd-border: rgba(73, 100, 119, .15);
      width: 100%;
      max-width: 1140px;
      margin: 0 auto;
      padding: 0;
      overflow: hidden;
      border-radius: 15px;
      background: var(--smd-bg);
      color: var(--smd-ink);
      font-family: Arial, Helvetica, sans-serif;
      font-size: 14px;
      line-height: 1.7;
      box-sizing: border-box;
    }

    #smd-ball *,
    #smd-ball *::before,
    #smd-ball *::after {
      box-sizing: border-box;
    }

    #smd-ball h1,
    #smd-ball h2,
    #smd-ball h3,
    #smd-ball p {
      margin: 0;
    }

    /* CONNECTED MODULES */

    #smd-ball .smd-section {
      position: relative;
      isolation: isolate;
      margin: 0;
      padding: 32px 25px;
      overflow: hidden;
      text-align: center;
      background: var(--smd-bg);
      border: 0;
      border-bottom: 1px solid var(--smd-border);
      border-radius: 0;
    }

    #smd-ball .smd-section:last-child {
      border-bottom: 0;
    }

    #smd-ball .smd-section>* {
      position: relative;
      z-index: 1;
    }

    /* SUBTLE BACKGROUND PATTERNS */

    #smd-ball .smd-pattern::before,
    #smd-ball .smd-pattern::after {
      content: "";
      position: absolute;
      z-index: 0;
      pointer-events: none;
      background-repeat: repeat;
    }

    #smd-ball .smd-pattern::before {
      width: 175px;
      height: 125px;
      top: 0;
      right: 0;
      opacity: .24;
      -webkit-mask-image: linear-gradient(225deg, #000, transparent 94%);
      mask-image: linear-gradient(225deg, #000, transparent 94%);
    }

    #smd-ball .smd-pattern::after {
      width: 130px;
      height: 95px;
      bottom: 0;
      left: 0;
      opacity: .17;
      -webkit-mask-image: linear-gradient(45deg, #000, transparent 94%);
      mask-image: linear-gradient(45deg, #000, transparent 94%);
    }

    /* PAW-PRINT PATTERN */

    #smd-ball .smd-paws::before,
    #smd-ball .smd-paws::after {
      background-image:
        radial-gradient(ellipse at 50% 62%, rgba(74, 120, 157, .16) 0 5px, transparent 6px),
        radial-gradient(circle at 27% 32%, rgba(74, 120, 157, .14) 0 3px, transparent 4px),
        radial-gradient(circle at 43% 21%, rgba(74, 120, 157, .14) 0 3px, transparent 4px),
        radial-gradient(circle at 60% 21%, rgba(74, 120, 157, .14) 0 3px, transparent 4px),
        radial-gradient(circle at 76% 34%, rgba(74, 120, 157, .14) 0 3px, transparent 4px);
      background-size: 55px 55px;
    }

    /* MOTION-LINE PATTERN */

    #smd-ball .smd-motion::before,
    #smd-ball .smd-motion::after {
      background-image:
        repeating-linear-gradient(135deg,
          transparent 0 15px,
          rgba(74, 120, 157, .12) 16px 18px,
          transparent 19px 34px);
      background-size: 47px 47px;
    }

    /* SOFT DOT PATTERN */

    #smd-ball .smd-dots::before,
    #smd-ball .smd-dots::after {
      background-image:
        radial-gradient(circle, rgba(75, 133, 135, .2) 0 3px, transparent 4px),
        radial-gradient(circle, rgba(199, 125, 80, .13) 0 2px, transparent 3px);
      background-size: 37px 37px, 51px 51px;
    }

    /* SOFT GRID PATTERN */

    #smd-ball .smd-grid-pattern::before,
    #smd-ball .smd-grid-pattern::after {
      background-image:
        linear-gradient(rgba(74, 120, 157, .09) 1px, transparent 1px),
        linear-gradient(90deg, rgba(74, 120, 157, .09) 1px, transparent 1px);
      background-size: 25px 25px;
    }

    /* EYEBROW */

    #smd-ball .smd-eyebrow {
      display: inline-block;
      margin: 0 auto 12px;
      padding: 6px 13px;
      border: 1px solid #d8e2e6;
      border-radius: 999px;
      background: var(--smd-paper);
      color: #547b93;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: 1.2px;
      line-height: 1.5;
      text-transform: uppercase;
    }

    /* FIXED 7-STOP ONE-WAY TITLE FLOW */

    #smd-ball .smd-title {
      max-width: 900px;
      margin: 0 auto 13px;
      color: #345d87;
      font-family: Georgia, "Times New Roman", serif;
      font-size: clamp(25px, 3vw, 37px);
      font-weight: 700;
      line-height: 1.2;
      letter-spacing: -.5px;
      overflow-wrap: break-word;
    }

    #smd-ball .smd-hero-title {
      font-size: clamp(30px, 4vw, 46px);
      line-height: 1.13;
    }

    @supports (-webkit-background-clip:text) {
      #smd-ball .smd-title {
        background-image: linear-gradient(90deg,
            #345d87 0%,
            #6395b3 19%,
            #4b8587 38%,
            #e0c49c 53%,
            #83aaa6 68%,
            #6983a3 83%,
            #345d87 100%);
        background-size: 240% 100%;
        background-position: 100% 50%;
        background-repeat: repeat;
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        animation: smd-title-flow 15s linear infinite;
      }
    }

    @keyframes smd-title-flow {
      0% {
        background-position: 100% 50%
      }

      100% {
        background-position: -140% 50%
      }
    }

    /* BODY COPY */

    #smd-ball .smd-lead {
      max-width: 800px;
      margin: 0 auto 15px;
      color: #52616b;
      font-size: 15px;
      line-height: 1.85;
    }

    #smd-ball .smd-copy {
      max-width: 820px;
      margin: 0 auto 13px;
      color: var(--smd-muted);
      font-size: 13px;
      line-height: 1.85;
    }

    #smd-ball .smd-highlight {
      color: var(--smd-blue-ink);
      font-weight: 800;
    }

    /* FEATURE PILLS */

    #smd-ball .smd-pills {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 8px;
      margin: 18px auto 10px;
    }

    #smd-ball .smd-pill {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 8px 11px;
      border: 1px solid #d9e1e6;
      border-radius: 999px;
      background: var(--smd-paper);
      color: #4e718b;
      font-size: 11px;
      font-weight: 750;
      line-height: 1.5;
    }

    /* LIGHT INNER CARDS */

    #smd-ball .smd-grid {
      display: grid;
      gap: 11px;
      margin-top: 19px;
      text-align: left;
    }

    #smd-ball .smd-grid2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #smd-ball .smd-grid3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    #smd-ball .smd-grid4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    #smd-ball .smd-card {
      min-width: 0;
      padding: 16px 14px;
      border: 1px solid #dce4e6;
      border-radius: 15px;
      background: var(--smd-paper);
      box-shadow: 0 4px 13px rgba(54, 85, 106, .035);
    }

    #smd-ball .smd-card:nth-child(4n+2) {
      background: var(--smd-blue);
    }

    #smd-ball .smd-card:nth-child(4n+3) {
      background: var(--smd-mint);
    }

    #smd-ball .smd-card:nth-child(4n+4) {
      background: var(--smd-peach);
    }

    #smd-ball .smd-icon {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 40px;
      height: 40px;
      margin-bottom: 9px;
      border: 1px solid #dce4e6;
      border-radius: 50%;
      background: #fffdf8;
      font-size: 20px;
    }

    #smd-ball .smd-card h3 {
      margin: 0 0 7px;
      color: #456d8b;
      font-family: Georgia, "Times New Roman", serif;
      font-size: 17px;
      line-height: 1.4;
    }

    #smd-ball .smd-card p {
      color: #69757b;
      font-size: 12px;
      line-height: 1.8;
    }

    /* LIGHT CALLOUT */

    #smd-ball .smd-note {
      max-width: 850px;
      margin: 19px auto 0;
      padding: 15px 17px;
      border: 1px solid #dce3df;
      border-radius: 14px;
      background: #f0f4ec;
      color: #527271;
      font-family: Georgia, "Times New Roman", serif;
      font-size: 15px;
      font-style: italic;
      line-height: 1.75;
    }

    /* COMPACT BENEFIT STRIP */

    #smd-ball .smd-strip {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 8px;
      margin-top: 17px;
    }

    #smd-ball .smd-strip-item {
      padding: 12px 8px;
      border: 1px solid #dce4e6;
      border-radius: 12px;
      background: var(--smd-paper);
      color: #54758a;
      font-size: 11px;
      font-weight: 750;
      line-height: 1.6;
    }

    #smd-ball .smd-strip-item:nth-child(2) {
      background: var(--smd-blue);
    }

    #smd-ball .smd-strip-item:nth-child(3) {
      background: var(--smd-mint);
    }

    /* NUMBERED STEPS */

    #smd-ball .smd-step {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 37px;
      height: 37px;
      margin-bottom: 10px;
      border: 1px solid #d7e2e5;
      border-radius: 50%;
      background: #e5eff1;
      color: #456d8b;
      font-size: 14px;
      font-weight: 800;
    }

    /* FINAL CTA */

    #smd-ball .smd-final {
      margin: 17px auto 0;
      padding: 22px 16px;
      border: 1px solid #dce3df;
      border-radius: 16px;
      background: #fffaf0;
    }

    #smd-ball .smd-final strong {
      display: block;
      max-width: 780px;
      margin: 0 auto 10px;
      color: #456d8b;
      font-family: Georgia, "Times New Roman", serif;
      font-size: 23px;
      line-height: 1.45;
    }

    #smd-ball .smd-final p {
      max-width: 790px;
      margin: 0 auto 12px;
      color: #69757b;
      font-size: 13px;
      line-height: 1.85;
    }

    #smd-ball .smd-final-pills {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 7px;
      margin: 15px auto;
    }

    #smd-ball .smd-final-pills span {
      padding: 7px 10px;
      border: 1px solid #dce4e6;
      border-radius: 999px;
      background: #fffdf8;
      color: #54758a;
      font-size: 11px;
      font-weight: 750;
    }

    #smd-ball .smd-final-line {
      display: block;
      margin: 15px auto 0;
      padding: 11px 12px;
      border: 1px solid #dce4e6;
      border-radius: 12px;
      background: #fffdf8;
      color: #54758a;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: .8px;
      line-height: 1.8;
    }

    /* MOBILE */

    @media(max-width:700px) {
      #smd-ball {
        border-radius: 10px;
        font-size: 13px;
      }

      #smd-ball .smd-section {
        padding: 24px 14px;
      }

      #smd-ball .smd-title {
        font-size: 25px;
        letter-spacing: -.3px;
      }

      #smd-ball .smd-hero-title {
        font-size: 30px;
      }

      #smd-ball .smd-lead {
        font-size: 13px;
      }

      #smd-ball .smd-copy {
        font-size: 12px;
      }

      #smd-ball .smd-grid2,
      #smd-ball .smd-grid3 {
        grid-template-columns: 1fr;
        gap: 8px;
      }

      #smd-ball .smd-grid4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
      }

      #smd-ball .smd-card {
        padding: 14px 12px;
      }

      #smd-ball .smd-card h3 {
        font-size: 16px;
      }

      #smd-ball .smd-pill {
        padding: 7px 9px;
        font-size: 10px;
      }

      #smd-ball .smd-note {
        padding: 13px;
        font-size: 14px;
      }

      #smd-ball .smd-strip {
        gap: 6px;
      }

      #smd-ball .smd-strip-item {
        padding: 10px 5px;
        font-size: 10px;
      }

      #smd-ball .smd-final {
        padding: 19px 12px;
      }

      #smd-ball .smd-final strong {
        font-size: 20px;
      }

      #smd-ball .smd-pattern::before {
        width: 115px;
        height: 85px;
        opacity: .22;
      }

      #smd-ball .smd-pattern::after {
        width: 80px;
        height: 65px;
        opacity: .15;
      }

      @supports (-webkit-background-clip:text) {
        #smd-ball .smd-title {
          animation-duration: 10s;
        }
      }
    }

    @media(max-width:380px) {
      #smd-ball .smd-hero-title {
        font-size: 27px;
      }

      #smd-ball .smd-grid4 .smd-card {
        padding: 11px 9px;
      }
    }

    @media(prefers-reduced-motion:reduce) {
      #smd-ball .smd-title {
        animation: none !important;
        background-position: 50% 50% !important;
      }
    }