/* ============================================================
   ujoffshore.com · page-marketing-site.css —— 营销型官网定制（种子基准·服务详情页）
   body.page-marketing-site 作用域；分栏 hero + 手账折页式板块
   ============================================================ */

/* ---------- 分栏 Hero ---------- */
.page-marketing-site .hero-split{
  position:relative;overflow:hidden;background:linear-gradient(120deg,var(--c-pink-wash),var(--c-cream-wash) 60%);
}
.page-marketing-site .hero-split .hs-grid{display:grid;grid-template-columns:1fr;gap:clamp(26px,4vw,54px);align-items:center;padding-block:clamp(40px,6vw,80px)}
@media (min-width:900px){.page-marketing-site .hero-split .hs-grid{grid-template-columns:1.05fr .95fr}}
.page-marketing-site .hero-split .hs-kicker{display:inline-flex;align-items:center;gap:8px;font-size:.86rem;letter-spacing:.22em;color:var(--c-accent);font-weight:600}
.page-marketing-site .hero-split .hs-kicker::before{content:"";width:30px;height:2px;background:var(--c-pink)}
.page-marketing-site .hero-split h1{font-size:clamp(1.9rem,3.8vw,2.9rem);margin:16px 0 10px}
.page-marketing-site .hero-split .hs-desc{color:var(--c-ink-soft);max-width:520px}
.page-marketing-site .hero-split .hs-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.page-marketing-site .hero-split .hs-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}
.page-marketing-site .hero-split .hs-img{position:relative}
.page-marketing-site .hero-split .hs-img img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-xl);box-shadow:var(--sh-3)}
.page-marketing-site .hero-split .hs-img .sticker{
  position:absolute;right:-12px;top:-14px;transform:rotate(5deg);
  background:var(--c-white);border:1.5px dashed var(--c-pink);border-radius:12px;
  padding:.5em 1em;font-family:var(--f-serif);font-weight:700;color:var(--c-pink-deep);box-shadow:var(--sh-1);
}
.page-marketing-site .hero-split .hs-img .sticker.s2{left:-10px;right:auto;top:auto;bottom:-12px;transform:rotate(-4deg);color:var(--c-accent);border-color:var(--c-accent)}

/* ---------- 痛点→方案 ---------- */
.page-marketing-site .pain-wrap{display:grid;grid-template-columns:1fr;gap:26px}
@media (min-width:820px){.page-marketing-site .pain-wrap{grid-template-columns:1fr 1fr;gap:34px}}
.page-marketing-site .pain-box{background:var(--c-white);border-radius:var(--r-lg);padding:clamp(22px,3vw,32px);box-shadow:var(--sh-1);border:1px solid var(--c-line-soft)}
.page-marketing-site .pain-box h3{display:flex;align-items:center;gap:10px;font-size:1.12rem}
.page-marketing-site .pain-box ul{list-style:none;padding:0;margin:0}
.page-marketing-site .pain-box li{position:relative;padding:.5em 0 .5em 1.7em;color:var(--c-ink-soft);font-size:.95rem}
.page-marketing-site .pain-box li::before{content:"";position:absolute;left:0;top:1em;width:10px;height:10px;border-radius:50%}
.page-marketing-site .pain-pain li::before{background:var(--c-pink)}
.page-marketing-site .pain-solve{background:linear-gradient(150deg,var(--c-cream),var(--c-pink-wash))}
.page-marketing-site .pain-solve li::before{background:var(--c-sage)}

/* ---------- 模块清单：折页卡 ---------- */
.page-marketing-site .mod-grid{display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width:640px){.page-marketing-site .mod-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.page-marketing-site .mod-grid{grid-template-columns:repeat(3,1fr)}}
.page-marketing-site .mod-card{position:relative;background:var(--c-white);border-radius:var(--r-md);padding:26px 24px;box-shadow:var(--sh-1);border:1px solid var(--c-line-soft);overflow:hidden;transition:transform .3s var(--ease)}
.page-marketing-site .mod-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--c-pink-soft);transition:width .3s var(--ease)}
.page-marketing-site .mod-card:hover{transform:translateY(-5px)}
.page-marketing-site .mod-card:hover::before{width:10px;background:var(--c-pink-deep)}
.page-marketing-site .mod-card h3{font-size:1.08rem}
.page-marketing-site .mod-card p{font-size:.92rem;color:var(--c-ink-soft);margin:0}

/* ---------- 价格提示 ---------- */
.page-marketing-site .price-note{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:26px}
