/* ============================================================
   ujoffshore.com · page-index.css —— 首页页面级样式（种子基准）
   body.page-index 作用域；体现「页面级差异化」写法
   ============================================================ */

/* ---------- Hero 全屏 ---------- */
.page-index .hero-home{
  position:relative;min-height:calc(100vh - 40px);display:flex;align-items:center;
  overflow:hidden;isolation:isolate;background:var(--c-cream-wash);
}
.page-index .hero-home .hero-bg{position:absolute;inset:0;z-index:-2}
.page-index .hero-home .hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
.page-index .hero-home::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,rgba(251,245,236,.94) 0%,rgba(251,239,241,.72) 46%,rgba(251,239,241,.18) 78%);
}
.page-index .hero-inner{max-width:720px;padding-block:clamp(60px,9vw,120px)}
.page-index .hero-kicker{display:inline-flex;align-items:center;gap:8px;font-size:.9rem;letter-spacing:.24em;color:var(--c-accent);font-weight:600}
.page-index .hero-kicker::before{content:"";width:34px;height:2px;background:var(--c-pink)}
.page-index .hero-title{
  font-size:clamp(2.1rem,5vw,3.5rem);line-height:1.22;margin:18px 0 6px;
}
.page-index .hero-title .line{display:block;overflow:hidden}
.page-index .hero-title .line span{display:inline-block;animation:riseUp .8s var(--ease) both}
.page-index .hero-title .line:nth-child(2) span{animation-delay:.18s}
.page-index .hero-title .line:nth-child(3) span{animation-delay:.36s}
.page-index .hero-title .hl{color:var(--c-pink-deep);position:relative}
.page-index .hero-title .hl svg{position:absolute;left:0;bottom:-10px;width:100%;height:12px}
@keyframes riseUp{from{transform:translateY(110%);opacity:0}to{transform:none;opacity:1}}
.page-index .hero-sub{font-size:clamp(1rem,1.6vw,1.15rem);color:var(--c-ink-soft);max-width:560px;animation:fadeIn .9s var(--ease) .5s both}
.page-index .hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px;animation:fadeIn .9s var(--ease) .7s both}
.page-index .hero-contact-line{margin-top:22px;display:flex;flex-wrap:wrap;gap:18px;font-size:.95rem;color:var(--c-ink-soft);animation:fadeIn .9s var(--ease) .85s both}
.page-index .hero-contact-line a{font-weight:700;color:var(--c-pink-deep)}
.page-index .hero-quick{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;animation:fadeIn .9s var(--ease) .95s both}
.page-index .hero-quick a{
  display:inline-flex;align-items:center;gap:8px;padding:.5em 1.1em;border-radius:var(--r-full);
  background:rgba(255,251,245,.85);border:1.5px solid var(--c-line);color:var(--c-ink-soft);
  font-size:.9rem;font-weight:600;transition:all .25s var(--ease);
}
.page-index .hero-quick a:hover{border-color:var(--c-pink);color:var(--c-pink-deep);transform:translateY(-2px)}
.page-index .hero-doodle{position:absolute;right:8%;bottom:16%;animation:floatY 6s ease-in-out infinite}
.page-index .hero-doodle.d2{right:18%;bottom:38%;animation-delay:1.2s}
.page-index .hero-scroll{
  position:absolute;left:50%;bottom:26px;transform:translateX(-50%);
  font-size:.8rem;letter-spacing:.3em;color:var(--c-ink-faint);text-align:center;
}
.page-index .hero-scroll::after{content:"";display:block;width:1.5px;height:34px;margin:8px auto 0;background:var(--c-pink);animation:pulse 2s ease-in-out infinite}

/* ---------- 优势板块：手账贴纸卡 ---------- */
.page-index .adv-grid{display:grid;grid-template-columns:1fr;gap:22px}
@media (min-width:640px){.page-index .adv-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.page-index .adv-grid{grid-template-columns:repeat(3,1fr)}}
.page-index .adv-card{
  position:relative;background:var(--c-white);border-radius:var(--r-lg);padding:30px 26px;
  box-shadow:var(--sh-1);border:1px solid var(--c-line-soft);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.page-index .adv-card:hover{transform:translateY(-6px) rotate(-.4deg);box-shadow:var(--sh-2)}
.page-index .adv-card .adv-num{
  position:absolute;top:-14px;left:22px;width:44px;height:44px;border-radius:50%;
  background:var(--c-pink-wash);border:2px solid var(--c-pink-soft);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--f-serif);font-weight:700;color:var(--c-pink-deep);font-size:1.05rem;
}
.page-index .adv-card h3{font-size:1.15rem;margin:12px 0 .35em}
.page-index .adv-card p{font-size:.94rem;color:var(--c-ink-soft);margin:0}

/* ---------- 服务入口：图片卡 ---------- */
.page-index .svc-card{position:relative;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-2);background:var(--c-white)}
.page-index .svc-card .sc-img{aspect-ratio:16/10;overflow:hidden}
.page-index .svc-card .sc-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.page-index .svc-card:hover .sc-img img{transform:scale(1.06)}
.page-index .svc-card .sc-body{padding:20px 22px 24px}
.page-index .svc-card h3{font-size:1.12rem;margin-bottom:.3em}
.page-index .svc-card p{font-size:.9rem;color:var(--c-ink-soft);margin:0 0 14px}
.page-index .svc-card .sc-more{font-weight:700;font-size:.9rem;display:inline-flex;align-items:center;gap:6px}
.page-index .svc-card .sc-more::after{content:"→";transition:transform .25s var(--ease)}
.page-index .svc-card:hover .sc-more::after{transform:translateX(4px)}

/* ---------- 数据带 ---------- */
.page-index .stats-band{position:relative;overflow:hidden}
.page-index .stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
@media (min-width:900px){.page-index .stats-grid{grid-template-columns:repeat(4,1fr)}}
.page-index .stats-grid .stat-num{color:#FFE3E5}
.page-index .stats-grid .stat-label{color:rgba(255,246,234,.85)}

/* ---------- 行业入口：手绘小圆卡 ---------- */
.page-index .ind-chips{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.page-index .ind-chips a{
  display:inline-flex;align-items:center;gap:8px;padding:.6em 1.2em;
  background:var(--c-white);border:1.5px solid var(--c-line);border-radius:var(--r-full);
  color:var(--c-ink-soft);font-weight:600;font-size:.93rem;transition:all .25s var(--ease);
}
.page-index .ind-chips a::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--c-pink-soft)}
.page-index .ind-chips a:hover{transform:translateY(-3px);border-color:var(--c-pink);color:var(--c-pink-deep);box-shadow:var(--sh-1)}

/* ---------- 资讯区（CMS 标签承载） ---------- */
.page-index .news-lot{display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width:640px){.page-index .news-lot{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.page-index .news-lot{grid-template-columns:repeat(3,1fr)}}
.page-index .news-lot + .news-lot{margin-top:26px}
.page-index .news-lot .news-card{position:relative;display:block;background:var(--c-white);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--sh-1);border:1px solid var(--c-line-soft);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.page-index .news-lot .news-card:hover{transform:translateY(-5px);box-shadow:var(--sh-2)}
.page-index .news-lot .news-card img{width:100%;aspect-ratio:4/3;object-fit:cover}
.page-index .news-lot .news-card .nc-body{padding:16px 18px}
.page-index .news-lot .news-card h3{font-size:1rem;margin:.3em 0 .35em}
.page-index .news-lot .news-card p{font-size:.88rem;color:var(--c-ink-soft);margin:0}
.page-index .news-lot .news-card .nc-meta{font-size:.78rem;color:var(--c-ink-faint);letter-spacing:.06em}

/* ---------- 首屏窄屏 ---------- */
@media (max-width:720px){
  .page-index .hero-home{min-height:calc(100vh - 72px)}
  .page-index .hero-doodle{display:none}
}

/* 资讯区「查看全部」按钮定位（替代原内联样式） */
.news-more-btn{margin-top:18px}


/* CMS 引擎指令行（<%set/%foreach%>）本地预览隐藏，服务端渲染不受影响 */
.cms-tpl{display:none}
