body {background: #f3f7fc;}

    a {text-decoration: none;color: inherit;}

    .page {font-family: "Noto Sans TC", "Microsoft JhengHei", Arial, sans-serif;max-width: 1180px;margin: 0 auto;color: #1f2937;line-height: 1.7;}
.topful{display:flex; align-items:center; gap:8px; flex-wrap:wrap;  padding:5px 5px 0 0; font-size:14px; justify-content:flex-end}
.topful span{letter-spacing:0; font-weight:700;}
.ismmtsbox .breadcrumb {font-size: 14px;color: #64748b;margin-bottom: 18px;}
.imgww{max-width:100%; display:block; vertical-align:bottom}
.ismmtsbox .hero {display: grid;grid-template-columns: 1.05fr 0.95fr;gap: 36px;align-items: center;background: linear-gradient(135deg, #ffffff 0%, #eef6ff 100%);border: 1px solid #dbeafe;border-radius: 28px;padding: 48px;box-shadow: 0 18px 45px rgba(30, 64, 175, 0.08);}

.ismmtsbox .badge {display: inline-flex;align-items: center;gap: 8px;padding: 7px 14px;border-radius: 999px;background: #e0f2fe;color: #0369a1;font-size: 14px;font-weight: 700;margin-bottom: 18px;}

.ismmtsbox .hero h1 {font-size: 44px;line-height: 1.18;letter-spacing: -1px;color: #0f172a;margin-bottom: 18px;}

.ismmtsbox .hero p {font-size: 18px;color: #475569;margin-bottom: 26px;max-width: 560px;}

.ismmtsbox .hero-list {display: grid;gap: 10px;margin-bottom: 30px;color: #334155;font-weight: 600;}
.hero-list li {display: flex;  align-items: flex-start;}

.heroicon {white-space: nowrap;margin-right: 8px;flex-shrink: 0; /* 防止被壓縮 */
}
.ismmtsbox .hero-list span.heroicon::before {content: "✓";color: #2563eb;font-weight: 900;margin-right: 10px;}

.ismmtsbox .actions {display: flex;flex-wrap: wrap;gap: 14px;}

.ismmtsbox .btn {display: inline-flex;align-items: center;justify-content: center;padding: 13px 22px;border-radius: 14px;font-weight: 800;transition: 0.2s ease;cursor: pointer;border: 0;font-size: 15px;}

.ismmtsbox .btn-primary {background: #2563eb;color: #fff;box-shadow: 0 10px 24px rgba(37, 99, 235, 0.25);}

.ismmtsbox .btn-primary:hover {background: #1d4ed8;transform: translateY(-2px);}

.ismmtsbox .btn-secondary {background: #ffffff;color: #2563eb;border: 1px solid #bfdbfe;}

.ismmtsbox .btn-secondary:hover {background: #eff6ff;}

.ismmtsbox .product-preview {background: #0f172a;border-radius: 24px;padding: 18px;color: #fff;box-shadow: 0 24px 48px rgba(15, 23, 42, 0.22);}

.ismmtsbox .preview-top {display: flex;gap: 7px;margin-bottom: 18px;}

.ismmtsbox .dot {width: 10px;height: 10px;border-radius: 999px;background: #94a3b8;}

.ismmtsbox .tool-card-preview {background: #ffffff;border-radius: 20px;padding: 26px;color: #0f172a;}

.ismmtsbox .tool-header-mini {display: flex;align-items: center;gap: 16px;padding-bottom: 18px;margin-bottom: 18px;border-bottom: 1px solid #e2e8f0;}

.ismmtsbox .tool-logo {width: 72px;height: 72px;border-radius: 22px;display: grid;place-items: center;background: linear-gradient(135deg, #2563eb, #38bdf8);color: #fff;font-size: 32px;font-weight: 900;box-shadow: 0 12px 24px rgba(37, 99, 235, 0.22);flex: 0 0 auto;}

.ismmtsbox .tool-provider-label {display: inline-flex;margin-bottom: 6px;padding: 4px 9px;border-radius: 999px;background: #f1f5f9;color: #475569;font-size: 12px;font-weight: 800;}

.ismmtsbox .tool-meta h3 {font-size: 20px;color: #0f172a;margin-bottom: 2px;}

.ismmtsbox .tool-meta p {font-size: 14px;color: #64748b;margin: 0;}

.ismmtsbox .preview-block-title {font-size: 13px;color: #64748b;font-weight: 900;letter-spacing: 0.08em;margin-bottom: 10px;}

.ismmtsbox .preview-tags {display: flex;flex-wrap: wrap;gap: 8px;margin-bottom: 18px;}

.ismmtsbox .preview-tag {padding: 7px 11px;border-radius: 999px;background: #eff6ff;color: #1d4ed8;font-size: 13px;font-weight: 800;border: 1px solid #bfdbfe;}

.ismmtsbox .quick-panel {display: grid;gap: 10px;margin-bottom: 18px;}

.ismmtsbox .quick-item {display: flex;justify-content: space-between;gap: 14px;padding: 13px 14px;background: #f8fafc;border: 1px solid #e2e8f0;border-radius: 16px;font-size: 14px;}

.ismmtsbox .quick-item span:first-child {color: #64748b;font-weight: 800;}

.ismmtsbox .quick-item span:last-child {color: #0f172a;font-weight: 900;text-align: right;}

.ismmtsbox .tool-route-box {display: flex;gap: 12px;align-items: flex-start;padding: 15px;border-radius: 18px;background: linear-gradient(135deg, #eff6ff, #f8fafc);border: 1px solid #bfdbfe;color: #1e3a8a;font-size: 14px;font-weight: 800;}

.ismmtsbox .tool-route-box strong {display: block;color: #1d4ed8;margin-bottom: 2px;}

.ismmtsbox section {margin-top: 34px;}

.ismmtsbox .section-title {text-align: center;margin-bottom: 24px;}

.ismmtsbox .section-title h2 {font-size: 30px;color: #0f172a;margin-bottom: 8px;}

.ismmtsbox .section-title p {color: #64748b;font-size: 16px;}

.ismmtsbox .grid-3 {display: grid;
	  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));gap: 18px;}

.ismmtsbox .card {background: #fff;border: 1px solid #e2e8f0;border-radius: 22px;padding: 26px;box-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);}

.ismmtsbox .card-icon {width: 48px;height: 48px;display: grid;place-items: center;border-radius: 16px;background: #eff6ff;color: #2563eb;font-size: 23px;margin-bottom: 16px;}
.ismmtsbox .card-icon::before{content:'\2744'}
.ismmtsbox .card h3 {font-size: 20px;margin-bottom: 10px;color: #0f172a;}

.ismmtsbox .card p,.ismmtsbox .card li {color: #64748b;font-size: 15px;}

.ismmtsbox .card ul {padding-left: 18px;margin-top: 10px;}

.ismmtsbox .pain {background: #fff;border-radius: 26px;padding: 34px;border: 1px solid #e2e8f0;}

.ismmtsbox .pain-list {display: grid;grid-template-columns: repeat(2, 1fr);gap: 14px;margin-top: 18px;}

.ismmtsbox .pain-item {background: #f8fafc;border: 1px solid #e2e8f0;border-radius: 16px;padding: 16px;color: #334155;font-weight: 700;}

.ismmtsbox .pain-item::before {content: "!";display: inline-grid;place-items: center;width: 22px;height: 22px;border-radius: 999px;background: #fee2e2;color: #dc2626;margin-right: 10px;font-weight: 900;}

.ismmtsbox .result {display: grid;grid-template-columns: 0.85fr 1.15fr;gap: 22px;align-items: stretch;}

.ismmtsbox .result-card {background: #fff;border-radius: 24px;padding: 28px;border: 1px solid #e2e8f0;}

.ismmtsbox .metric {display: flex;justify-content: space-between;padding: 14px 0;border-bottom: 1px solid #e2e8f0;font-weight: 800;}

.ismmtsbox .metric span:last-child {color: #2563eb;}

.ismmtsbox .recommendation {background: #f8fafc;border-radius: 18px;padding: 20px;margin-top: 18px;}

.ismmtsbox .recommendation h4 {margin-bottom: 10px;color: #0f172a;}

.ismmtsbox .recommendation p {color: #475569;font-size: 15px;}

.ismmtsbox .steps {display: grid;grid-template-columns: repeat(4, 1fr);gap: 16px;}

.ismmtsbox .step {background: #fff;border: 1px solid #e2e8f0;border-radius: 20px;padding: 22px;position: relative;}

.ismmtsbox .step-num {width: 34px;height: 34px;display: grid;place-items: center;border-radius: 12px;background: #2563eb;color: #fff;font-weight: 900;margin-bottom: 14px;}

.ismmtsbox .step h3 {font-size: 18px;margin-bottom: 8px;}

.ismmtsbox .step p {color: #64748b;font-size: 14px;}

.ismmtsbox .target-list {display: flex;flex-wrap: wrap;justify-content: center;gap: 12px;}

.ismmtsbox .tag {background: #ffffff;border: 1px solid #bfdbfe;color: #1d4ed8;padding: 10px 16px;border-radius: 999px;font-weight: 800;box-shadow: 0 6px 16px rgba(37, 99, 235, 0.06);}

.ismmtsbox .cta {text-align: center;background: linear-gradient(135deg, #1d4ed8, #0284c7);color: #fff;border-radius: 28px;padding: 46px 24px;box-shadow: 0 20px 45px rgba(37, 99, 235, 0.24);}

.ismmtsbox .cta h2 {font-size: 32px;margin-bottom: 10px;}

.ismmtsbox .cta p {color: #dbeafe;margin-bottom: 24px;}

.ismmtsbox .cta .btn {background: #fff;color: #1d4ed8;}

    @media (max-width: 900px) {
.ismmtsbox .hero,ismmtsbox .result {  grid-template-columns: 1fr;  padding: 32px;}
.ismmtsbox .grid-3,.ismmtsbox .steps,.ismmtsbox .pain-list {  grid-template-columns: 1fr;}
.ismmtsbox .hero h1 {  font-size: 34px;}