/* ============================================================
   service-marketing.html 营销型网站（居中大圆图 hero）
   ============================================================ */

.mkt-hero {
  padding: calc(var(--header-h) + var(--topbar-h) + 50px) 0 70px;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.7), transparent 60%),
    linear-gradient(180deg, var(--green) 0%, var(--cream) 70%);
  text-align: center;
  overflow: hidden;
}
.mkt-bread { justify-content: center; margin-bottom: 22px; font-size: .88rem; color: var(--ink-3); }
.mkt-bread a { font-weight: 600; color: var(--ink-2); }
.mkt-bread em { font-style: normal; color: var(--ink); }
.mkt-hero-text { max-width: 760px; margin: 0 auto; }
.mkt-hero-sub { margin: 16px auto 30px; }

.mkt-hero-circle {
  position: relative;
  width: min(560px, 80%);
  margin: 36px auto 40px;
  aspect-ratio: 1 / 1;
}
.mkt-hero-photo {
  position: absolute; inset: 14px;
  border-radius: 50%;
  overflow: hidden;
  box-shadow: var(--clay-shadow-lg);
}
.mkt-hero-photo img { width: 100%; height: 100%; object-fit: cover; }
.mkt-hero-ring {
  position: absolute; inset: 0;
  border-radius: 50%;
  border: 3px dashed rgba(139,180,126,.6);
}
.mkt-hero-cta { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-bottom: 14px; }
.mkt-hero-contact { font-size: .9rem; color: var(--ink-3); }

/* 错位圆卡 */
.mkt-value {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 26px;
}
.mkt-vcard {
  background: linear-gradient(165deg, #FFFDF6 0%, var(--cream-2) 100%);
  border-radius: var(--radius);
  padding: 30px 24px;
  box-shadow: var(--clay-shadow-sm);
}
.mkt-vcard-offset { transform: translateY(28px); }
.mkt-vcard:hover { transform: translateY(-6px); }
.mkt-vcard-offset:hover { transform: translateY(22px); }
.mkt-vcircle {
  width: 64px; height: 64px; border-radius: 50%;
  background: radial-gradient(circle at 30% 25%, #FFF, var(--green) 75%);
  color: #3F5238; font-weight: 800; font-size: 1.4rem;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 16px;
  box-shadow: var(--clay-shadow-sm);
}
.mkt-vcard h3 { margin-bottom: 8px; font-size: 1.08rem; }
.mkt-vcard p { font-size: .92rem; }

/* 交付清单两列对勾 */
.mkt-deliver-bg { background: var(--cream-2); }
.mkt-check {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px 50px;
}
.mkt-check-list li {
  padding-left: 36px;
  position: relative;
  margin-bottom: 14px;
  color: var(--ink-2);
}
.mkt-check-list li::before {
  content: "";
  position: absolute; left: 0; top: .1em;
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--green);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233F5238' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='5 12 10 17 19 7'/></svg>");
  background-size: 16px;
  background-position: center;
  background-repeat: no-repeat;
}

/* 适用人群 左图右文 */
.mkt-who {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 50px;
  align-items: center;
}
.mkt-who-photo {
  border-radius: 62% 38% 55% 45% / 52% 46% 54% 48%;
  overflow: hidden;
  box-shadow: var(--clay-shadow);
}
.mkt-who-photo img { width: 100%; height: auto; }
.mkt-who-text h2 { margin: 10px 0 14px; }
.mkt-who-text .list-dot li { margin-bottom: 12px; }
.mkt-who-text b { color: var(--ink); }

/* 两列对比 */
.mkt-vs-bg { background: var(--cream-2); }
.mkt-vs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
}
.mkt-vs-col {
  border-radius: var(--radius);
  padding: 34px 32px;
  box-shadow: var(--clay-shadow-sm);
}
.mkt-vs-us { background: linear-gradient(165deg, #E5EFDC, var(--green)); }
.mkt-vs-old { background: var(--cream); }
.mkt-vs-col h3 { margin-bottom: 18px; }
.mkt-vs-col ul li {
  padding-left: 26px; position: relative; margin-bottom: 10px;
  color: var(--ink-2); font-size: .96rem;
}
.mkt-vs-col ul li::before {
  content: "✓"; position: absolute; left: 0; top: 0;
  font-weight: 800; color: var(--green-3);
}
.mkt-vs-old ul li::before { content: "✗"; color: var(--ink-3); }

/* 案例横向大卡 */
.mkt-cases {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 26px;
}
.mkt-case {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  background: linear-gradient(165deg, #FFFDF6, var(--cream-2));
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--clay-shadow-sm);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.mkt-case:hover { transform: translateY(-6px); box-shadow: var(--clay-shadow); }
.mkt-case img { width: 100%; height: 100%; object-fit: cover; }
.mkt-case-body { padding: 26px 24px; }
.mkt-case-body b { display: block; margin-bottom: 10px; font-size: 1.05rem; }
.mkt-case-body p { font-size: .92rem; margin-bottom: 12px; }
.mkt-case-body span { color: var(--green-3); font-weight: 700; font-size: .92rem; }
.mkt-more { text-align: center; margin-top: 28px; }

/* 价格 */
.mkt-price-bg { background: linear-gradient(135deg, var(--yellow) 0%, var(--cream) 100%); }
.mkt-prices {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.mkt-pcard {
  background: var(--cream);
  border-radius: var(--radius);
  padding: 30px 26px;
  text-align: center;
  box-shadow: var(--clay-shadow-sm);
}
.mkt-pcard-hot {
  transform: scale(1.05);
  background: linear-gradient(165deg, #E5EFDC, var(--green));
}
.mkt-pnum { font-size: 1.9rem; font-weight: 800; color: var(--ink); margin: 14px 0 8px; }
.mkt-pcard p { font-size: .92rem; }

/* FAQ */
.mkt-faq { max-width: 820px; margin: 0 auto; }
.mkt-faq details {
  background: var(--cream-2);
  border-radius: var(--radius-sm);
  padding: 18px 24px;
  margin-bottom: 14px;
  box-shadow: var(--clay-shadow-sm);
}
.mkt-faq summary {
  cursor: pointer; font-weight: 700; font-size: 1.02rem;
  list-style: none; position: relative; padding-right: 30px;
}
.mkt-faq summary::-webkit-details-marker { display: none; }
.mkt-faq summary::after {
  content: "+"; position: absolute; right: 0; top: 0;
  font-size: 1.4rem; color: var(--green-3);
}
.mkt-faq details[open] summary::after { content: "−"; }
.mkt-faq details p { margin-top: 10px; font-size: .95rem; }
.mkt-faq a { color: var(--green-3); font-weight: 600; }

/* CTA */
.mkt-cta {
  padding: 80px 0;
  background: linear-gradient(160deg, var(--green) 0%, var(--cream) 100%);
}
.mkt-cta-inner { text-align: center; max-width: 760px; margin: 0 auto; }
.mkt-cta-btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin: 22px 0; }
.mkt-cta-other { font-size: .9rem; color: var(--ink-3); }
.mkt-cta-other a { color: var(--green-3); font-weight: 600; margin: 0 6px; }

@media (max-width: 1024px) {
  .mkt-value { grid-template-columns: repeat(2, 1fr); }
  .mkt-vcard-offset { transform: none; }
  .mkt-check { grid-template-columns: 1fr; }
  .mkt-who { grid-template-columns: 1fr; }
  .mkt-vs { grid-template-columns: 1fr; }
  .mkt-cases { grid-template-columns: 1fr; }
  .mkt-prices { grid-template-columns: 1fr; }
  .mkt-pcard-hot { transform: none; }
}
@media (max-width: 560px) {
  .mkt-value { grid-template-columns: 1fr; }
  .mkt-case { grid-template-columns: 1fr; }
}

.mkt-about-bg { background: var(--cream-2); }
.mkt-about p { max-width: 820px; font-size: 1.02rem; line-height: 1.9; }
