:root {
  --space-7: 28px;
  --space-14: 56px;
  --mdl-heading: -apple-system, BlinkMacSystemFont, "PingFang TC", "PingFang HK", "Noto Sans CJK TC", "Microsoft JhengHei", sans-serif;
  --mdl-dark: linear-gradient(113deg, #200a35 0%, #30104f 100%);
  --mdl-section-y: clamp(72px, 9.4vw, 135px);
  --mdl-radius-card: 12px;
}

.mdl-nav a { font-size: 16px; font-weight: 500; }
.mdl-header-cta { font-weight: 500; font-size: 14px; padding: 12px 22px; }

.mdl-eyebrow { font-weight: 500; letter-spacing: .14em; }

.mdl-hero { padding: clamp(72px, 8vw, 120px) var(--space-5) clamp(48px, 5vw, 80px); }
.mdl-hero-inner { max-width: 1040px; }
.mdl-hero-title {
  font-family: var(--mdl-heading);
  font-weight: 400;
  font-size: clamp(34px, 5.6vw, 80px);
  text-wrap: balance;
  line-height: 1.12;
  letter-spacing: 0;
  margin-bottom: var(--space-6);
}
.mdl-hero-desc { font-size: 18px; line-height: 1.8; max-width: 680px; }

.mdl-btn { font-weight: 500; font-size: 15px; padding: 16px 28px; }

.mdl-trust-name { font-family: var(--mdl-heading); font-weight: 500; opacity: 1; color: var(--clr-text-muted); }

.mdl-data-wrap { background: var(--mdl-dark); padding: var(--mdl-section-y) var(--space-5); }
.mdl-data-title {
  font-family: var(--mdl-heading);
  font-weight: 400;
  font-size: clamp(30px, 4vw, 52px);
  line-height: 1.25;
  letter-spacing: 0;
}
.mdl-stat-card { border-radius: var(--mdl-radius-card); }
.mdl-stat-num {
  font-family: var(--mdl-heading);
  font-weight: 400;
  font-size: clamp(40px, 5vw, 64px);
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.mdl-stat-label { font-size: 13px; }

.mdl-section-head { margin-bottom: clamp(40px, 5vw, 72px); }
.mdl-section-title {
  text-wrap: balance;
  font-family: var(--mdl-heading);
  font-weight: 400;
  font-size: clamp(28px, 3.2vw, 40px);
  line-height: 1.25;
  letter-spacing: 0;
}

.mdl-services, .mdl-testimonials, .mdl-features-wrap, .mdl-about { padding: var(--mdl-section-y) 0; }

.mdl-service-card, .mdl-testi-card, .mdl-feature-card { border-radius: var(--mdl-radius-card); }
.mdl-service-num { font-family: var(--mdl-heading); font-weight: 500; }
.mdl-service-title, .mdl-feature-title, .mdl-testi-author { font-family: var(--mdl-heading); font-weight: 500; }
.mdl-service-title { font-size: 22px; }
.mdl-service-link { font-weight: 500; border-radius: 8px; }

.mdl-features-wrap { background: var(--mdl-dark); }
.mdl-feature-card { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.12); }

.mdl-about-img {
  aspect-ratio: auto;
  border-radius: var(--mdl-radius-card);
  background: var(--clr-bg-alt);
  padding: var(--space-6);
  display: flex;
  align-items: center;
  justify-content: center;
}
.mdl-about-img svg { width: 100%; height: auto; display: block; }

.mdl-cta-inner h2 { font-family: var(--mdl-heading); font-weight: 500; letter-spacing: 0; }

.mdl-footer { background: var(--mdl-dark); }
.mdl-footer-logo { font-weight: 900; }
@media (min-width: 800px) { .mdl-footer-grid { grid-template-columns: 2fr 1fr 1fr 1fr 1fr; } }
.mdl-footer .footer-link { display: block; font-size: 14px; color: rgba(255,255,255,.75); margin-bottom: var(--space-3); }
.mdl-footer .footer-link:hover { color: #fff; }
@media (min-width: 700px) { .mdl-service-card:last-child:nth-child(odd) { grid-column: 1 / -1; } }
.mdl-btn, .mdl-service-link { min-height: 44px; }
@media (max-width: 767px) {
  .mdl-topbar { text-align: center; padding: 6px var(--space-4); line-height: 1.5; }
  .mdl-header { position: static; }
  .mdl-header-inner { height: auto; flex-wrap: wrap; row-gap: var(--space-2); padding: var(--space-3) var(--space-4) 0; }
  .mdl-brand { order: 1; }
  .mdl-brand-mark { width: 36px; height: 36px; font-size: 15px; }
  .mdl-brand-text { font-size: 17px; }
  .mdl-header-cta { order: 2; margin-left: auto; white-space: nowrap; min-height: 44px; padding: 0 18px; font-size: 14px; }
  .mdl-nav { order: 3; flex: 1 0 100%; gap: 0; justify-content: space-between; overflow-x: auto; scrollbar-width: none; border-top: 1px solid var(--clr-border); }
  .mdl-nav::-webkit-scrollbar { display: none; }
  .mdl-nav a { flex: 0 0 auto; display: inline-flex; align-items: center; min-height: 44px; padding: 0 10px; font-size: 15px; white-space: nowrap; }
  .mdl-about-img { padding: var(--space-3); }
  .mdl-trust-strip { gap: var(--space-3) var(--space-5); }
  .mdl-trust-label { flex-basis: 100%; text-align: center; }
  .mdl-footer .mdl-footer-link, .mdl-footer .footer-link { padding: 10px 0; margin-bottom: 0; }
}