/* SUGI CARD mobile detail pages: shared styles.
   Part 1 is derived from the redesigned membership card page; part 2 (mobile-detail.extra.css) adapts it to every detail page. */
* { margin: 0; padding: 0; box-sizing: border-box; }
      h1, h2, h3, h4, h5, h6, strong, b { font-weight: 400; }
      body {
        font-family: "Noto Sans JP", "Hiragino Sans", sans-serif;
        background: #eef1f6;
        color: #1f2430;
      }

      .m-page {
        max-width: 480px;
        margin: 0 auto;
        background: #f6f8fc;
        min-height: 100vh;
        padding-bottom: 30px;
      }

      .m-top-bar {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 16px 18px 10px;
        background: #fff;
      }
      .m-back-btn { background: none; border: none; font-size: 1.2rem; color: #1f2430; text-decoration: none; }
      .m-top-title { font-size: 1.05rem; font-weight: 400; flex: 1; text-align: center; margin-right: 24px; }

      .m-section { margin: 14px 14px 0; }
      .m-card { background: #fff; border-radius: 14px; padding: 16px; }
      .m-card + .m-card { margin-top: 12px; }
      .m-card-title { font-size: 0.98rem; font-weight: 400; margin-bottom: 4px; }
      .m-card-sub { font-size: 0.78rem; color: #98a2b3; line-height: 1.6; margin-bottom: 12px; }

      /* ヒーロー */
      .m-hero-card { padding: 0; overflow: hidden; }
      .m-hero-image { width: 100%; height: auto; object-fit: contain; background: #f0f2f6; display: block; }
      .m-hero-body { padding: 16px; }
      .m-hero-title { font-size: 1.15rem; font-weight: 400; margin-bottom: 8px; line-height: 1.4; }
      .m-hero-lead { font-size: 0.82rem; color: #667085; line-height: 1.8; margin-bottom: 14px; }
      .m-check-bullets { list-style: none; margin-bottom: 16px; }
      .m-check-bullets li { display: flex; align-items: flex-start; gap: 8px; font-size: 0.82rem; padding: 6px 0; line-height: 1.6; }
      .m-check-icon { flex-shrink: 0; width: 18px; height: 18px; border-radius: 50%; background: #eaf0ff; color: #4361ee; display: flex; align-items: center; justify-content: center; font-size: 0.7rem; font-weight: 400; margin-top: 1px; }
      .m-hero-actions { display: flex; flex-direction: column; gap: 10px; }
      .m-btn-primary, .m-btn-outline {
        display: block;
        text-align: center;
        border-radius: 10px;
        padding: 12px;
        font-size: 0.86rem;
        font-weight: 400;
        text-decoration: none;
      }
      .m-btn-primary { background: #4361ee; color: #fff; }

      /* Local hero refinement: centered title and smaller image below copy. */
      .m-top-title {
        text-align: center !important;
        margin-right: 0 !important;
        padding-right: 24px !important;
      }
      .m-hero-card {
        padding: 18px 16px 16px !important;
        text-align: center !important;
      }
      .m-hero-body {
        padding: 0 !important;
      }
      .m-hero-title {
        text-align: center !important;
        font-size: 1.22rem !important;
        margin: 0 0 10px !important;
      }
      .m-hero-lead {
        text-align: center !important;
        margin-bottom: 14px !important;
      }
      .m-hero-image {
        width: min(76%, 270px) !important;
        margin: 36px auto 16px !important;
        border-radius: 12px !important;
        background: transparent !important;
      }
      .m-check-bullets {
        text-align: left !important;
      }

      .m-hero-short-copy {
        margin: 0 0 16px !important;
        color: #667085 !important;
        font-size: 0.82rem !important;
        line-height: 1.5 !important;
        text-align: center !important;
      }

      /* Give the top membership hero more vertical space. */
      .m-hero-card {
        padding-top: 26px !important;
        padding-bottom: 20px !important;
      }
      .m-hero-image {
        margin-top: 44px !important;
        margin-bottom: 22px !important;
      }
      .m-hero-short-copy {
        margin-bottom: 22px !important;
      }
      .m-hero-actions {
        margin-bottom: 8px !important;
      }
      .m-price-modal {
        position: fixed;
        inset: 0;
        z-index: 1300;
        display: none;
        align-items: flex-end;
        justify-content: center;
        background: rgba(15, 23, 42, .38);
      }
      .m-price-modal.is-open {
        display: flex;
      }
      .m-price-modal-panel {
        width: min(100%, 480px);
        max-height: 82vh;
        overflow-y: auto;
        border-radius: 24px 24px 0 0;
        background: #fff;
        padding: 18px 16px calc(18px + env(safe-area-inset-bottom));
        box-shadow: 0 -16px 40px rgba(15, 23, 42, .18);
      }
      .m-price-modal-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 12px;
      }
      .m-price-modal-head h2 {
        margin: 0;
        color: #172033;
        font-size: 1rem;
        font-weight: 400;
      }
      .m-price-modal-close {
        width: 36px;
        height: 36px;
        border: 0;
        border-radius: 18px;
        background: #f2f4f7;
        color: #1f2430;
        font-size: 24px;
        line-height: 1;
      }
      /* Local product selection: separated large cards. */
      .m-material-block {
        padding: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
      }
      .m-material-grid {
        display: grid !important;
        gap: 14px !important;
      }
      .m-material-item {
        min-height: 420px !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        gap: 24px !important;
        padding: 34px 18px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: #fff !important;
        box-shadow: none !important;
        text-align: center !important;
      }
      .m-material-item img {
        width: min(76%, 270px) !important;
        height: auto !important;
        aspect-ratio: 1.586 / 1 !important;
        object-fit: cover !important;
        border-radius: 8px !important;
        margin: 0 auto !important;
      }
      .m-material-body strong {
        font-size: 1rem !important;
        line-height: 1.35 !important;
      }
      .m-material-body span {
        margin-top: 7px !important;
        font-size: .8rem !important;
        line-height: 1.55 !important;
      }
      .m-material-price {
        margin-top: 12px !important;
      }
      .m-material-price b {
        font-size: 1.1rem !important;
      }
      .m-material-order-link {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 70px !important;
        min-width: 70px !important;
        height: 40px !important;
        min-height: 40px !important;
        margin-top: 14px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding: 0 !important;
        border-radius: 20px !important;
        background: #0071e3 !important;
        color: #fff !important;
        font-size: 1rem !important;
        font-weight: 400 !important;
        text-decoration: none !important;
      }
      #openPriceModal {
        width: 70px !important;
        min-width: 70px !important;
        height: 40px !important;
        min-height: 40px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 20px !important;
        background: #0071e3 !important;
        color: #fff !important;
        font-size: 1rem !important;
        font-weight: 400 !important;
        line-height: 40px !important;
      }
      .m-material-badge {
        top: 10px !important;
        left: 10px !important;
      }
      /* Apple-like specs grid. */
      .m-spec-card {
        background: transparent !important;
        box-shadow: none !important;
        padding: 0 !important;
      }
      .m-spec-heading {
        justify-content: flex-start !important;
        padding: 0 4px 12px !important;
      }
      .m-spec-heading-icon {
        display: none !important;
      }
      .m-spec-heading h2 {
        font-size: 1.35rem !important;
        font-weight: 600 !important;
        color: #1d1d1f !important;
      }
      .m-kpi-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        border: 0 !important;
        overflow: visible !important;
      }
      .m-kpi-item {
        min-height: 168px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 10px !important;
        padding: 18px 10px !important;
        border: 0 !important;
        border-radius: 22px !important;
        background: #fff !important;
        text-align: center !important;
      }
      .m-kpi-icon {
        display: none !important;
      }
      .m-kpi-item small {
        color: #7b8495 !important;
        font-size: .82rem !important;
        line-height: 1.35 !important;
      }
      .m-kpi-item strong {
        color: #1d1d1f !important;
        font-size: 1.22rem !important;
        font-weight: 650 !important;
        line-height: 1.25 !important;
      }
      .m-spec-art {
        width: 100% !important;
        height: 54px !important;
        margin-top: 8px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
      }
      .m-spec-art-print {
        gap: 8px !important;
      }
      .m-spec-art-print i {
        width: 18px !important;
        height: 18px !important;
        border-radius: 50% !important;
        display: block !important;
      }
      .m-spec-art-print i:nth-child(1) { background: #00a3ff !important; }
      .m-spec-art-print i:nth-child(2) { background: #ff3b30 !important; }
      .m-spec-art-print i:nth-child(3) { background: #ffcc00 !important; }
      .m-spec-art-print i:nth-child(4) { background: #34c759 !important; }
      .m-spec-art-offset {
        position: relative !important;
      }
      .m-spec-art-offset::before,
      .m-spec-art-offset::after {
        content: "" !important;
        position: absolute !important;
        width: 96px !important;
        height: 42px !important;
        border-radius: 10px !important;
        background: linear-gradient(135deg, #0b1b3f, #d9bd73) !important;
        box-shadow: 0 12px 24px rgba(15, 23, 42, .15) !important;
      }
      .m-spec-art-offset::before {
        transform: translate(-8px, 7px) rotate(-7deg) !important;
        opacity: .45 !important;
      }
      .m-spec-art-offset::after {
        transform: translate(8px, -4px) rotate(6deg) !important;
      }
      .m-spec-art-thickness {
        position: relative !important;
      }
      .m-spec-art-thickness i {
        position: absolute !important;
        width: 112px !important;
        height: 30px !important;
        border-radius: 8px !important;
        background: linear-gradient(135deg, #eef6ff, #76c9ff) !important;
        box-shadow: 0 8px 18px rgba(45, 125, 210, .16) !important;
      }
      .m-spec-art-thickness i:nth-child(1) { transform: translateY(-12px) !important; opacity: .55 !important; }
      .m-spec-art-thickness i:nth-child(2) { transform: translateY(0) !important; opacity: .78 !important; }
      .m-spec-art-thickness i:nth-child(3) { transform: translateY(12px) !important; }
      .m-spec-art-delivery {
        gap: 4px !important;
      }
      .m-spec-art-delivery i {
        width: 11px !important;
        height: 34px !important;
        border-radius: 999px !important;
        background: #0071e3 !important;
        display: block !important;
        opacity: .25 !important;
      }
      .m-spec-art-delivery i:nth-child(2) { height: 44px !important; opacity: .45 !important; }
      .m-spec-art-delivery i:nth-child(3) { height: 52px !important; opacity: .7 !important; }
      .m-spec-art-delivery i:nth-child(4) { height: 42px !important; opacity: .5 !important; }
      .m-spec-art-delivery i:nth-child(5) { height: 30px !important; opacity: .3 !important; }
      .m-spec-list {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        margin-top: 10px !important;
      }
      .m-spec-row {
        min-height: 168px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        padding: 18px 10px !important;
        border: 0 !important;
        border-radius: 22px !important;
        background: #fff !important;
        text-align: center !important;
      }
      .m-spec-row-icon {
        display: none !important;
      }
      .m-spec-row dt {
        color: #7b8495 !important;
        font-size: .82rem !important;
        line-height: 1.35 !important;
      }
      .m-spec-row dd {
        color: #1d1d1f !important;
        font-size: .98rem !important;
        font-weight: 650 !important;
        line-height: 1.35 !important;
      }
      .m-spec-visual {
        width: 100% !important;
        max-width: 150px !important;
        height: auto !important;
        margin-top: 8px !important;
        border-radius: 10px !important;
        object-fit: contain !important;
      }
      .m-spec-visual-wide {
        max-width: 170px !important;
      }
      /* Apple-like design support feature card. */
      .m-design-card {
        min-height: 520px !important;
        padding: 56px 26px 34px !important;
        border-radius: 28px !important;
        background: #fff !important;
        box-shadow: none !important;
        text-align: center !important;
      }
      .m-design-badge {
        width: 74px !important;
        height: 74px !important;
        margin: 0 auto 30px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 50% !important;
        background: radial-gradient(circle at 30% 30%, #ff8a00, #0071e3 62%, #34c759) !important;
        color: transparent !important;
        font-size: 0 !important;
      }
      .m-design-badge svg {
        display: none !important;
      }
      .m-design-badge::before {
        content: "✦" !important;
        color: #fff !important;
        font-size: 34px !important;
        line-height: 1 !important;
      }
      .m-design-compact-title {
        margin: 0 0 26px !important;
        color: #1d1d1f !important;
        font-size: 1.62rem !important;
        font-weight: 700 !important;
        letter-spacing: -.045em !important;
        line-height: 1.18 !important;
      }
      .m-design-compact-title::after {
        content: "ロゴ・文字情報だけでも、スタッフが印刷用データづくりをサポートします。仕上がり確認後に制作へ進められます。" !important;
        display: block !important;
        max-width: 300px !important;
        margin: 24px auto 0 !important;
        color: #6e6e73 !important;
        font-size: .9rem !important;
        font-weight: 400 !important;
        letter-spacing: 0 !important;
        line-height: 1.8 !important;
      }
      .m-design-compact-actions {
        margin-top: 34px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 16px !important;
      }
      .m-design-compact-actions .m-btn-primary {
        width: 118px !important;
        min-height: 42px !important;
        padding: 0 !important;
        border-radius: 21px !important;
        background: #0071e3 !important;
        line-height: 42px !important;
      }
      .m-design-compact-link {
        color: #06c !important;
        font-size: .85rem !important;
        text-decoration: none !important;
      }
      .m-feature-band {
        margin: 18px -16px -20px !important;
        padding-top: 20px !important;
        padding-bottom: 22px !important;
      }
      /* Local test: flat white hero without rounded card corners. */
      .m-section:first-of-type {
        margin-left: 0 !important;
        margin-right: 0 !important;
      }
      .m-section:first-of-type .m-hero-card {
        border-radius: 0 !important;
        background: #fff !important;
        box-shadow: none !important;
      }
      .m-section:first-of-type .m-feature-band {
        background: #fff !important;
        border-top: 0 !important;
      }
      .m-feature-item {
        min-height: 78px !important;
        justify-content: center !important;
      }
      .m-btn-outline { background: #fff; color: #4361ee; border: 1.5px solid #4361ee; }

      .m-feature-band {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        padding: 15px 8px 17px;
        background: #fffaf7;
        border-top: 1px solid #f3e5dc;
      }
      .m-feature-item {
        min-width: 0;
        padding: 0 7px;
        text-align: center;
      }
      .m-feature-item + .m-feature-item { border-left: 1px solid #eedfd6; }
      .m-feature-item img {
        width: 52px;
        height: 52px;
        display: block;
        margin: 0 auto 8px;
        padding: 11px;
        object-fit: contain;
        background: #fff;
        border: 1px solid #f3d8c9;
        border-radius: 50%;
        box-shadow: 0 3px 9px rgba(143, 77, 40, 0.18);
      }
      .m-feature-item strong {
        min-height: 2.9em;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #252a33;
        font-size: 0.68rem;
        font-weight: 400;
        line-height: 1.45;
      }
      .m-feature-item span {
        display: block;
        margin-top: 4px;
        color: #9b5d3a;
        font-size: 0.57rem;
        font-weight: 400;
        line-height: 1.4;
      }

      /* 用途（電脑版のチップ表示に合わせてコンパクト化） */
      .m-use-block { padding: 16px; background: #fff; border-radius: 8px; }
      .m-use-chips { margin-top: 11px; display: flex; flex-wrap: wrap; gap: 8px; }
      .m-use-chip { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; background: #fff4ed; border-radius: 999px; color: #282d36; font-size: 0.68rem; font-weight: 400; }
      .m-use-chip svg { width: 15px; height: 15px; flex-shrink: 0; color: #e8671c; }

      /* カードの種類を選ぶ（コンパクト表示） */
      .m-material-block { padding: 16px; }
      .m-material-grid { margin-top: 10px; display: flex; flex-direction: column; gap: 7px; }
      .m-material-order-btn { margin-top: 12px; }
      .m-material-item { position: relative; display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 10px; padding: 8px; background: #fffaf7; border: 1px solid #f0ddd2; border-radius: 9px; align-items: center; }
      .m-material-item.is-recommended { border-color: #f3c493; background: #fff6ec; }
      .m-material-badge { position: absolute; top: -7px; left: 8px; padding: 1px 7px; color: #fff; background: #e8671c; border-radius: 999px; font-size: 0.52rem; font-weight: 400; }
      .m-material-item img { width: 56px; height: 42px; object-fit: cover; border-radius: 6px; background: #f0f2f6; }
      .m-material-body { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
      .m-material-body strong { color: #202630; font-size: 0.75rem; font-weight: 400; line-height: 1.35; }
      .m-material-body span { color: #7b8495; font-size: 0.6rem; line-height: 1.4; }
      .m-material-price { margin-top: 2px; color: #202630; font-size: 0.62rem; }
      .m-material-price b { margin: 0 3px; color: #d9591a; font-size: 0.78rem; font-weight: 400; }
      .m-material-price small { color: #98a2b3; font-size: 0.55rem; }

      /* 基本仕様 */
      .m-spec-card { padding: 17px 16px 16px; }
      .m-spec-heading { display: flex; align-items: center; justify-content: center; gap: 10px; }
      .m-spec-heading-icon {
        width: 42px;
        height: 42px;
        flex: 0 0 42px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #fff;
        background: #eb7b32;
        border-radius: 50%;
      }
      .m-spec-heading-icon svg { width: 22px; height: 22px; }
      .m-spec-heading h2 { margin: 0; color: #202733; font-size: 1rem; font-weight: 400; line-height: 1.35; }
      .m-kpi-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        margin-bottom: 15px;
        overflow: hidden;
        border: 1px solid #eadfd8;
        border-radius: 8px;
      }
      .m-kpi-item { min-width: 0; min-height: 82px; padding: 11px 10px; display: flex; align-items: center; gap: 9px; background: #fffaf7; }
      .m-kpi-item:nth-child(odd) { border-right: 1px solid #eadfd8; }
      .m-kpi-item:nth-child(-n + 2) { border-bottom: 1px solid #eadfd8; }
      .m-kpi-icon { width: 38px; height: 38px; flex: 0 0 38px; display: flex; align-items: center; justify-content: center; color: #df762f; background: #fff1e8; border-radius: 50%; }
      .m-kpi-icon svg { width: 21px; height: 21px; }
      .m-kpi-copy { min-width: 0; }
      .m-kpi-item small { display: block; margin-bottom: 4px; color: #ae6338; font-size: 0.6rem; font-weight: 400; }
      .m-kpi-item strong { display: block; color: #202733; font-size: 0.73rem; font-weight: 400; line-height: 1.4; }

      .m-spec-list { margin: 0; border-top: 1px solid #eceef1; }
      .m-spec-row { min-height: 58px; display: grid; grid-template-columns: 40px 78px minmax(0, 1fr); align-items: center; gap: 8px; padding: 9px 2px; border-bottom: 1px solid #eceef1; font-size: 0.7rem; line-height: 1.5; }
      .m-spec-row-icon { width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; color: #557fd2; background: #f0f5ff; border-radius: 50%; }
      .m-spec-row-icon svg { width: 18px; height: 18px; }
      .m-spec-row dt { color: #303640; font-weight: 400; }
      .m-spec-row dd { color: #303640; font-weight: 400; }
      .m-tag-list { display: flex; flex-wrap: wrap; gap: 5px; }
      .m-tag { padding: 4px 9px; border-radius: 999px; font-size: 0.6rem; font-weight: 400; line-height: 1.4; }
      .m-tag-free { background: #eafaf3; color: #18815f; }
      .m-tag-paid { background: #fff1e8; color: #b0530f; }
      @media (max-width: 390px) {
        .m-kpi-item { padding-left: 8px; padding-right: 8px; gap: 7px; }
        .m-kpi-icon { width: 34px; height: 34px; flex-basis: 34px; }
        .m-kpi-item strong { font-size: 0.68rem; }
      }

      /* 3ステップ */
      .m-order-card { padding: 18px 12px 14px; }
      .m-order-title { display: flex; align-items: center; justify-content: center; gap: 10px; color: #202733; font-size: 1.08rem; font-weight: 400; line-height: 1.3; }
      .m-order-title::before, .m-order-title::after { content: ''; width: 13px; height: 13px; border-top: 3px solid #eda047; }
      .m-order-title::before { border-left: 3px solid #eda047; transform: rotate(-45deg); }
      .m-order-title::after { border-right: 3px solid #eda047; transform: rotate(45deg); }
      .m-steps-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin-top: 16px; }
      .m-step-item { min-width: 0; position: relative; text-align: center; }
      .m-step-item:not(:last-child)::after { content: '›'; position: absolute; top: 45px; right: -8px; z-index: 2; color: #e77b31; font-size: 1.55rem; font-weight: 400; line-height: 1; }
      .m-step-visual { width: 100%; max-width: 108px; aspect-ratio: 1; position: relative; margin: 0 auto 7px; display: flex; align-items: center; justify-content: center; background: #fff5ef; border-radius: 50%; }
      .m-step-item:nth-child(3) .m-step-visual { background: #f3f8e9; }
      .m-step-num { width: 31px; height: 31px; position: absolute; top: -3px; left: 0; z-index: 1; display: flex; align-items: center; justify-content: center; color: #fff; background: #e9952f; border-radius: 50%; font-size: 0.72rem; font-weight: 400; }
      .m-step-item:nth-child(2) .m-step-num { background: #e97859; }
      .m-step-item:nth-child(3) .m-step-num { background: #78ad35; }
      .m-step-visual img { width: 76%; height: 76%; display: block; object-fit: contain; }
      .m-step-item h3 { color: #202733; font-size: 0.7rem; font-weight: 400; line-height: 1.4; }
      @media (max-width: 350px) {
        .m-order-card { padding-left: 9px; padding-right: 9px; }
        .m-steps-row { gap: 5px; }
        .m-step-item h3 { font-size: 0.64rem; }
      }

      /* デザインサポート（電脑版のシンプルな構成に合わせて圧縮） */
      .m-design-card { padding: 18px 16px; text-align: center; }
      .m-design-badge { display: flex; align-items: center; justify-content: center; gap: 6px; width: fit-content; margin: 0 auto; background: #eef2ff; color: #3157dc; font-size: 0.72rem; font-weight: 400; border-radius: 999px; padding: 6px 13px; }
      .m-design-badge svg { width: 16px; height: 16px; stroke-width: 2.5; }
      .m-design-compact-title { margin: 12px 0 8px; color: #172033; font-size: 0.94rem; font-weight: 400; line-height: 1.4; }
      .m-design-compact-actions { display: flex; flex-direction: column; gap: 8px; }
      .m-design-compact-link { font-size: 0.68rem; color: #4361ee; text-decoration: none; }

      /* 料金表 */
      .m-pricing-card { padding: 16px 12px; }
      .m-pricing-title { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; font-size: 0.98rem; font-weight: 400; color: #172033; }
      .m-pricing-title-icon { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; color: #e86822; background: #fff1e8; }
      .m-pricing-title-icon svg { width: 17px; height: 17px; }
      .m-pricing-block + .m-pricing-block { margin-top: 20px; padding-top: 18px; border-top: 1px solid #e7eaf0; }
      .m-pricing-block h3 { margin: 0 0 10px; color: #172033; font-size: 0.83rem; }
      .m-price-controls { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 10px; }
      .m-price-control label { display: block; margin: 0 0 4px; color: #667085; font-size: 0.61rem; font-weight: 400; }
      .m-price-select { width: 100%; height: 38px; padding: 0 28px 0 10px; border: 1px solid #d9dee8; border-radius: 6px; background: #fff; color: #172033; font-size: 0.71rem; font-weight: 400; }
      .m-price-summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 11px; border-radius: 6px 6px 0 0; color: #fff; background: #24385f; }
      .m-price-summary span { font-size: 0.68rem; }
      .m-price-summary strong { font-size: 0.76rem; }
      .m-price-list, .m-option-price-list { border: 1px solid #e1e6ef; border-top: 0; border-radius: 0 0 6px 6px; overflow: hidden; }
      .m-price-row { display: grid; grid-template-columns: 1fr 1fr; align-items: center; min-height: 44px; padding: 6px 10px; border-bottom: 1px solid #e8ebf1; }
      .m-price-row:last-child, .m-option-price-row:last-child { border-bottom: 0; }
      .m-price-row:nth-child(even), .m-option-price-row:nth-child(even) { background: #f8f9fc; }
      .m-price-row b { color: #172033; font-size: 0.7rem; }
      .m-price-row strong { color: #172033; font-size: 0.78rem; font-weight: 400; text-align: right; }
      .m-price-row-head { background: #f1f3f8; min-height: 36px; }
      .m-price-row-head b, .m-price-row-head strong { color: #5b6472; font-weight: 700; font-size: 0.68rem; }
      .m-option-control { margin-bottom: 10px; }
      .m-option-standard-row { margin-bottom: 10px; padding: 10px 11px; background: #eafaf3; border: 1px solid #cdeee0; border-radius: 6px; }
      .m-option-standard-label { margin-bottom: 7px; color: #18815f; font-size: 0.68rem; font-weight: 400; }
      .m-option-price-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; min-height: 42px; padding: 7px 10px; border-bottom: 1px solid #e8ebf1; }
      .m-option-price-row span { color: #30394a; font-size: 0.67rem; line-height: 1.45; }
      .m-option-price-row strong { color: #172033; font-size: 0.72rem; white-space: nowrap; }
      .m-option-price-row.is-free strong { color: #18815f; }
      .m-price-note { margin: 10px 0 13px; color: #8a93a4; font-size: 0.63rem; line-height: 1.65; }


      /* FAQ */
      .m-faq-item { border-bottom: 1px solid #f0f2f6; }
      .m-faq-item:last-child { border-bottom: none; }
      .m-faq-question {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
        padding: 12px 2px;
        cursor: pointer;
      }
      .m-faq-question h3 { font-size: 0.84rem; font-weight: 400; }
      .m-faq-toggle { font-size: 1rem; color: #4361ee; flex-shrink: 0; transition: transform 0.2s; }
      .m-faq-item.open .m-faq-toggle { transform: rotate(45deg); }
      .m-faq-answer { display: none; padding: 0 2px 14px; font-size: 0.78rem; color: #667085; line-height: 1.8; }
      .m-faq-item.open .m-faq-answer { display: block; }

      .m-back-link { display: block; text-align: center; font-size: 0.8rem; color: #667085; text-decoration: none; padding: 6px; }

      /* 初回限定キャンペーン バナー（mobile/index.htmlと同じスタイルをコピー。
         料金表カードにもクーポン訴求がなかったため追加） */
      .m-campaign-banner {
        margin: 0 0 14px;
        padding: 14px 13px;
        display: grid;
        grid-template-columns: 65px minmax(0, 1fr) auto;
        align-items: center;
        gap: 10px;
        border: 1px solid #ffe0c2;
        border-radius: 8px;
        background: #fff7ed;
        color: #172033;
        text-decoration: none;
      }
      .m-campaign-gift { font-size: 2.7rem; line-height: 1; text-align: center; }
      .m-campaign-label { display: block; color: #f26a12; font-size: 0.62rem; font-weight: 400; }
      .m-campaign-price { display: block; margin-top: 2px; color: #f26a12; font-size: 1.35rem; font-weight: 400; white-space: nowrap; }
      .m-campaign-price small { font-size: 0.65rem; }
      .m-campaign-copy { display: block; margin-top: 2px; font-size: 0.6rem; font-weight: 400; }
      .m-campaign-button { padding: 11px 12px; border-radius: 20px; background: #f26a12; color: #fff; font-size: 0.64rem; font-weight: 400; white-space: nowrap; }
      @media (max-width: 380px) {
        .m-campaign-banner { grid-template-columns: 48px minmax(0, 1fr) auto; gap: 7px; }
        .m-campaign-gift { font-size: 2.1rem; }
        .m-campaign-price { font-size: 1.08rem; }
        .m-campaign-button { padding: 9px 8px; font-size: 0.57rem; }
      }
    
      /* 「延伸阅读」ナレッジベースへのリンク（免責小字と同じ扱いだったのを、
         カード形式で見やすく独立させる） */
      .m-kb-links { display: flex; flex-direction: column; gap: 8px; margin: 12px 0 14px; }
      .m-kb-link { display: flex; align-items: center; gap: 8px; padding: 10px 12px; background: #fff7ed; border: 1px solid #ffe0c2; border-radius: 8px; color: #b0530f; font-size: 0.72rem; font-weight: 400; line-height: 1.5; text-decoration: none; }
      .m-kb-link::before { content: "📖"; flex-shrink: 0; font-size: 0.9rem; }
      .m-kb-link:active { background: #ffe9d6; }

      /* 有料オプション料金：枚数ドロップダウンで1枚数ずつ切り替える方式から、
         全枚数×全オプションを一覧できる実際のtableに変更（選択の手間を無くす）。 */
      .m-id-table-wrap { overflow-x: auto; margin-top: 4px; }
      .m-id-table { width: 100%; border-collapse: collapse; font-size: 0.68rem; }
      .m-id-table th, .m-id-table td { padding: 8px 10px; text-align: center; border-bottom: 1px solid #e8ebf1; white-space: nowrap; }
      .m-id-table th { color: #667085; font-weight: 400; background: #f6f7f9; }
      .m-id-table td:first-child, .m-id-table th:first-child { text-align: left; color: #8b929d; }
      /* Local test: Apple-like use case section */
      .m-use-tags,
      .m-usage-tags,
      .m-use-list,
      .m-usage-list,
      .m-scene-tags,
      .m-scene-list {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 24px !important;
        margin-top: 34px !important;
      }

      .m-use-tags span,
      .m-usage-tags span,
      .m-use-list span,
      .m-usage-list span,
      .m-scene-tags span,
      .m-scene-list span,
      .m-use-tags a,
      .m-usage-tags a,
      .m-use-list a,
      .m-usage-list a,
      .m-scene-tags a,
      .m-scene-list a {
        display: block !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        padding: 0 !important;
        color: #0a8f3c !important;
        font-size: clamp(34px, 9vw, 54px) !important;
        font-weight: 800 !important;
        line-height: 1.08 !important;
        letter-spacing: -0.04em !important;
        text-align: left !important;
      }

      .m-use-tags span::after,
      .m-usage-tags span::after,
      .m-use-list span::after,
      .m-usage-list span::after,
      .m-scene-tags span::after,
      .m-scene-list span::after,
      .m-use-tags a::after,
      .m-usage-tags a::after,
      .m-use-list a::after,
      .m-usage-list a::after,
      .m-scene-tags a::after,
      .m-scene-list a::after {
        content: "によく使われています";
        display: block;
        margin-top: 6px;
        color: #1d1d1f;
        font-size: 13px;
        font-weight: 700;
        letter-spacing: 0;
        line-height: 1.4;
      }

      .m-section:has(.m-use-tags),
      .m-section:has(.m-usage-tags),
      .m-section:has(.m-use-list),
      .m-section:has(.m-usage-list),
      .m-section:has(.m-scene-tags),
      .m-section:has(.m-scene-list) {
        background: #fff !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        padding: 44px 26px 54px !important;
      }

      .m-section:has(.m-use-tags) h2,
      .m-section:has(.m-usage-tags) h2,
      .m-section:has(.m-use-list) h2,
      .m-section:has(.m-usage-list) h2,
      .m-section:has(.m-scene-tags) h2,
      .m-section:has(.m-scene-list) h2 {
        font-size: clamp(30px, 8vw, 46px) !important;
        line-height: 1.12 !important;
        letter-spacing: -0.04em !important;
        font-weight: 800 !important;
        text-align: left !important;
      }

      /* Local test: rendered Apple-like use case block */
      .m-apple-use-cases {
        background: #fff !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        padding: 48px 28px 58px !important;
        margin: 0 !important;
      }

      .m-apple-use-eyebrow {
        margin: 0 0 16px !important;
        color: #6e6e73 !important;
        font-size: 17px !important;
        font-weight: 700 !important;
        letter-spacing: -0.02em !important;
      }

      .m-apple-use-cases h2 {
        margin: 0 !important;
        color: #1d1d1f !important;
        font-size: clamp(28px, 7.2vw, 40px) !important;
        font-weight: 800 !important;
        line-height: 1.08 !important;
        letter-spacing: -0.045em !important;
        text-align: left !important;
      }

      .m-apple-use-lead {
        margin: 24px 0 0 !important;
        color: #1d1d1f !important;
        font-size: 15px !important;
        font-weight: 650 !important;
        line-height: 1.65 !important;
        letter-spacing: -0.02em !important;
      }

      .m-apple-use-list {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
        margin-top: 34px !important;
      }

      .m-apple-use-item {
        min-height: 132px !important;
        padding: 18px 16px !important;
        border-radius: 24px !important;
        background: #f5f5f7 !important;
      }

      .m-apple-use-item:last-child {
        grid-column: 1 / -1 !important;
        min-height: 112px !important;
      }

      .m-apple-use-item strong {
        display: block !important;
        color: #1d1d1f !important;
        font-size: 18px !important;
        font-weight: 750 !important;
        line-height: 1.22 !important;
        letter-spacing: -0.035em !important;
      }

      .m-apple-use-item span {
        display: block !important;
        margin-top: 12px !important;
        color: #6e6e73 !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        line-height: 1.5 !important;
      }

      /* Local test: Apple-like horizontal order flow */
      .m-apple-order-flow {
        background: #f5f5f7 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        padding: 46px 0 54px !important;
        overflow: hidden !important;
      }

      .m-apple-flow-head {
        padding: 0 28px !important;
      }

      .m-apple-flow-eyebrow {
        margin: 0 0 14px !important;
        color: #6e6e73 !important;
        font-size: 17px !important;
        font-weight: 700 !important;
        letter-spacing: -0.02em !important;
      }

      .m-apple-flow-head h2 {
        margin: 0 !important;
        color: #1d1d1f !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: clamp(18px, 4.8vw, 24px) !important;
        font-weight: 700 !important;
        line-height: 1.08 !important;
        letter-spacing: -0.045em !important;
        text-align: left !important;
      }

      .m-apple-flow-head p:not(.m-apple-flow-eyebrow) {
        margin: 20px 0 0 !important;
        color: #1d1d1f !important;
        font-size: 14px !important;
        font-weight: 650 !important;
        line-height: 1.65 !important;
        letter-spacing: -0.02em !important;
      }

      .m-apple-flow-scroller {
        display: flex !important;
        gap: 16px !important;
        margin-top: 42px !important;
        padding: 0 28px 10px !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory !important;
        -webkit-overflow-scrolling: touch !important;
      }

      .m-apple-flow-scroller::-webkit-scrollbar {
        display: none !important;
      }

      .m-apple-flow-card {
        position: relative !important;
        flex: 0 0 min(78vw, 310px) !important;
        min-height: 250px !important;
        padding: 24px 24px 28px !important;
        border-radius: 28px !important;
        background: #fff !important;
        scroll-snap-align: start !important;
      }

      .m-apple-flow-img {
        display: block !important;
        width: 116px !important;
        height: 82px !important;
        margin: 0 0 34px !important;
        border-radius: 16px !important;
        background-color: #fff !important;
        object-fit: contain !important;
      }

      .m-apple-flow-card:nth-child(1) .m-apple-flow-img {
        object-position: center !important;
      }

      .m-apple-flow-card:nth-child(2) .m-apple-flow-img {
        object-position: center !important;
      }

      .m-apple-flow-card:nth-child(3) .m-apple-flow-img {
        object-position: center !important;
      }

      .m-apple-flow-card:nth-child(4) .m-apple-flow-img {
        object-position: center !important;
      }

      .m-apple-flow-card:nth-child(5) .m-apple-flow-img {
        object-position: center !important;
      }

      .m-apple-flow-no {
        display: none !important;
        align-items: center !important;
        justify-content: center !important;
        width: 42px !important;
        height: 42px !important;
        border-radius: 999px !important;
        background: #0071e3 !important;
        color: #fff !important;
        font-size: 14px !important;
        font-weight: 800 !important;
        letter-spacing: -0.02em !important;
      }

      .m-apple-flow-card h3 {
        margin: 0 !important;
        color: #1d1d1f !important;
        font-size: 20px !important;
        font-weight: 750 !important;
        line-height: 1.18 !important;
        letter-spacing: -0.035em !important;
      }

      .m-apple-flow-card p {
        margin: 8px 0 0 !important;
        color: #6e6e73 !important;
        font-size: 11px !important;
        font-weight: 600 !important;
        line-height: 1.45 !important;
        letter-spacing: -0.01em !important;
      }

      .m-flow-symbol {
        position: relative !important;
        display: block !important;
        width: 96px !important;
        height: 76px !important;
        margin: 0 0 34px !important;
      }

      .m-flow-symbol::before,
      .m-flow-symbol::after {
        content: "" !important;
        position: absolute !important;
        display: block !important;
      }

      .m-flow-symbol-card::before {
        width: 86px !important;
        height: 52px !important;
        left: 5px !important;
        top: 12px !important;
        border-radius: 12px !important;
        background: linear-gradient(135deg, #eaf5ff, #8dccff) !important;
        box-shadow: 0 12px 24px rgba(0, 113, 227, 0.16) !important;
        transform: rotate(-8deg) !important;
      }

      .m-flow-symbol-card::after {
        width: 54px !important;
        height: 8px !important;
        left: 20px !important;
        top: 38px !important;
        border-radius: 999px !important;
        background: #0071e3 !important;
        transform: rotate(-8deg) !important;
      }

      .m-flow-symbol-order::before {
        width: 54px !important;
        height: 72px !important;
        left: 21px !important;
        top: 2px !important;
        border-radius: 14px !important;
        border: 4px solid #1d1d1f !important;
        background: #fff !important;
      }

      .m-flow-symbol-order::after {
        width: 42px !important;
        height: 22px !important;
        left: 27px !important;
        top: 36px !important;
        border-radius: 999px !important;
        background: #0071e3 !important;
      }

      .m-flow-symbol-proof::before {
        width: 72px !important;
        height: 52px !important;
        left: 12px !important;
        top: 10px !important;
        border-radius: 14px !important;
        border: 4px solid #8fc5f4 !important;
        background: #fff !important;
      }

      .m-flow-symbol-proof::after {
        width: 28px !important;
        height: 28px !important;
        right: 2px !important;
        bottom: 3px !important;
        border-radius: 50% !important;
        border: 5px solid #0071e3 !important;
        box-shadow: 16px 14px 0 -12px #0071e3 !important;
      }

      .m-flow-symbol-print::before {
        width: 76px !important;
        height: 48px !important;
        left: 10px !important;
        top: 16px !important;
        border-radius: 14px !important;
        background: linear-gradient(180deg, #f2f7ff, #c9e7ff) !important;
        border: 3px solid #b8d7f5 !important;
      }

      .m-flow-symbol-print::after {
        width: 64px !important;
        height: 18px !important;
        left: 16px !important;
        top: 42px !important;
        border-radius: 8px !important;
        background: linear-gradient(90deg, #13a8e8 0 25%, #ff3b30 25% 50%, #ffcc00 50% 75%, #34c759 75%) !important;
      }

      .m-flow-symbol-ship::before {
        width: 78px !important;
        height: 46px !important;
        left: 9px !important;
        top: 24px !important;
        border-radius: 10px !important;
        background: #d99a43 !important;
      }

      .m-flow-symbol-ship::after {
        width: 50px !important;
        height: 30px !important;
        left: 23px !important;
        top: 8px !important;
        border-radius: 8px !important;
        background: #f6c06f !important;
        transform: skewX(-18deg) !important;
      }

      /* Local test: simplify and restyle the price table trigger */
      #openPriceModal,
      .m-hero a[href*="pricing"],
      .m-hero button[id*="Price"],
      .m-hero button[id*="price"] {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 88px !important;
        height: 40px !important;
        min-width: 88px !important;
        padding: 0 18px !important;
        border: 0 !important;
        border-radius: 999px !important;
        background: #0071e3 !important;
        color: #fff !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        letter-spacing: -0.01em !important;
        text-decoration: none !important;
        box-shadow: none !important;
      }

      /* Local test: Apple-like FAQ */
      .m-apple-faq {
        background: #f5f5f7 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        padding: 74px 28px 42px !important;
      }

      .m-apple-faq > h2,
      .m-apple-faq > h3 {
        margin: 0 0 58px !important;
        color: #1d1d1f !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: clamp(34px, 9.2vw, 48px) !important;
        font-weight: 750 !important;
        line-height: 1.08 !important;
        letter-spacing: -0.045em !important;
        text-align: left !important;
      }

      .m-apple-faq details,
      .m-apple-faq .m-apple-faq-item {
        margin: 0 !important;
        padding: 24px 0 !important;
        border: 0 !important;
        border-bottom: 1px solid rgba(0, 0, 0, 0.16) !important;
        background: transparent !important;
        box-shadow: none !important;
        border-radius: 0 !important;
      }

      .m-apple-faq summary,
      .m-apple-faq .m-apple-faq-question,
      .m-apple-faq button,
      .m-apple-faq h3,
      .m-apple-faq h4 {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 18px !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        color: #1d1d1f !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: clamp(22px, 6.1vw, 31px) !important;
        font-weight: 750 !important;
        line-height: 1.25 !important;
        letter-spacing: -0.04em !important;
        text-align: left !important;
        list-style: none !important;
        background: transparent !important;
        border: 0 !important;
      }

      .m-apple-faq summary::-webkit-details-marker {
        display: none !important;
      }

      .m-apple-faq summary::after,
      .m-apple-faq .m-apple-faq-question::after,
      .m-apple-faq button::after {
        content: "⌄" !important;
        flex: 0 0 auto !important;
        color: #6e6e73 !important;
        font-size: 34px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
      }

      .m-apple-faq details[open] summary::after {
        transform: rotate(180deg) !important;
      }

      .m-apple-faq details > *:not(summary),
      .m-apple-faq .m-apple-faq-item > *:not(summary):not(.m-apple-faq-question):not(h3):not(h4):not(button) {
        margin: 16px 0 0 !important;
        color: #6e6e73 !important;
        font-size: 15px !important;
        font-weight: 500 !important;
        line-height: 1.7 !important;
      }

      /* Local test: keep specs text-only for clarity */
      .m-spec-row img,
      .m-spec-list img,
      .m-spec-row picture,
      .m-spec-list picture,
      .m-spec-row .m-spec-image,
      .m-spec-list .m-spec-image {
        display: none !important;
      }

      /* Local test: safe redesign for use cases without replacing existing data */
      .m-use-redesign-section {
        background: #fff !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        padding: 46px 24px 52px !important;
      }

      .m-use-redesign-section > h2,
      .m-use-redesign-section > h3 {
        margin: 0 0 26px !important;
        color: #1d1d1f !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: 25px !important;
        font-weight: 750 !important;
        line-height: 1.16 !important;
        letter-spacing: -0.035em !important;
        text-align: left !important;
      }

      .m-use-redesign-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
      }

      .m-use-redesign-card {
        min-height: 124px !important;
        padding: 18px 15px !important;
        border-radius: 24px !important;
        background: #f5f5f7 !important;
      }

      .m-use-redesign-wide {
        grid-column: 1 / -1 !important;
        min-height: 104px !important;
      }

      .m-use-redesign-card strong {
        display: block !important;
        color: #1d1d1f !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: 18px !important;
        font-weight: 750 !important;
        line-height: 1.22 !important;
        letter-spacing: -0.035em !important;
      }

      .m-use-redesign-card span {
        display: block !important;
        margin-top: 12px !important;
        color: #6e6e73 !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        line-height: 1.45 !important;
      }

      .m-use-original-hidden {
        display: none !important;
      }

      /* Local test: Apple-like material picker below FAQ */
      .m-back-top-hidden {
        display: none !important;
      }

      .m-material-picker-apple {
        background: #f5f5f7 !important;
        padding: 62px 28px 74px !important;
        margin: 0 !important;
      }

      .m-material-picker-apple h2 {
        margin: 0 0 34px !important;
        color: #1d1d1f !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: clamp(36px, 10vw, 52px) !important;
        font-weight: 750 !important;
        line-height: 1.08 !important;
        letter-spacing: -0.05em !important;
      }

      .m-material-picker-apple > p {
        margin: 0 0 38px !important;
        color: #6e6e73 !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        line-height: 1.6 !important;
      }

      .m-material-picker-group {
        margin-top: 34px !important;
      }

      .m-material-picker-group span {
        display: block !important;
        margin-bottom: 16px !important;
        color: #86868b !important;
        font-size: 16px !important;
        font-weight: 650 !important;
        line-height: 1.35 !important;
      }

      .m-material-picker-group a {
        display: block !important;
        margin: 0 0 18px !important;
        color: #1d1d1f !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: 25px !important;
        font-weight: 750 !important;
        line-height: 1.25 !important;
        letter-spacing: -0.035em !important;
        text-decoration: none !important;
      }

/* Restore original style for basic specification module */
    .m-spec-original-restore,
    .m-spec-original-restore * {
      border-radius: revert !important;
      box-shadow: revert !important;
    }

    .m-spec-original-restore {
      background: revert !important;
      padding: revert !important;
      margin: revert !important;
    }

    .m-spec-original-restore img,
    .m-spec-original-restore picture,
    .m-spec-original-restore .m-spec-image {
      display: revert !important;
    }

    .m-spec-original-restore .m-kpi-grid,
    .m-spec-original-restore .m-spec-list {
      display: revert !important;
      grid-template-columns: revert !important;
      gap: revert !important;
    }

    .m-spec-original-restore .m-kpi-item,
    .m-spec-original-restore .m-spec-row {
      min-height: revert !important;
      background: revert !important;
      padding: revert !important;
      border-radius: revert !important;
      box-shadow: revert !important;
    }

/* Local test v3: premium use-case carousel */
      .m-use-premium-section {
        background: #f5f5f7 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        padding: 54px 0 58px !important;
        overflow: hidden !important;
      }

      .m-use-premium-section > h2,
      .m-use-premium-section > h3 {
        margin: 0 !important;
        padding: 0 26px !important;
        color: #1d1d1f !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: clamp(28px, 7.6vw, 38px) !important;
        font-weight: 750 !important;
        line-height: 1.12 !important;
        letter-spacing: -0.045em !important;
        text-align: left !important;
      }

      .m-use-premium-lead {
        margin: 18px 0 0 !important;
        padding: 0 26px !important;
        color: #6e6e73 !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 1.65 !important;
        letter-spacing: -0.01em !important;
      }

      .m-use-premium-scroll {
        display: flex !important;
        gap: 14px !important;
        margin-top: 34px !important;
        padding: 0 26px 6px !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory !important;
        -webkit-overflow-scrolling: touch !important;
      }

      .m-use-premium-scroll::-webkit-scrollbar {
        display: none !important;
      }

      .m-use-premium-card {
        flex: 0 0 min(68vw, 260px) !important;
        min-height: 188px !important;
        padding: 22px 20px !important;
        border-radius: 28px !important;
        background: #fff !important;
        scroll-snap-align: start !important;
      }

      .m-use-premium-icon {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 42px !important;
        height: 42px !important;
        border-radius: 999px !important;
        background: #f5f5f7 !important;
        color: #0071e3 !important;
        font-size: 20px !important;
        margin-bottom: 26px !important;
      }

      .m-use-premium-card strong {
        display: block !important;
        color: #1d1d1f !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: 22px !important;
        font-weight: 750 !important;
        line-height: 1.18 !important;
        letter-spacing: -0.04em !important;
      }

      .m-use-premium-card span:not(.m-use-premium-icon) {
        display: block !important;
        margin-top: 12px !important;
        color: #6e6e73 !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 1.55 !important;
      }

      .m-use-premium-hide {
        display: none !important;
      }

      /* Local test: flat hero block without rounded background */
      .m-detail-hero-apple,
      .m-detail-hero-apple *,
      .m-hero,
      .m-hero-card,
      .m-product-hero,
      .m-point-apple-hero {
        box-shadow: none !important;
      }

      .m-detail-hero-apple,
      .m-hero,
      .m-hero-card,
      .m-product-hero {
        border-radius: 0 !important;
        background: #fff !important;
      }

      .m-detail-hero-apple [class*="card"],
      .m-hero [class*="card"],
      .m-product-hero [class*="card"] {
        border-radius: 0 !important;
        box-shadow: none !important;
      }

      .m-membership-hero-flat,
      .m-membership-hero-flat::before,
      .m-membership-hero-flat::after,
      .m-membership-hero-flat-child,
      .m-membership-hero-flat-child::before,
      .m-membership-hero-flat-child::after {
        border-radius: 0 !important;
        box-shadow: none !important;
      }

      .m-membership-hero-flat {
        background: #fff !important;
        overflow: visible !important;
      }

      section:has(h1),
      section:has(h2) {
        --membership-flat-radius: 0px;
      }

      section:has(h1:first-child),
      section:has(h2:first-child) {
        border-radius: var(--membership-flat-radius, inherit) !important;
      }

      section:has(h1),
      section:has(h1) *,
      section:has(h2),
      section:has(h2) * {
        border-radius: 0 !important;
      }

      .m-hero,
      .m-hero *,
      .m-hero-card,
      .m-hero-card *,
      .m-membership-hero,
      .m-membership-hero *,
      .m-product-hero,
      .m-product-hero *,
      .m-card-hero,
      .m-card-hero * {
        border-radius: 0 !important;
        box-shadow: none !important;
      }

      .m-detail-apple-style main > section:first-of-type,
      main > section:first-of-type:has(h1),
      main > section:first-of-type:has(h2),
      body > main > div:first-child,
      body > main > section:first-child {
        border-radius: 0 !important;
        box-shadow: none !important;
        background: #fff !important;
      }

/* Local test: Apple-like rhythm between content modules */
      body {
        background: #f5f5f7 !important;
      }

      main {
        background: #f5f5f7 !important;
      }

      main > section,
      main > article,
      main > div {
        margin-top: 0 !important;
        margin-bottom: 12px !important;
      }

      main > section:first-of-type,
      main > article:first-of-type,
      main > div:first-of-type {
        margin-top: 0 !important;
      }

      .m-membership-hero-flat,
      .m-detail-hero-apple,
      .m-hero,
      .m-product-hero {
        margin-bottom: 12px !important;
        padding-top: 46px !important;
        padding-bottom: 42px !important;
      }

      .m-use-premium-section,
      .m-apple-order-flow,
      .m-apple-faq,
      .m-material-picker-apple {
        margin-top: 12px !important;
        margin-bottom: 12px !important;
      }

      .m-apple-flow-scroller,
      .m-use-premium-scroll {
        padding-left: 26px !important;
        padding-right: 26px !important;
        scroll-padding-left: 26px !important;
      }

      .m-apple-flow-card,
      .m-use-premium-card {
        box-shadow: none !important;
        border: 1px solid rgba(0, 0, 0, 0.04) !important;
      }

      .m-apple-flow-card:first-child,
      .m-use-premium-card:first-child {
        margin-left: 0 !important;
      }

      .m-apple-flow-card:last-child,
      .m-use-premium-card:last-child {
        margin-right: 10px !important;
      }

      .m-material-picker-apple {
        border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
      }

      .m-material-picker-group + .m-material-picker-group {
        margin-top: 42px !important;
      }

      .m-material-picker-group a {
        padding: 2px 0 !important;
      }

      .m-material-picker-group a:active,
      .m-material-picker-group a:hover {
        color: #0071e3 !important;
      }

      /* Match hero title typography to spec value text */
      h1:first-of-type,
      .m-membership-hero-flat h1,
      .m-detail-hero-apple h1,
      .m-hero h1,
      .m-product-hero h1 {
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: clamp(15px, 4vw, 19px) !important;
        font-weight: 750 !important;
        line-height: 1.22 !important;
        letter-spacing: -0.025em !important;
        white-space: nowrap !important;
      }

/* Local test: slim notice between nav and hero */
      .m-apple-top-notice {
        background: #f5f5f7 !important;
        padding: 18px 28px !important;
        color: #1d1d1f !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 1.55 !important;
        letter-spacing: -0.01em !important;
        text-align: center !important;
      }

      .m-apple-top-notice a {
        color: #0071e3 !important;
        text-decoration: none !important;
        white-space: nowrap !important;
      }

      .m-apple-top-notice {
        display: none !important;
      }

      /* Blend mobile header with hero */
      header,
      .mobile-header,
      .site-header,
      .m-header,
      .app-header,
      .mobile-topbar,
      .m-mobile-header {
        background: #fff !important;
        box-shadow: none !important;
        border-bottom: 0 !important;
      }

      header::before,
      header::after,
      .mobile-header::before,
      .mobile-header::after,
      .site-header::before,
      .site-header::after,
      .m-header::before,
      .m-header::after,
      .app-header::before,
      .app-header::after {
        box-shadow: none !important;
        border: 0 !important;
      }

      .m-flat-top-nav,
      .m-flat-top-nav *,
      .m-flat-top-nav::before,
      .m-flat-top-nav::after {
        box-shadow: none !important;
      }

      .m-flat-top-nav {
        background: #fff !important;
        border: 0 !important;
        border-bottom: 0 !important;
      }

      .m-no-sticky-shadow,
      .m-no-sticky-shadow::before,
      .m-no-sticky-shadow::after,
      .m-no-sticky-shadow * {
        box-shadow: none !important;
        filter: none !important;
      }

      .m-no-sticky-shadow {
        border-bottom: 0 !important;
      }

      body [class*="sticky"],
      body [class*="Sticky"],
      body [class*="fixed"],
      body [class*="Fixed"],
      body [class*="scroll"],
      body [class*="Scroll"],
      body [class*="is-show"],
      body [class*="isShow"],
      body [class*="is-active"],
      body [class*="isActive"] {
        box-shadow: none !important;
      }

      header[class],
      nav[class],
      [class*="header"][class*="sticky"],
      [class*="Header"][class*="sticky"],
      [class*="header"][class*="fixed"],
      [class*="Header"][class*="fixed"],
      [class*="nav"][class*="sticky"],
      [class*="Nav"][class*="sticky"],
      [class*="nav"][class*="fixed"],
      [class*="Nav"][class*="fixed"] {
        box-shadow: none !important;
        border-bottom: 0 !important;
        filter: none !important;
      }

      header[class]::before,
      header[class]::after,
      nav[class]::before,
      nav[class]::after,
      [class*="header"][class*="sticky"]::before,
      [class*="header"][class*="sticky"]::after,
      [class*="Header"][class*="sticky"]::before,
      [class*="Header"][class*="sticky"]::after,
      [class*="header"][class*="fixed"]::before,
      [class*="header"][class*="fixed"]::after,
      [class*="Header"][class*="fixed"]::before,
      [class*="Header"][class*="fixed"]::after {
        box-shadow: none !important;
        border: 0 !important;
        background-image: none !important;
      }

      .m-visible-top-nav-no-shadow,
      .m-visible-top-nav-no-shadow::before,
      .m-visible-top-nav-no-shadow::after {
        box-shadow: none !important;
        border-bottom: 0 !important;
        filter: none !important;
        background-image: none !important;
      }

      /* Remove outer boxes/circles around feature icons */
      img[src*="feature-beginner"],
      img[src*="feature-data"],
      img[src*="feature-fullcolor"] {
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
      }

      *:has(> img[src*="feature-beginner"]),
      *:has(> img[src*="feature-data"]),
      *:has(> img[src*="feature-fullcolor"]) {
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
      }

      /* Feature items as rounded square tiles like specification cards */
      *:has(> img[src*="feature-beginner"]),
      *:has(> img[src*="feature-data"]),
      *:has(> img[src*="feature-fullcolor"]) {
        background: revert !important;
        border-radius: revert !important;
        padding: revert !important;
        min-height: revert !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
      }

      *:has(> img[src*="feature-beginner"]) img,
      *:has(> img[src*="feature-data"]) img {
        display: block !important;
        width: 70px !important;
        height: 70px !important;
        margin: 0 auto 8px !important;
        opacity: 1 !important;
        object-fit: contain !important;
        padding: 0 !important;
        box-sizing: border-box !important;
      }

      img[data-data-icon-custom="true"] {
        width: 70px !important;
        height: 70px !important;
        object-fit: contain !important;
        aspect-ratio: 1 / 1 !important;
      }

      img[data-beginner-mark-icon="true"],
      img[data-data-icon-custom="true"],
      img[src*="feature-fullcolor"] {
        width: 62px !important;
        height: 62px !important;
        max-width: 62px !important;
        max-height: 62px !important;
        object-fit: contain !important;
        padding: 0 !important;
        margin: 0 auto 10px !important;
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
      }

      *:has(> img[data-data-icon-custom="true"]) {
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
      }

      img[data-data-icon-custom="true"] {
        width: 62px !important;
        height: 62px !important;
        max-width: 62px !important;
        max-height: 62px !important;
        margin: 0 auto 10px !important;
      }

      *:has(> img[data-beginner-mark-icon="true"]),
      *:has(> img[data-data-icon-custom="true"]),
      *:has(> img[src*="feature-fullcolor"]) {
        position: relative !important;
        padding-top: 8px !important;
      }

      *:has(> img[data-beginner-mark-icon="true"])::before,
      *:has(> img[data-data-icon-custom="true"])::before,
      *:has(> img[src*="feature-fullcolor"])::before {
        content: "" !important;
        display: block !important;
        width: 96px !important;
        height: 96px !important;
        margin: 0 auto -84px !important;
        border-radius: 24px !important;
        background: #f5f5f7 !important;
      }

      img[data-beginner-mark-icon="true"],
      img[data-data-icon-custom="true"],
      img[src*="feature-fullcolor"] {
        width: 74px !important;
        height: 74px !important;
        max-width: 74px !important;
        max-height: 74px !important;
        margin: 0 auto 10px !important;
        object-fit: contain !important;
      }

      img[data-beginner-mark-icon="true"] {
        width: 70px !important;
        height: 70px !important;
        object-fit: contain !important;
        aspect-ratio: 1 / 1 !important;
      }

      *:has(> img[src*="feature-beginner"]) img {
        opacity: 1 !important;
      }

      *:has(> img[src*="feature-beginner"])::before {
        content: none !important;
        display: none !important;
      }

      *:has(> img[src*="feature-fullcolor"]) img {
        display: block !important;
        width: 70px !important;
        height: 70px !important;
        margin: 0 auto 8px !important;
        opacity: 1 !important;
      }

      *:has(> img[src*="feature-beginner"])::before,
      *:has(> img[src*="feature-data"])::before,
      *:has(> img[src*="feature-fullcolor"])::before {
        content: none !important;
        display: none !important;
      }

      *:has(> * > img[src*="feature-beginner"]),
      *:has(> * > img[src*="feature-data"]),
      *:has(> * > img[src*="feature-fullcolor"]) {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 12px !important;
        border: 0 !important;
      }

      *:has(> img[src*="feature-beginner"]),
      *:has(> img[src*="feature-data"]),
      *:has(> img[src*="feature-fullcolor"]) {
        margin: 0 !important;
      }

/* Local test: Apple-like specification tiles */
      .m-spec-tiles-v2 {
        background: #f5f5f7 !important;
        padding: 42px 14px 52px !important;
        border-radius: 0 !important;
        box-shadow: none !important;
      }

      .m-spec-tiles-v2 > h2,
      .m-spec-tiles-v2 > h3 {
        margin: 0 12px 24px !important;
        color: #1d1d1f !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: 22px !important;
        font-weight: 750 !important;
        line-height: 1.12 !important;
        letter-spacing: -0.04em !important;
      }

      .m-spec-tiles-grid-v2 {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
      }

      .m-spec-tile-v2 {
        min-height: 178px !important;
        padding: 22px 16px !important;
        border-radius: 24px !important;
        background: #fff !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        text-align: center !important;
      }

      .m-spec-tile-v2.wide {
        grid-column: 1 / -1 !important;
        min-height: 118px !important;
      }

      .m-spec-tile-v2 span {
        display: block !important;
        color: #6e6e73 !important;
        font-size: 13px !important;
        font-weight: 650 !important;
        line-height: 1.35 !important;
        margin-bottom: 10px !important;
      }

      .m-spec-tile-v2 strong {
        display: block !important;
        color: #1d1d1f !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: clamp(15px, 4vw, 19px) !important;
        font-weight: 750 !important;
        line-height: 1.22 !important;
        letter-spacing: -0.025em !important;
        white-space: nowrap !important;
      }

      .m-spec-icon-v2 {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-height: 76px !important;
        margin-top: 20px !important;
      }

      .m-spec-color-dots-v2 {
        gap: 12px !important;
      }

      .m-spec-color-dots-v2 i {
        width: 18px !important;
        height: 18px !important;
        border-radius: 999px !important;
      }

      .m-spec-offset-v2 {
        position: relative !important;
      }

      .m-spec-offset-v2::before,
      .m-spec-offset-v2::after {
        content: "" !important;
        position: absolute !important;
        width: 86px !important;
        height: 48px !important;
        border-radius: 10px !important;
      }

      .m-spec-offset-v2::before {
        background: #a9adb1 !important;
        transform: translate(-18px, 12px) rotate(-8deg) !important;
      }

      .m-spec-offset-v2::after {
        background: linear-gradient(135deg, #17233d, #c8aa55) !important;
        transform: translate(12px, -2px) rotate(6deg) !important;
      }

      .m-spec-thickness-v2::before {
        content: "" !important;
        display: block !important;
        width: 108px !important;
        height: 46px !important;
        border-radius: 10px !important;
        background: linear-gradient(180deg, #bfe9ff 0 48%, #9bd5f9 48% 100%) !important;
        box-shadow: 0 12px 26px rgba(0, 113, 227, 0.18) !important;
      }

      .m-spec-delivery-v2 {
        gap: 6px !important;
      }

      .m-spec-delivery-v2 i {
        width: 11px !important;
        height: var(--h) !important;
        border-radius: 999px !important;
        background: #8fc5f4 !important;
      }

      .m-spec-delivery-v2 i:nth-child(3) {
        background: #2997ff !important;
      }

      .m-spec-simple-v2 {
        min-height: 142px !important;
        justify-content: flex-start !important;
        padding-top: 38px !important;
        border-top: 0 !important;
      }

/* Split material/product cards into independent modules */
      .m-material-split-v2 {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        background: #f5f5f7 !important;
        padding: 0 14px !important;
      }

      .m-material-split-v2 > * {
        background: #fff !important;
        border-radius: 28px !important;
        box-shadow: none !important;
        padding: 32px 22px !important;
        min-height: 420px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
      }

      .m-material-split-v2 img {
        width: min(78vw, 320px) !important;
        max-width: min(78vw, 320px) !important;
        height: auto !important;
        margin: 0 auto 26px !important;
        object-fit: contain !important;
      }

      .m-material-split-v2 h3,
      .m-material-split-v2 strong {
        color: #1d1d1f !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: 20px !important;
        font-weight: 750 !important;
        line-height: 1.22 !important;
        letter-spacing: -0.035em !important;
      }

      .m-material-split-v2 p {
        color: #6e6e73 !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 1.55 !important;
      }

      .m-material-split-v2 a[href*="order-config"] {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 70px !important;
        height: 40px !important;
        margin-top: auto !important;
        border-radius: 999px !important;
        background: #0071e3 !important;
        color: #fff !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        text-decoration: none !important;
      }

/* Standalone product modules */
      .m-product-modules-v3 {
        background: #f5f5f7 !important;
        padding: 14px !important;
        display: grid !important;
        gap: 14px !important;
      }

      .m-product-module-v3 {
        background: #fff !important;
        border-radius: 28px !important;
        padding: 34px 22px 30px !important;
        min-height: 440px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        box-shadow: none !important;
      }

      .m-product-module-v3 img {
        width: min(78vw, 330px) !important;
        height: auto !important;
        margin: 0 auto 28px !important;
        object-fit: contain !important;
      }

      .m-product-module-v3 h2 {
        margin: 0 !important;
        color: #1d1d1f !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
        font-size: 21px !important;
        font-weight: 750 !important;
        line-height: 1.2 !important;
        letter-spacing: -0.035em !important;
      }

      .m-product-module-v3 p {
        margin: 12px 0 0 !important;
        color: #6e6e73 !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 1.55 !important;
      }

      .m-product-module-v3 .m-product-price-v3 {
        margin-top: 18px !important;
        color: #1d1d1f !important;
        font-size: 15px !important;
        font-weight: 750 !important;
      }

      .m-product-module-v3 a {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 70px !important;
        height: 40px !important;
        margin-top: auto !important;
        border-radius: 999px !important;
        background: #0071e3 !important;
        color: #fff !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        text-decoration: none !important;
      }

      .m-original-products-hidden-v3 {
        display: revert !important;
      }

      .m-product-modules-v3 {
        display: none !important;
      }

.m-use-premium-section,
      .m-use-redesign-section,
      .m-detail-use-apple {
        display: none !important;
      }

/* Local test: vertical order flow */
      .m-apple-flow-scroller {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 10px !important;
        margin-top: 42px !important;
        padding: 0 20px 10px !important;
        overflow: visible !important;
        scroll-snap-type: none !important;
      }

      .m-apple-flow-card {
        position: relative !important;
        flex: none !important;
        min-height: 224px !important;
        padding: 126px 10px 20px !important;
        border-radius: 22px !important;
        background: #fff !important;
        display: flex !important;
        flex-direction: column !important;
        justify-items: center !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        scroll-snap-align: none !important;
      }

      .m-apple-flow-card .m-flow-symbol {
        position: absolute !important;
        top: 34px !important;
        left: 0 !important;
        right: 0 !important;
        transform: none !important;
        width: 58px !important;
        height: 48px !important;
        margin: 0 auto !important;
        grid-row: auto !important;
        align-self: center !important;
      }

      .m-apple-flow-card h3 {
        margin: 0 !important;
        align-self: auto !important;
        font-size: 14px !important;
        line-height: 1.2 !important;
        grid-row: auto !important;
      }

      .m-apple-flow-card p {
        margin: 6px 0 0 !important;
        align-self: auto !important;
        font-size: 10px !important;
        line-height: 1.35 !important;
        grid-row: auto !important;
      }

.m-apple-flow-head p:not(.m-apple-flow-eyebrow) {
        display: none !important;
      }

.m-design-compact-title,
      .m-design-card h2,
      .m-design-card h3,
      section:has(.m-design-badge) h2,
      section:has(.m-design-badge) h3 {
        font-size: clamp(20px, 5.2vw, 27px) !important;
        line-height: 1.18 !important;
        letter-spacing: -0.035em !important;
      }

/* Final pass: keep the three hero feature icons visually consistent. */
img[data-beginner-mark-icon="true"],
img[data-data-icon-custom="true"],
img[src*="feature-fullcolor"] {
  width: 70px !important;
  height: 70px !important;
  max-width: 70px !important;
  max-height: 70px !important;
  object-fit: contain !important;
  object-position: center !important;
  display: block !important;
  margin: 13px auto 18px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

*:has(> img[data-beginner-mark-icon="true"])::before,
*:has(> img[data-data-icon-custom="true"])::before,
*:has(> img[src*="feature-fullcolor"])::before {
  content: "" !important;
  display: block !important;
  width: 96px !important;
  height: 96px !important;
  margin: 0 auto -83px !important;
  border-radius: 24px !important;
  background: #f5f5f7 !important;
  box-shadow: none !important;
}

/* Align the three hero feature badges to the same baseline. */
*:has(> img[data-beginner-mark-icon="true"]),
*:has(> img[data-data-icon-custom="true"]),
*:has(> img[src*="feature-fullcolor"]) {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  min-height: 138px !important;
}

*:has(> img[data-beginner-mark-icon="true"])::before,
*:has(> img[data-data-icon-custom="true"])::before,
*:has(> img[src*="feature-fullcolor"])::before {
  width: 92px !important;
  height: 92px !important;
  margin: 0 auto -81px !important;
  border-radius: 22px !important;
}

img[data-beginner-mark-icon="true"],
img[data-data-icon-custom="true"],
img[src*="feature-fullcolor"] {
  width: 66px !important;
  height: 66px !important;
  max-width: 66px !important;
  max-height: 66px !important;
  margin: 13px auto 16px !important;
}

*:has(> img[data-beginner-mark-icon="true"]) > :not(img),
*:has(> img[data-data-icon-custom="true"]) > :not(img),
*:has(> img[src*="feature-fullcolor"]) > :not(img) {
  margin-top: 0 !important;
  line-height: 1.35 !important;
}

/* Force feature icon badges with real wrapper elements, so earlier styles cannot cancel them. */
.m-feature-icon-badge-final {
  width: 92px !important;
  height: 92px !important;
  border-radius: 22px !important;
  background: #f5f5f7 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto 12px !important;
  box-shadow: none !important;
  border: 0 !important;
}
.m-feature-icon-badge-final img {
  width: 66px !important;
  height: 66px !important;
  max-width: 66px !important;
  max-height: 66px !important;
  object-fit: contain !important;
  object-position: center !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.m-feature-icon-badge-final + * {
  margin-top: 0 !important;
  line-height: 1.35 !important;
}

.m-feature-icon-badge-final {
  display: none !important;
}
.m-feature-icon-badge-final + * {
  display: none !important;
}
.m-hero-feature-row-safe {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 0 !important;
  width: min(680px, calc(100% - 32px)) !important;
  margin: 70px auto 0 !important;
  padding: 0 !important;
}
.m-hero-feature-row-safe .m-hero-feature-item-safe {
  min-height: 140px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  text-align: center !important;
}
.m-hero-feature-row-safe .m-hero-feature-item-safe + .m-hero-feature-item-safe {
  border-left: 1px solid #ead8cc !important;
}
.m-hero-feature-row-safe .m-hero-feature-badge-safe {
  width: 92px !important;
  height: 92px !important;
  border-radius: 22px !important;
  background: #f5f5f7 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto 14px !important;
}
.m-hero-feature-row-safe img {
  width: 66px !important;
  height: 66px !important;
  object-fit: contain !important;
  display: block !important;
}
.m-hero-feature-row-safe .m-hero-feature-label-safe {
  font-size: 15px !important;
  line-height: 1.35 !important;
  font-weight: 500 !important;
  color: #1d1d1f !important;
  white-space: nowrap !important;
}

/* Final alignment for the rebuilt hero feature row. */
.m-hero-feature-row-safe {
  width: min(620px, calc(100% - 40px)) !important;
  margin: 56px auto 0 !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  justify-items: center !important;
  align-items: start !important;
}
.m-hero-feature-row-safe .m-hero-feature-item-safe {
  width: 100% !important;
  min-width: 0 !important;
  padding: 0 10px !important;
  box-sizing: border-box !important;
}
.m-hero-feature-row-safe .m-hero-feature-badge-safe {
  width: 88px !important;
  height: 88px !important;
  border-radius: 21px !important;
  margin: 0 auto 12px !important;
}
.m-hero-feature-row-safe img {
  width: 62px !important;
  height: 62px !important;
  max-width: 62px !important;
  max-height: 62px !important;
}
.m-hero-feature-row-safe .m-hero-feature-label-safe {
  width: 100% !important;
  max-width: 120px !important;
  margin: 0 auto !important;
  text-align: center !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
  letter-spacing: -0.04em !important;
}

/* The rebuilt feature row lives directly in .m-feature-band and spans all columns;
   the original three items are replaced by it. */
.m-feature-band > .m-feature-item {
  display: none !important;
}
.m-feature-band > .m-hero-feature-row-safe {
  grid-column: 1 / -1 !important;
  margin-top: 12px !important;
}
.m-feature-band .m-hero-feature-item-safe {
  padding: 0 4px !important;
}
.m-feature-band .m-hero-feature-label-safe {
  max-width: 100% !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-wrap: balance;
}
.m-feature-band .m-hero-feature-row-safe .m-hero-feature-item-safe + .m-hero-feature-item-safe {
  border-left: 0 !important;
}
/* Usage chips -> icon tiles, same look as the hero feature badges. */
.m-use-block .m-use-chips {
  margin-top: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 22px 0 !important;
}
.m-use-block .m-use-chip {
  width: 33.333% !important;
  box-sizing: border-box !important;
  padding: 0 4px !important;
  background: transparent !important;
  border-radius: 0 !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  color: #1d1d1f !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
  text-align: center !important;
  text-wrap: balance;
}
.m-use-block .m-use-chip svg {
  box-sizing: content-box !important;
  width: 34px !important;
  height: 34px !important;
  padding: 27px !important;
  background: #f5f5f7 !important;
  border-radius: 22px !important;
  color: #e8671c !important;
}
/* Same heading size as 会員カード 基本仕様. */
.m-use-block .m-card-title {
  margin-bottom: 0 !important;
  color: #1d1d1f !important;
  font-size: 22px !important;
  font-weight: 750 !important;
  letter-spacing: -0.88px !important;
  line-height: 24.64px !important;
}
/* Second row: two wide tiles that together span the same width as the three above. */
.m-use-block .m-use-chip:nth-child(n+4) {
  width: 50% !important;
  padding: 0 11px !important;
}
.m-use-block .m-use-chip:nth-child(n+4) svg {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 88px !important;
  padding: 27px 0 !important;
}
/* Order-flow icons are drawn on a 96x76 canvas: keep that canvas, scale it down and center it. */
.m-apple-flow-card .m-flow-symbol {
  top: 30px !important;
  left: 50% !important;
  right: auto !important;
  width: 96px !important;
  height: 76px !important;
  margin: 0 0 0 -48px !important;
  transform: scale(0.68) !important;
  transform-origin: 50% 50% !important;
}
.m-apple-flow-card .m-flow-symbol::before,
.m-apple-flow-card .m-flow-symbol::after {
  box-sizing: border-box !important;
}
.m-apple-flow-card {
  justify-content: flex-start !important;
}
.m-apple-flow-card:last-child {
  margin-right: 0 !important;
}
/* Pricing section, redesigned to match 会員カード 基本仕様 (grey panel, white rounded cards, bold headings). */
.m-pricing-card {
  padding: 14px 14px 28px !important;
  border-radius: 20px !important;
  background: #f5f5f7 !important;
  box-shadow: none !important;
}
.m-pricing-card .m-pricing-title {
  margin: 0 0 22px !important;
  padding: 0 4px !important;
  color: #1d1d1f !important;
  font-size: 22px !important;
  font-weight: 750 !important;
  letter-spacing: -0.88px !important;
  line-height: 1.3 !important;
}
.m-pricing-card .m-pricing-title-icon {
  display: none !important;
}

/* Campaign banner: white card, gift tile + copy, full-width button underneath. */
.m-pricing-card .m-campaign-banner {
  display: grid !important;
  grid-template-columns: 64px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 4px 14px !important;
  margin: 0 0 8px !important;
  padding: 18px !important;
  border: 0 !important;
  border-radius: 22px !important;
  background: #fff !important;
  box-shadow: none !important;
  text-decoration: none !important;
}
.m-pricing-card .m-campaign-gift {
  width: 64px !important;
  height: 64px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 18px !important;
  background: #f5f5f7 !important;
  font-size: 32px !important;
}
.m-pricing-card .m-campaign-banner > span:nth-child(2) {
  min-width: 0 !important;
}
.m-pricing-card .m-campaign-label {
  color: #f26a12 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
}
.m-pricing-card .m-campaign-price {
  margin-top: 2px !important;
  color: #1d1d1f !important;
  font-size: 24px !important;
  font-weight: 750 !important;
  letter-spacing: -0.5px !important;
  line-height: 1.2 !important;
}
.m-pricing-card .m-campaign-price small {
  font-size: 14px !important;
  font-weight: 750 !important;
}
.m-pricing-card .m-campaign-copy {
  margin-top: 4px !important;
  color: #6e6e73 !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
}
.m-pricing-card .m-campaign-button {
  grid-column: 1 / -1 !important;
  margin-top: 12px !important;
  padding: 13px 12px !important;
  border-radius: 999px !important;
  background: #f26a12 !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  text-align: center !important;
}

/* Section headings inside the panel */
.m-pricing-card .m-pricing-block {
  margin-top: 30px !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}
.m-pricing-card .m-pricing-block h3 {
  margin: 0 0 14px !important;
  padding: 0 4px !important;
  color: #1d1d1f !important;
  font-size: 20px !important;
  font-weight: 750 !important;
  letter-spacing: -0.6px !important;
}

/* Price list: one white rounded card, clean rows, no navy header or striping. */
.m-pricing-card .m-price-summary {
  display: block !important;
  margin: 0 0 10px !important;
  padding: 0 4px !important;
  background: transparent !important;
  color: #6e6e73 !important;
  font-size: 13px !important;
}
.m-pricing-card .m-price-summary span {
  font-size: 13px !important;
}
.m-pricing-card .m-price-list {
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 22px !important;
  background: #fff !important;
}
.m-pricing-card .m-price-row {
  min-height: 54px !important;
  padding: 0 22px !important;
  background: transparent !important;
  border-bottom: 1px solid #ececf0 !important;
}
.m-pricing-card .m-price-row:last-child {
  border-bottom: 0 !important;
}
.m-pricing-card .m-price-row b {
  color: #1d1d1f !important;
  font-size: 15px !important;
  font-weight: 400 !important;
}
.m-pricing-card .m-price-row strong {
  color: #1d1d1f !important;
  font-size: 17px !important;
  font-weight: 750 !important;
  letter-spacing: -0.3px !important;
}
.m-pricing-card .m-price-row-head {
  min-height: 44px !important;
}
.m-pricing-card .m-price-row-head b,
.m-pricing-card .m-price-row-head strong {
  color: #6e6e73 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}
.m-pricing-card .m-price-note {
  margin: 14px 0 0 !important;
  padding: 0 4px !important;
  color: #6e6e73 !important;
  font-size: 12px !important;
  line-height: 1.7 !important;
}
.m-pricing-card .m-price-note a {
  color: #0071e3 !important;
}

/* Option block: standard-processing card + compact option price table, same white-card style. */
/* 標準加工: collapsible card, closed by default */
.m-pricing-card .m-option-standard-row {
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 22px !important;
  background: #fff !important;
  overflow: hidden !important;
}
.m-pricing-card .m-option-standard-label {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 18px !important;
  list-style: none !important;
  cursor: pointer !important;
  user-select: none !important;
}
.m-pricing-card .m-option-standard-label::-webkit-details-marker {
  display: none !important;
}
.m-pricing-card .m-option-standard-label::after {
  content: "" !important;
  width: 8px !important;
  height: 8px !important;
  margin: -3px 4px 0 auto !important;
  border-right: 2px solid #1d1d1f !important;
  border-bottom: 2px solid #1d1d1f !important;
  transform: rotate(45deg) !important;
  transition: transform .18s ease !important;
}
.m-pricing-card .m-option-standard-row[open] .m-option-standard-label::after {
  margin-top: 4px !important;
  transform: rotate(225deg) !important;
}
.m-pricing-card .m-option-standard-label strong {
  color: #1d1d1f !important;
  font-size: 17px !important;
  font-weight: 750 !important;
  letter-spacing: -0.3px !important;
}
.m-pricing-card .m-option-standard-label em {
  padding: 3px 10px !important;
  border-radius: 999px !important;
  background: #eafaf3 !important;
  color: #18815f !important;
  font-size: 11px !important;
  font-style: normal !important;
}
.m-pricing-card .m-tag-list {
  display: block !important;
  margin: 0 !important;
  padding: 0 18px !important;
  border-top: 1px solid #ececf0 !important;
}
.m-pricing-card .m-tag-free {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 50px !important;
  padding: 0 !important;
  border-bottom: 1px solid #ececf0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #1d1d1f !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
}
.m-pricing-card .m-tag-free:last-child {
  border-bottom: 0 !important;
}
.m-pricing-card .m-tag-free::before {
  content: "✓";
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #eafaf3;
  color: #18815f;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}
.m-pricing-card .m-id-table-wrap {
  overflow: hidden !important;
  margin-top: 0 !important;
  border-radius: 22px !important;
  background: #fff !important;
}
.m-pricing-card .m-id-table {
  width: 100% !important;
  table-layout: fixed !important;
  border-collapse: collapse !important;
}
.m-pricing-card .m-id-table th,
.m-pricing-card .m-id-table td {
  padding: 0 4px !important;
  border-bottom: 1px solid #ececf0 !important;
  text-align: center !important;
  white-space: normal !important;
}
.m-pricing-card .m-id-table th {
  padding-top: 16px !important;
  padding-bottom: 12px !important;
  background: transparent !important;
  color: #6e6e73 !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  vertical-align: bottom !important;
}
.m-pricing-card .m-id-table td {
  height: 52px !important;
  color: #1d1d1f !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: -0.2px !important;
}
.m-pricing-card .m-id-table th:first-child,
.m-pricing-card .m-id-table td:first-child {
  width: 23% !important;
  padding-left: 16px !important;
  text-align: left !important;
}
.m-pricing-card .m-id-table td:first-child {
  color: #6e6e73 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}
.m-pricing-card .m-id-table tbody tr:last-child td {
  border-bottom: 0 !important;
}

.m-pricing-card > .m-btn-primary {
  display: block !important;
  margin-top: 22px !important;
  padding: 15px 12px !important;
  border-radius: 999px !important;
  background: #0071e3 !important;
  font-size: 15px !important;
  text-align: center !important;
}
/* FAQ: Apple-style typography (large bold title/questions, chevron, hairline dividers). */
.m-section:has(#faqList) > .m-card {
  padding: 40px 20px 14px !important;
  border-radius: 20px !important;
  background: #f5f5f7 !important;
  box-shadow: none !important;
}
.m-section:has(#faqList) .m-card-title {
  margin: 0 0 18px !important;
  color: #1d1d1f !important;
  font-size: 24px !important;
  font-weight: 750 !important;
  letter-spacing: -0.8px !important;
  line-height: 1.25 !important;
}
.m-section:has(#faqList) .m-faq-item {
  border-bottom: 1px solid #d2d2d7 !important;
}
.m-section:has(#faqList) .m-faq-item:last-child {
  border-bottom: 0 !important;
}
.m-section:has(#faqList) .m-faq-question {
  align-items: center !important;
  gap: 16px !important;
  padding: 18px 0 !important;
}
.m-section:has(#faqList) .m-faq-question h3 {
  color: #1d1d1f !important;
  font-size: 15px !important;
  font-weight: 750 !important;
  letter-spacing: -0.3px !important;
  line-height: 1.45 !important;
}
.m-section:has(#faqList) .m-faq-toggle {
  position: relative !important;
  width: 20px !important;
  height: 20px !important;
  font-size: 0 !important;
  transform: none !important;
}
.m-section:has(#faqList) .m-faq-toggle::after {
  content: "" !important;
  position: absolute !important;
  left: 4px !important;
  top: 2px !important;
  width: 9px !important;
  height: 9px !important;
  border-right: 2px solid #6e6e73 !important;
  border-bottom: 2px solid #6e6e73 !important;
  transform: rotate(45deg) !important;
  transition: transform .2s ease !important;
}
.m-section:has(#faqList) .m-faq-item.open .m-faq-toggle::after {
  top: 6px !important;
  transform: rotate(225deg) !important;
}
.m-section:has(#faqList) .m-faq-answer {
  padding: 0 0 18px !important;
  color: #424245 !important;
  font-size: 13px !important;
  line-height: 1.75 !important;
}
/* Card-type directory below the FAQ (large bold link list). */
.m-card-directory {
  padding: 36px 22px 24px;
}
.m-card-directory h2 {
  margin: 0 0 16px;
  color: #1d1d1f;
  font-size: 20px;
  font-weight: 750;
  letter-spacing: -0.6px;
  line-height: 1.2;
}
.m-card-directory-list {
  display: flex;
  flex-direction: column;
}
.m-card-directory-list a {
  padding: 8px 0;
  color: #1d1d1f;
  font-size: 14px;
  font-weight: 750;
  letter-spacing: -0.2px;
  line-height: 1.35;
  text-decoration: none;
}
.m-card-directory-list a:active {
  color: #0071e3;
}
/* Footer navigation, same as the home page. */
.m-page > .apple-style-footer, .apple-style-footer { padding-bottom: calc(96px + env(safe-area-inset-bottom)) !important; }
.apple-style-footer {
  margin: 0 !important;
  padding: 26px 20px calc(116px + env(safe-area-inset-bottom)) !important;
  background: #f5f5f7 !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #6e6e73 !important;
}

.apple-style-footer .app-footer-logo,
.apple-style-footer .app-footer-lead,
.apple-style-footer .app-footer-nav {
  display: none !important;
}

.app-footer-note {
  margin: 0 0 24px !important;
  padding-bottom: 22px !important;
  border-bottom: 1px solid #d2d2d7 !important;
  color: #6e6e73 !important;
  font-size: 12px !important;
  line-height: 1.65 !important;
}

.app-footer-accordion {
  border-top: 1px solid #d2d2d7 !important;
}

.app-footer-accordion details {
  border-bottom: 1px solid #d2d2d7 !important;
}

.app-footer-accordion summary {
  min-height: 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  color: #1d1d1f !important;
  cursor: pointer !important;
  list-style: none !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  user-select: none !important;
}

.app-footer-accordion summary::-webkit-details-marker {
  display: none !important;
}

.app-footer-accordion summary::after {
  content: '' !important;
  width: 8px !important;
  height: 8px !important;
  border-right: 2px solid #1d1d1f !important;
  border-bottom: 2px solid #1d1d1f !important;
  transform: rotate(45deg) translateY(-2px) !important;
  transition: transform .18s ease !important;
  opacity: .9 !important;
}

.app-footer-accordion details[open] summary::after {
  transform: rotate(225deg) translate(-2px, -1px) !important;
}

.app-footer-panel {
  display: grid !important;
  gap: 0 !important;
  padding: 0 0 12px 14px !important;
}

.app-footer-panel a {
  min-height: 34px !important;
  display: flex !important;
  align-items: center !important;
  color: #424245 !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  text-decoration: none !important;
}

.app-footer-panel a:active {
  color: #06c !important;
}

.app-footer-contact-line {
  margin: 24px 0 0 !important;
  color: #6e6e73 !important;
  font-size: 12px !important;
  line-height: 1.65 !important;
}

.app-footer-contact-line a,
.apple-style-footer .app-footer-legal a {
  color: #06c !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

.apple-style-footer .app-footer-legal {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px 9px !important;
  margin: 22px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: #6e6e73 !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
}

.apple-style-footer .app-footer-legal span {
  color: #86868b !important;
}

.apple-style-footer .app-footer-copy {
  margin: 16px 0 0 !important;
  color: #6e6e73 !important;
  font-size: 12px !important;
  line-height: 1.6 !important;
}


.app-footer-note {
  margin-bottom: 0 !important;
}

.app-footer-home {
  min-height: 48px !important;
  display: flex !important;
  align-items: center !important;
  color: #1d1d1f !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
}

.apple-style-footer { padding-bottom: calc(96px + env(safe-area-inset-bottom)) !important; }
/* Top-right menu: smaller link text. */
.app-menu-drawer .app-menu-links a,
.app-menu-links a {
  font-size: 16px !important;
  line-height: 1.4 !important;
  letter-spacing: -0.2px !important;
}
.app-menu-links {
  gap: 4px !important;
}
/* Footer legal links: same grey as other text, no underline, single line. */
.apple-style-footer .app-footer-legal {
  flex-wrap: nowrap !important;
  gap: 0 8px !important;
  white-space: nowrap !important;
  font-size: 11px !important;
}
.apple-style-footer .app-footer-legal a,
.apple-style-footer .app-footer-legal span {
  font-size: 11px !important;
  letter-spacing: 0 !important;
}
.apple-style-footer .app-footer-legal a {
  color: #6e6e73 !important;
  text-decoration: none !important;
}

.m-material-order-link {
  width: auto !important;
  min-width: 88px !important;
  padding: 0 24px !important;
  font-weight: 700 !important;
}

/* Redesigned processing overview on membership page */
.m-pricing-card .m-process-overview {
  margin: 0 0 14px !important;
  padding: 18px !important;
  border-radius: 24px !important;
  background: linear-gradient(180deg, #ffffff 0%, #f7f8fb 100%) !important;
  box-shadow: 0 18px 45px rgba(15, 23, 42, .06) !important;
}
.m-pricing-card .m-process-overview-head {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  gap: 6px 10px !important;
  align-items: center !important;
  margin-bottom: 14px !important;
}
.m-pricing-card .m-process-eyebrow {
  grid-column: 1 / -1 !important;
  color: #0071e3 !important;
  font-size: 11px !important;
  font-weight: 750 !important;
  letter-spacing: .06em !important;
}
.m-pricing-card .m-process-overview-head strong {
  color: #1d1d1f !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.03em !important;
}
.m-pricing-card .m-process-overview-head em {
  padding: 5px 10px !important;
  border-radius: 999px !important;
  background: #eafaf3 !important;
  color: #18815f !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 750 !important;
  white-space: nowrap !important;
}
.m-pricing-card .m-process-free-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
.m-pricing-card .m-process-free-grid span {
  min-height: 74px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  padding: 10px 6px !important;
  border-radius: 16px !important;
  background: #fff !important;
  color: #1d1d1f !important;
  box-shadow: inset 0 0 0 1px #edf0f5 !important;
  text-align: center !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  line-height: 1.25 !important;
}
.m-pricing-card .m-process-free-grid span::before {
  content: "✓" !important;
  width: 20px !important;
  height: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  background: #eafaf3 !important;
  color: #18815f !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}
.m-pricing-card .m-process-free-grid small {
  color: #86868b !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
}
.m-pricing-card .m-paid-option-cards {
  display: grid !important;
  gap: 8px !important;
  margin-top: 14px !important;
}
.m-pricing-card .m-paid-option-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 3px 10px !important;
  align-items: center !important;
  padding: 13px 14px !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: inset 0 0 0 1px #edf0f5 !important;
}
.m-pricing-card .m-paid-option-card strong {
  color: #1d1d1f !important;
  font-size: 13px !important;
  font-weight: 780 !important;
  line-height: 1.3 !important;
}
.m-pricing-card .m-paid-option-card span {
  grid-column: 1 !important;
  color: #86868b !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  line-height: 1.3 !important;
}
.m-pricing-card .m-paid-option-card em {
  grid-row: 1 / span 2 !important;
  grid-column: 2 !important;
  color: #0071e3 !important;
  font-size: 12px !important;
  font-style: normal !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}
/* Hide top notification bell on mobile header to prevent crowded navigation. */
header [aria-label*="通知"],
header [title*="通知"],
header [href*="notification"],
header [class*="notification"],
header [class*="notify"],
header [class*="bell"],
.mobile-header [aria-label*="通知"],
.mobile-header [title*="通知"],
.mobile-header [href*="notification"],
.mobile-header [class*="notification"],
.mobile-header [class*="notify"],
.mobile-header [class*="bell"],
.site-header [aria-label*="通知"],
.site-header [title*="通知"],
.site-header [href*="notification"],
.site-header [class*="notification"],
.site-header [class*="notify"],
.site-header [class*="bell"],
.app-header [aria-label*="通知"],
.app-header [title*="通知"],
.app-header [href*="notification"],
.app-header [class*="notification"],
.app-header [class*="notify"],
.app-header [class*="bell"] {
  display: none !important;
}

/* ===== Shared overrides that make the membership look work on every detail page ===== */

/* Small headings that the redesign removes */
.m-use-block .m-card-title,
.m-pricing-card .m-pricing-title,
.m-material-block > .m-card-title,
.m-material-block > .m-card-sub {
  display: none !important;
}

/* Hero call-to-action: centered pill */
.m-hero-actions .m-btn-primary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 88px !important;
  height: 40px !important;
  padding: 0 22px !important;
  border-radius: 999px !important;
  background: #0071e3 !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

/* Hero check list: compact, green ticks */
.m-hero-card .m-check-bullets {
  max-width: 330px !important;
  margin: 0 auto 24px !important;
  padding: 0 !important;
  list-style: none !important;
  text-align: left !important;
}
.m-hero-card .m-check-bullets li {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin: 0 0 10px !important;
  color: #424245 !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
}
.m-hero-card .m-check-icon {
  flex: 0 0 20px !important;
  width: 20px !important;
  height: 20px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  background: #eafaf3 !important;
  color: #18815f !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

/* Use-case tiles: three per row; rows that cannot fill three are split evenly */
.m-use-block .m-use-chips .m-use-chip:nth-child(n+4) {
  width: 33.333% !important;
  padding: 0 4px !important;
}
.m-use-block .m-use-chips .m-use-chip:nth-child(n+4) svg {
  box-sizing: content-box !important;
  width: 34px !important;
  height: 34px !important;
  padding: 27px !important;
}
.m-use-block .m-use-chips.m-use-n2 .m-use-chip,
.m-use-block .m-use-chips.m-use-n4 .m-use-chip,
.m-use-block .m-use-chips.m-use-n5 .m-use-chip:nth-child(n+4) {
  width: 50% !important;
  padding: 0 11px !important;
}
.m-use-block .m-use-chips.m-use-n7 .m-use-chip:nth-child(7) {
  width: 100% !important;
  padding: 0 11px !important;
}
.m-use-block .m-use-chips.m-use-n2 .m-use-chip svg,
.m-use-block .m-use-chips.m-use-n4 .m-use-chip svg,
.m-use-block .m-use-chips.m-use-n5 .m-use-chip:nth-child(n+4) svg,
.m-use-block .m-use-chips.m-use-n7 .m-use-chip:nth-child(7) svg {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 88px !important;
  padding: 27px 0 !important;
}

/* Design support: full-width pill button */
.m-design-compact-actions {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 16px !important;
}
.m-design-compact-actions .m-btn-primary {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 320px !important;
  height: 48px !important;
  margin: 0 auto !important;
  padding: 0 20px !important;
  border-radius: 999px !important;
  background: #0071e3 !important;
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
}

/* Knowledge-base links: clean white cards */
.m-kb-links {
  display: grid !important;
  gap: 10px !important;
  margin: 12px 14px !important;
  padding: 0 !important;
}
.m-kb-link {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 16px 18px !important;
  border: 0 !important;
  border-radius: 18px !important;
  background: #fff !important;
  color: #1d1d1f !important;
  font-size: 14px !important;
  text-decoration: none !important;
}

/* Hero actions: centered, no extra gap before the feature badges */
.m-hero-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 0 !important;
}
.m-hero-actions .m-btn-primary {
  flex: 0 0 auto !important;
}
.m-hero-card .m-feature-band {
  margin-top: 18px !important;
}
.m-hero-card .m-hero-feature-row-safe {
  margin-top: 12px !important;
}

.m-material-block .m-processing-fee-note {
  margin: 12px 4px 0 !important;
  color: #6e6e73 !important;
  font-size: 12px !important;
  line-height: 1.7 !important;
}

/* Pricing intro paragraphs */
.m-pricing-card .m-pricing-block > p[style] {
  margin: 0 0 14px !important;
  padding: 0 4px !important;
  color: #6e6e73 !important;
  font-size: 13px !important;
  line-height: 1.7 !important;
}

/* Per-card-type price calculator (ID-card style pricing) */
.m-pricing-card .m-id-method {
  padding: 18px !important;
  border: 0 !important;
  border-radius: 22px !important;
  background: #fff !important;
}
.m-pricing-card .m-id-method-formula {
  margin: 0 0 14px !important;
  color: #6e6e73 !important;
  font-size: 13px !important;
}
.m-pricing-card .m-id-method-formula strong {
  color: #1d1d1f !important;
  font-weight: 750 !important;
}
.m-pricing-card .m-id-method-grid {
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
}
.m-pricing-card .m-id-method-item {
  padding: 14px 12px !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: #f5f5f7 !important;
  text-align: center !important;
}
.m-pricing-card .m-id-method-item small {
  margin-bottom: 6px !important;
  color: #6e6e73 !important;
  font-size: 12px !important;
}
.m-pricing-card .m-id-method-item strong {
  color: #1d1d1f !important;
  font-size: 15px !important;
  font-weight: 750 !important;
  letter-spacing: -0.3px !important;
}
.m-pricing-card .m-id-method-item span {
  margin-top: 4px !important;
  color: #6e6e73 !important;
  font-size: 11px !important;
}
.m-pricing-card .m-id-calculator {
  margin-top: 16px !important;
}
.m-pricing-card .m-id-calculator-label {
  margin: 0 4px 8px !important;
  color: #6e6e73 !important;
  font-size: 13px !important;
}
.m-pricing-card .m-id-quantity-control {
  grid-template-columns: 52px minmax(0, 1fr) 52px !important;
  align-items: center !important;
  height: 52px !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #fff !important;
}
.m-pricing-card .m-id-quantity-control button {
  height: 100% !important;
  background: transparent !important;
  color: #0071e3 !important;
  font-size: 22px !important;
}
.m-pricing-card .m-id-quantity-control input {
  height: 100% !important;
  border: 0 !important;
  color: #1d1d1f !important;
  font-size: 18px !important;
  font-weight: 750 !important;
  text-align: center !important;
}
.m-pricing-card .m-id-band {
  margin: 10px 4px 0 !important;
  color: #6e6e73 !important;
  font-size: 12px !important;
  text-align: left !important;
}
.m-pricing-card .m-id-price-results {
  margin-top: 12px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 22px !important;
  background: #fff !important;
}
.m-pricing-card .m-id-price-head,
.m-pricing-card .m-id-price-row {
  padding: 0 18px !important;
}
.m-pricing-card .m-id-price-head {
  min-height: 44px !important;
  background: transparent !important;
  color: #6e6e73 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  border-bottom: 1px solid #ececf0 !important;
}
.m-pricing-card .m-id-price-row {
  min-height: 58px !important;
  background: transparent !important;
  border-bottom: 1px solid #ececf0 !important;
}
.m-pricing-card .m-id-price-row:last-child {
  border-bottom: 0 !important;
}
.m-pricing-card .m-id-price-name {
  color: #1d1d1f !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
}
.m-pricing-card .m-id-card-fee {
  color: #6e6e73 !important;
  font-size: 13px !important;
}
.m-pricing-card .m-id-total {
  color: #1d1d1f !important;
  font-size: 15px !important;
  font-weight: 750 !important;
}
.m-pricing-card .m-id-method-grid {
  grid-template-columns: 0.85fr 1.15fr !important;
}
.m-pricing-card .m-id-method-item strong {
  font-size: 14px !important;
}

/* Order button that some pages place directly under the hero feature badges */
.m-hero-card > .m-btn-primary.m-material-order-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: fit-content !important;
  height: 46px !important;
  margin: 8px auto 26px !important;
  padding: 0 30px !important;
  border-radius: 999px !important;
  background: #0071e3 !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

/* Inline links inside hero copy */
.m-hero-lead a,
.m-hero-short-copy a {
  color: #0071e3 !important;
  text-decoration: none !important;
}

/* Product cards with both an order button and a detail link */
.m-material-order-row {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 18px !important;
  margin-top: 16px !important;
}
.m-material-order-row .m-material-order-link {
  flex: 0 0 auto !important;
  border: 0 !important;
  width: 112px !important;
  min-width: 88px !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 24px !important;
  border-radius: 999px !important;
  background: #0071e3 !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}
.m-material-order-row .m-material-detail-link {
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #0071e3 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  text-decoration: none !important;
}

/* Hero "料金表" button scrolls to the pricing section below the sticky header */
html {
  scroll-behavior: smooth;
}
.m-pricing-card {
  scroll-margin-top: 70px;
}

/* Price table with several card types side by side */
.m-pricing-card .m-price-row.m-price-row-multi {
  grid-template-columns: 0.9fr 1fr 1.25fr 1fr !important;
  gap: 4px !important;
  padding: 0 16px !important;
}
.m-pricing-card .m-price-row-multi b {
  font-size: 14px !important;
}
.m-pricing-card .m-price-row-multi strong {
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: -0.3px !important;
  text-align: right !important;
  white-space: nowrap !important;
}
.m-pricing-card .m-price-row-head.m-price-row-multi strong {
  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

/* Long spec values wrap instead of widening the page */
.m-spec-tile-v2 strong {
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

/* Two choices side by side inside one product card (e.g. 白無地カード / テンプレート印刷) */
.m-material-order-row:has(.m-material-order-link ~ .m-material-order-link) {
  width: 100% !important;
  gap: 10px !important;
}
.m-material-order-row .m-material-order-link:first-child:nth-last-child(2),
.m-material-order-row .m-material-order-link:first-child:nth-last-child(2) ~ .m-material-order-link {
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 10px !important;
  font-size: 13px !important;
  text-align: center !important;
  white-space: nowrap !important;
}

/* Consultation link under the specification tiles */
.m-spec-card .m-spec-consult {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 12px 0 0 !important;
  padding: 16px 18px !important;
  border: 0 !important;
  border-radius: 22px !important;
  background: #fff !important;
  color: #1d1d1f !important;
  text-decoration: none !important;
}
.m-spec-card .m-spec-consult strong {
  display: block !important;
  color: #1d1d1f !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
}
.m-spec-card .m-spec-consult small {
  display: block !important;
  margin-top: 2px !important;
  color: #6e6e73 !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
}
.m-spec-card .m-spec-consult-icon {
  background: #f5f5f7 !important;
  color: #e8671c !important;
}
.m-spec-card .m-spec-consult-arrow {
  margin-left: auto !important;
  color: #86868b !important;
}
.m-spec-card .m-processing-fee-note {
  margin: 12px 4px 0 !important;
  color: #6e6e73 !important;
  font-size: 12px !important;
  line-height: 1.7 !important;
}
.m-spec-card .m-processing-detail {
  margin: 12px 0 0 !important;
}
.m-spec-card .m-spec-consult-icon {
  flex: 0 0 36px !important;
  width: 36px !important;
  height: 36px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
}

/* ID-card pages: the design-support card keeps only the title, the shared paragraph and the buttons */
.m-design-card .m-design-compact-lead,
.m-design-card .m-design-points {
  display: none !important;
}

/* Pricing intro and notes of the ID-card pricing panel */
.m-pricing-card .m-id-pricing-lead,
.m-pricing-card .m-id-price-note {
  margin: 0 4px 14px !important;
  color: #6e6e73 !important;
  font-size: 12px !important;
  line-height: 1.7 !important;
}
.m-pricing-card .m-id-method h3 {
  margin: 0 0 10px !important;
  color: #1d1d1f !important;
  font-size: 15px !important;
  font-weight: 750 !important;
}
.m-id-pricing-lead {
  margin: 0 18px 14px !important;
  color: #6e6e73 !important;
  font-size: 12px !important;
  line-height: 1.7 !important;
}

/* Closing contact card */
.m-cta-card {
  padding: 34px 22px 28px !important;
  border: 0 !important;
  border-radius: 28px !important;
  background: #fff !important;
  box-shadow: none !important;
  text-align: center !important;
}
.m-cta-card h2 {
  margin: 0 0 10px !important;
  color: #1d1d1f !important;
  font-size: 20px !important;
  font-weight: 750 !important;
  letter-spacing: -0.6px !important;
  line-height: 1.3 !important;
}
.m-cta-card p {
  margin: 0 0 20px !important;
  color: #6e6e73 !important;
  font-size: 13px !important;
  line-height: 1.7 !important;
}
.m-cta-card .m-cta-actions {
  display: flex !important;
  justify-content: center !important;
}
.m-cta-card .m-btn-primary {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 320px !important;
  height: 48px !important;
  padding: 0 20px !important;
  border-radius: 999px !important;
  background: #0071e3 !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
.m-cta-card .m-cta-note {
  margin-top: 16px !important;
  color: #6e6e73 !important;
  font-size: 12px !important;
  line-height: 1.7 !important;
}

/* Paid options: same checklist as the free ones, with an orange plus mark */
.m-processing-detail .m-tag-list {
  display: block !important;
  margin: 0 !important;
  padding: 0 18px !important;
  border-top: 1px solid #ececf0 !important;
}
.m-processing-detail .m-tag-paid {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 50px !important;
  padding: 0 !important;
  border-bottom: 1px solid #ececf0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #1d1d1f !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
}
.m-processing-detail .m-tag-paid:last-child {
  border-bottom: 0 !important;
}
.m-processing-detail .m-tag-paid::before {
  content: "+";
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #fff1e8;
  color: #b0530f;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
}
.m-processing-detail.is-paid .m-option-standard-label em {
  background: #fff1e8 !important;
  color: #b0530f !important;
}

/* Processing shown as cards (used when only a few items are supported) */
.m-processing-cards {
  margin: 14px 0 0 !important;
}
.m-pricing-card .m-processing-cards {
  margin: 0 0 12px !important;
}
.m-processing-cards-head {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 4px 12px !important;
}
.m-processing-cards-head strong {
  color: #1d1d1f !important;
  font-size: 17px !important;
  font-weight: 750 !important;
  letter-spacing: -0.3px !important;
}
.m-processing-cards-head em {
  padding: 3px 10px !important;
  border-radius: 999px !important;
  background: #eafaf3 !important;
  color: #18815f !important;
  font-size: 11px !important;
  font-style: normal !important;
}
.m-processing-cards.is-paid .m-processing-cards-head em {
  background: #fff1e8 !important;
  color: #b0530f !important;
}
.m-processing-cards-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
}
.m-processing-cards.is-odd .m-processing-card:last-child {
  grid-column: 1 / -1 !important;
}
.m-processing-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 22px 12px 18px !important;
  border-radius: 22px !important;
  background: #fff !important;
  color: #1d1d1f !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  text-align: center !important;
}
.m-processing-card-icon {
  width: 56px !important;
  height: 56px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 18px !important;
  background: #f5f5f7 !important;
  color: #e8671c !important;
}
.m-processing-card-icon svg {
  width: 28px !important;
  height: 28px !important;
}

/* ID-card price simulator: formula line, quantity stepper, one card per card type */
.m-pricing-card .m-id-formula-line {
  margin: 0 4px 14px !important;
  color: #6e6e73 !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}
.m-pricing-card .m-id-formula-line b {
  color: #1d1d1f !important;
  font-weight: 750 !important;
}
.m-pricing-card .m-id-price-results {
  margin-top: 12px !important;
  overflow: visible !important;
  border-radius: 0 !important;
  background: transparent !important;
}
.m-pricing-card .m-id-price-head {
  display: none !important;
}
.m-pricing-card #idCardPriceRows {
  display: grid !important;
  gap: 10px !important;
}
.m-pricing-card .m-id-price-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-areas: "name total" "fee total" !important;
  align-items: center !important;
  column-gap: 12px !important;
  row-gap: 4px !important;
  min-height: 0 !important;
  padding: 18px 20px !important;
  border: 0 !important;
  border-radius: 22px !important;
  background: #fff !important;
}
.m-pricing-card .m-id-price-name {
  grid-area: name !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}
.m-pricing-card .m-id-card-fee {
  grid-area: fee !important;
  text-align: left !important;
  color: #6e6e73 !important;
  font-size: 12px !important;
}
.m-pricing-card .m-id-card-fee::before {
  content: "カード料金 ";
}
.m-pricing-card .m-id-total {
  grid-area: total !important;
  align-self: center !important;
  color: #1d1d1f !important;
  font-size: 22px !important;
  font-weight: 750 !important;
  letter-spacing: -0.6px !important;
  white-space: nowrap !important;
}

/* Closing card: calculator entry */
.m-cta-card .m-cta-icon {
  width: 64px !important;
  height: 64px !important;
  margin: 0 auto 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 20px !important;
  background: #f5f5f7 !important;
  color: #0071e3 !important;
}
.m-cta-card .m-cta-icon svg {
  width: 32px !important;
  height: 32px !important;
}

/* ===== Same page scaffold as the membership card page: white page, 14px between modules ===== */
html body,
html body.has-app-mobile-header,
html body .m-page,
html body.has-app-mobile-header .m-page {
  background: #fff !important;
}
body .m-page > .m-section {
  margin: 14px 14px 0 !important;
  background: transparent !important;
}
body .m-page > .m-section:first-of-type {
  margin: 14px 0 0 !important;
}
body .m-page > .m-section > .m-hero-card {
  border-radius: 0 !important;
  box-shadow: none !important;
}
body .m-page .m-material-block {
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
}
body .m-page .m-material-grid {
  margin: 10px 0 0 !important;
}
body .m-page .m-material-item {
  padding: 34px 18px !important;
}
body .m-page .m-use-block {
  padding: 16px !important;
  border-radius: 8px !important;
  background: #fff !important;
}


/* Pricing-panel accordion rules reused inside the specification panel */
.m-spec-card .m-option-standard-row {
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 22px !important;
  background: #fff !important;
  overflow: hidden !important;
}
.m-spec-card .m-option-standard-label {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 18px !important;
  list-style: none !important;
  cursor: pointer !important;
  user-select: none !important;
}
.m-spec-card .m-option-standard-label::-webkit-details-marker {
  display: none !important;
}
.m-spec-card .m-option-standard-label::after {
  content: "" !important;
  width: 8px !important;
  height: 8px !important;
  margin: -3px 4px 0 auto !important;
  border-right: 2px solid #1d1d1f !important;
  border-bottom: 2px solid #1d1d1f !important;
  transform: rotate(45deg) !important;
  transition: transform .18s ease !important;
}
.m-spec-card .m-option-standard-row[open] .m-option-standard-label::after {
  margin-top: 4px !important;
  transform: rotate(225deg) !important;
}
.m-spec-card .m-option-standard-label strong {
  color: #1d1d1f !important;
  font-size: 17px !important;
  font-weight: 750 !important;
  letter-spacing: -0.3px !important;
}
.m-spec-card .m-option-standard-label em {
  padding: 3px 10px !important;
  border-radius: 999px !important;
  background: #eafaf3 !important;
  color: #18815f !important;
  font-size: 11px !important;
  font-style: normal !important;
}
.m-spec-card .m-tag-list {
  display: block !important;
  margin: 0 !important;
  padding: 0 18px !important;
  border-top: 1px solid #ececf0 !important;
}
.m-spec-card .m-tag-free {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 50px !important;
  padding: 0 !important;
  border-bottom: 1px solid #ececf0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #1d1d1f !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
}
.m-spec-card .m-tag-free:last-child {
  border-bottom: 0 !important;
}
.m-spec-card .m-tag-free::before {
  content: "✓";
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #eafaf3;
  color: #18815f;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

/* Product detail spec thumbnails: keep material image visible after this late stylesheet loads. */
html body .mpd-page .mpd-spec-row:has(.mpd-spec-visual) {
  display: grid !important;
  grid-template-columns: 84px minmax(0, 1fr) 82px !important;
  align-items: center !important;
  gap: 14px !important;
}
html body .mpd-page .mpd-spec-row .mpd-spec-visual {
  width: 82px !important;
  max-width: 82px !important;
  aspect-ratio: 1.586 / 1 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  object-fit: cover !important;
  border-radius: 8px !important;
  background: #f5f5f7 !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .08) !important;
}
@media (max-width: 350px) {
  html body .mpd-page .mpd-spec-row:has(.mpd-spec-visual) {
    grid-template-columns: 76px minmax(0, 1fr) 66px !important;
    gap: 10px !important;
  }
  html body .mpd-page .mpd-spec-row .mpd-spec-visual {
    width: 66px !important;
    max-width: 66px !important;
  }
}