/* =========================================================
 * APRIL AMC — Home page sections
 * ========================================================= */

/* ===== Hero ===== */
.hero {
  position: relative;
  height: 733px;
  color: #fff;
  overflow: hidden;
}
.hero-bg {
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width: 100%;        /* 不设上限：宽屏下背景图满屏端到端展示（与关于页一致） */
  height: 733px;      /* 固定高度，与 .hero 一致 */
  background: url('../../images/bgimecn.png') center center/cover no-repeat;
  background-attachment: fixed;  /* 背景固定，滚动时图片不动 */
}
.hero-inner { position: relative; z-index: 1; max-width: 900px; padding-top: 249px; }
.hero-title {
  font-size: var(--fs-h1);
  font-weight: 200;
  line-height: 1.25;
  letter-spacing: 1.56px;
  margin-bottom: 20px;
  text-transform: uppercase;
}
.hero-sub {
  font-size: var(--fs-sub);
  line-height: 1.25;
  color: #FFFFFF;
  letter-spacing: 0.44px;
  margin-bottom: 136px;
  max-width: 831px;
  font-weight: 200;
}
.hero-actions { display: flex; gap: 20px; }  /* 原型：两按钮间距 20px */

/* ===== Framework (左图右文) ===== */
/* 原型：白底区 y=998→1594，高 596px；图 x=280 y=1058 318×476；标题 y=1050 */
.framework {
  background: var(--paper-0);
  padding: 52px 0 60px;  /* 52(标题) + 484(图列 8+476) + 60(图底→区块底) = 596 */
}
.framework .container { padding: 0 280px; }  /* 原型：内容区 280→1152，非 116 通栏 */
.framework-grid {
  display: grid;
  grid-template-columns: 318px 1fr;
  gap: 50px;  /* 原型：图右缘 598 → 标题 648 */
  align-items: start;
}
.framework-img {
  width: 318px; height: 476px;
  margin-top: 8px;  /* 原型：标题顶 1050，图顶 1058 */
  border-radius: 20px;
  overflow: hidden;
  background: var(--placeholder);
}
.framework-img img { width: 100%; height: 100%; object-fit: cover; }
.framework-text .eyebrow {
  font-size: 13px;
  letter-spacing: 1.28px;
  color: var(--brand);
  margin-bottom: 16px;
  text-transform: uppercase;
}
.framework-text h3 {
  font-size: var(--fs-h2);
  font-weight: 200;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 52px;  /* 原型：标题底 1140 → 正文 1192 */
  line-height: 1.25;
  color: #000;
}
.framework-text .desc {
  color: #000;  /* 原型正文为纯黑 */
  font-size: 14px;
  line-height: 1.29;  /* 原型：h=90 / 5 行 = 18px */
  letter-spacing: 0.39px;
  font-weight: 200;
  text-align: justify;  /* 原型：两端对齐 */
  margin-bottom: 72px;  /* 原型：正文底 1282 → 首条分隔线 1354 */
  max-width: 500px;
}
.framework-list { list-style: none; }
.framework-list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  line-height: 18px;  /* 原型：行高 18px */
  padding: 17px 0;    /* 1+17+18+17 = 53px 行距（原型分隔线 1354→1407→1460） */
  border-top: 1px solid var(--line);
  font-size: 14px;
  letter-spacing: 0.39px;
  text-transform: uppercase;
  color: var(--brand);  /* 原型：#D26831 */
  font-weight: 200;
}
.framework-list li:last-child { padding-bottom: 0; }  /* 原型：末行文字贴底，无下边线 */
.framework-list li > a { display: block; flex: 1; color: inherit; }

/* ===== Framework 中文版还原（原型画板1） =====
 * 标题 40px/56 行高，顶距 60px（标题与图顶同为 1058，无 8px 偏移）
 * 标题底 1170 → 正文 1205 = 35px；正文 3 行×20px；正文底 1265 → 首线 1354 = 89px */
html[lang="zh"] .framework { padding: 60px 0 60px; }
html[lang="zh"] .framework-img { margin-top: 0; }
html[lang="zh"] .framework-text h3 {
  font-size: 40px;
  line-height: 56px;
  letter-spacing: 1.11px;
  margin-bottom: 35px;
}
html[lang="zh"] .framework-text .desc {
  line-height: 20px;
  letter-spacing: 0.39px;
  margin-bottom: 89px;
}

/* ===== Solutions 中文版（原型画板1：区 1596→2160） =====
 * 标题 40px 高 40；副标题单行；副标题底 1747 → 卡片 1808 = 61px */
html[lang="zh"] .solutions { padding: 77px 0 100px; }
html[lang="zh"] .solutions .section-title {
  font-size: 40px;
  line-height: 40px;
  letter-spacing: 1.11px;
}
html[lang="zh"] .solutions .section-sub { margin-bottom: 61px; }
/* 顶部短粗指示线 + 文字直接变黑 + 箭头柔光（变体 B） */
.framework-list li { position: relative; transition: color .35s ease; }
.framework-list li::before {
  content: '';
  position: absolute;
  top: -1px; left: 0;
  width: 36px; height: 2px;
  background: var(--brand);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s cubic-bezier(.2,.8,.2,1);
}
.framework-list li::after {
  content: '';
  display: block;
  width: 24px;
  height: 24px;
  flex: none;
  margin-left: 16px;
  background: url('../../images/arrow-narrow-left-dashed.svg') center/contain no-repeat;
  transition: transform .3s ease, filter .35s ease;
}
.framework-list li:hover { cursor: pointer; color: #141414; }
.framework-list li:hover::before { transform: scaleX(1); }  /* 顶部指示线展开 */
.framework-list li:hover::after  { transform: translateX(6px); filter: drop-shadow(0 0 4px rgba(210,104,49,.4)); }  /* 箭头右滑 + 柔光 */

/* ===== Solutions (3 卡片：图+渐变叠层+标签+白按钮浮在图上) ===== */
.solutions {
  background: var(--paper-1);
  padding: 78px 0 100px;  /* 原型：标题 1672-1594=78；卡片底 2058→区块底 2158=100 */
  text-align: center;
}
.solutions .section-title {
  margin-bottom: 16px;
  line-height: 1.25;  /* 原型：36px×1.25=45px 高 */
}
.solutions .section-sub {
  line-height: 18px;  /* 原型：14px 字，行高 18px */
  margin: 16px auto 39px;  /* 原型：副标题底 1769 → 卡片 1808 */
}
.solutions-grid {
  display: grid;
  grid-template-columns: repeat(3, 284px);
  gap: 31px;
  justify-content: center;
}
.solution-card {
  position: relative;
  width: 284px;
  height: 250px;
  border-radius: 16px;
  overflow: hidden;
  background: var(--placeholder);
}
.solution-card img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .5s;
}
.solution-card:hover img { transform: scale(1.05); }
.solution-card .gradient {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 42%, #18191A 91%);
  z-index: 1;
}
.solution-card .label {
  position: absolute;
  left: 0; right: 0;
  bottom: 57px;  /* 原型：label 底 2001 → 卡底 2058 = 57px */
  z-index: 2;
  color: #fff;
  font-size: 13.2px;
  line-height: 16px;
  letter-spacing: 0.37px;
  text-transform: uppercase;
  text-align: center;
}
.solution-card .more {
  position: absolute;
  left: 50%;
  bottom: 20px;  /* 原型：按钮 2010+28=2038 → 卡底 2058 = 20px */
  transform: translateX(-50%);
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 28px;  /* 原型 127×28 */
  padding: 0 15px;
  background: transparent;  /* 原型：透明底、白边框、白字 */
  border: 0.77px solid #fff;
  color: #fff;
  font-size: 11px;
  letter-spacing: 0.31px;
  border-radius: 19.64px;
  text-transform: uppercase;
  transition: background .2s;
  white-space: nowrap;
}
html[lang="zh"] .solution-card .more { padding: 0 20px; }  /* 原型中文按钮 113×28 */
.solution-card .more .btn-arrow { width: 16px; height: 5px; }  /* 覆盖 .solution-card img 的 100% 拉伸 */
.solution-card .more:hover { background: rgba(255,255,255,.12); }

/* ===== Numbers (深色 4 数据) ===== */
.numbers {
  background: var(--ink-1);
  color: #fff;
  padding: 78px 0 100px;  /* 原型：区块 2158→2676，h=518 */
  text-align: center;
}
.numbers .section-title { margin-bottom: 15px; line-height: 45px; }  /* 原型：标题框高 45，标题底 2281 → 副标题 2296 */
.numbers .section-sub {
  color: rgba(255,255,255,.6);
  max-width: none;
  letter-spacing: 0.39px;
  line-height: 18px;
  margin: 0 0 80px;  /* 原型：副标题顶 2296，底 2332 → 顶线 2412 */
}
.numbers-rule {
  border: 0;
  border-top: 1px solid var(--ink-3);  /* 原型：#262626 */
  max-width: 935px;
  margin: 0 auto;
}
.numbers-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  max-width: 935px;
  margin: 0 auto;
  border-top: 1px solid var(--ink-3);    /* 原型：横线 2412，#262626 */
  border-bottom: 1px solid var(--ink-3); /* 原型：横线 2575 */
  padding: 32px 0 52px;                  /* 原型：两线间 164px */
}
.numbers-grid .stat + .stat { border-left: 1px solid var(--ink-3); }  /* 原型：3 条竖线 164px 高 */
.stat .value {
  font-size: 46px;  /* 原型 46px */
  font-weight: 500;  /* 原型 Product Sans Regular，Quicksand 500 视觉最接近 */
  line-height: 60px;  /* 原型数字框高 60 */
  color: #fff;
  letter-spacing: 1.28px;
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 4px;
}
.stat .value .unit {
  font-size: 14px;  /* 原型 14px */
  line-height: 18px;  /* 原型单位框高 18，避免基线对齐撑高容器 */
  color: var(--brand);  /* #D26831 */
  letter-spacing: 0.39px;
}
.stat .label {
  margin-top: 5px;  /* 原型：数字底 2505 → 标签 2510 */
  font-size: 10px;
  line-height: 13px;
  letter-spacing: 0.28px;
  color: rgba(255,255,255,.8);
}

/* ===== Insights (3 张高大白卡 370×528) ===== */
.insights {
  background: var(--paper-bg);  /* 原型页面背景 #F6F5F1 */
  padding: 110px 0 100px;  /* 原型：卡片底 3440 → steps 卡顶 3540 = 100px */
  text-align: center;
}
.insights .section-title { margin-bottom: 16px; }
.insights .section-sub { margin-bottom: 60px; max-width: none; }  /* 第二行需一行显示完 */
.insights-grid {
  display: grid;
  grid-template-columns: repeat(3, 370px);
  gap: 20px;
  justify-content: center;
}
.insight-card {
  width: 370px;
  height: 528px;
  background: var(--paper-0);
  border-radius: 20px;
  overflow: hidden;
  text-align: left;
  display: flex;
  flex-direction: column;
  box-shadow: none;  /* 默认无投影 */
  transition: transform .3s ease, box-shadow .3s ease;
}
/* hover：卡片整体上浮并出现投影 */
.insight-card:hover { transform: translateY(-6px); box-shadow: 0 8px 20px rgba(0,0,0,.10); }
.insight-card .thumb {
  width: 330px; height: 292px;
  margin: 20px 20px 0;
  border-radius: 16px;
  overflow: hidden;
  background: var(--placeholder);
}
.insight-card .thumb img { width: 100%; height: 100%; object-fit: cover; }
.insight-card .body {
  padding: 22px 24px 24px;  /* 原型：图底 3224 → 标题 3246 = 22px */
  display: flex;
  flex-direction: column;
  flex: 1;
}
.insight-card h4 {
  font-size: 18px;       /* 原型 18px */
  font-weight: 200;      /* 原型 Quicksand Light */
  letter-spacing: 0.5px; /* 原型 0.5px */
  text-transform: uppercase;
  margin-bottom: 15px;   /* 原型：标题底 3269 → 描述 3284 = 15px */
  color: #000;
}
.insight-card p {
  font-size: 12px;       /* 原型 12px */
  color: #888888;        /* 原型 #888 */
  letter-spacing: 0.33px;
  line-height: 15.5px;   /* 原型两行 31px */
}
.insight-card .arrow {
  width: 55px; height: 55px;
  border-radius: 50%;
  background: #F5F5F3;   /* 原型圆钮底色 */
  display: grid; place-items: center;
  margin: auto 7px 11px auto;  /* 右下角：距右 31、距底 35（含 body padding） */
}
.insight-card .arrow img { width: 28px; height: 28px; display: block; }

/* ===== Service Steps (白圆角大卡) ===== */
.steps {
  background: var(--paper-bg);  /* 原型页面背景 #F6F5F1 */
  padding: 0 0 100px;  /* 与上方模块的 100px 间距由 .insights 底 padding 提供 */
}
.steps-card {
  background: var(--paper-0);
  border: none;
  border-radius: 20px;  /* 原型 radius 20，无阴影 */
  padding: 80px 104px 60px 82px;  /* 原型：标题距左 82 距顶 80，按钮距底 60，右栏距右 104 */
  display: grid;
  grid-template-columns: 1fr 505px;  /* 原型右栏宽 505 */
  align-items: center;
  max-width: 1150px;
  margin: 0 auto;
}
.steps-text h3 {
  font-size: var(--fs-h2);  /* 36px */
  font-weight: 200;
  letter-spacing: 1px;
  text-transform: none;
  line-height: 45px;  /* 原型两行 90px */
  margin-bottom: 15px;  /* 原型：标题底 3710 → 描述 3725 */
  color: #000;
}
.steps-text p {
  color: #888888;  /* 原型 #888 */
  font-size: 12px;
  letter-spacing: 0.33px;
  line-height: 15px;  /* 原型 4 行 60px */
  max-width: 295px;  /* 原型文本宽 295 */
  margin-bottom: 51px;  /* 原型：描述底 3785 → 按钮 3836 */
}
.steps-text .btn {
  min-width: 178px;  /* 原型按钮 178×48 */
  justify-content: center;
  padding: 0 26px;
  text-transform: uppercase;  /* 原型 BECOME A CLIENT */
  letter-spacing: 0.39px;
}
.steps-grid {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  row-gap: 82px;  /* 原型中文版：行1标签底 3703 → 行2图标顶 3785 */
}
.steps-grid::before {  /* 竖分隔线 #EEE，原型 y 3613.5–3883.5（上越 23 下越 31） */
  content: '';
  position: absolute;
  left: 50%; top: -23px; bottom: -31px;
  width: 1px;
  background: #EEEEEE;
}
.steps-grid::after {  /* 横分隔线 #EEE，原型 y=3742 在网格中线偏上 2px */
  content: '';
  position: absolute;
  top: calc(50% - 2px); left: 0; right: 0;
  height: 1px;
  background: #EEEEEE;
}
.step-item {
  display: flex;
  flex-direction: column;
  align-items: center;  /* 原型：图标与文字居中 */
  gap: 14px;  /* 用户要求：图标与文字间距调大 */
  text-align: center;
}
.step-item .icon {
  width: 57px; height: 43px;  /* 容器与 img 同宽，保证图形与文字水平居中 */
  display: flex; align-items: center; justify-content: center;
  flex: none;
}
.step-item .icon img { width: 57px; max-width: none; height: 57px; }  /* 原始尺寸（PNG 含留白，图形=原型 46×40 级别），覆盖全局 max-width:100% */
.step-item .name {
  font-size: 12px;  /* 原型 12px */
  letter-spacing: 0.33px;
  line-height: 15px;  /* 原型两行 30px */
  text-transform: uppercase;
  font-weight: 400;
  color: #888888;  /* 原型渲染为灰色（JSON 标注 #000 但视觉是灰） */
  max-width: 86px;  /* 原型：标签两行断行 */
  margin: 0 auto;
}

/* ===== CTA banner ===== */
.cta-banner {
  position: relative;
  height: 424px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  overflow: hidden;
}
.cta-banner .bg {
  position: absolute; inset: 0;
  background: url('../../images/cta-bg.png') center/cover no-repeat;
}
.cta-banner .bg-mask {
  position: absolute; inset: 0;
  background: none;  /* 用户要求：去掉蒙层背景色 */
  z-index: 1;
}
.cta-banner .inner {
  position: relative;
  z-index: 2;
}
.cta-banner .eyebrow {
  font-size: 16px;  /* 原型 16px */
  font-weight: 200;
  letter-spacing: 0.44px;
  line-height: 20px;
  color: #fff;
  margin-bottom: 12px;  /* 原型：副标题底 4146 → 标题 4158 */
}
.cta-banner h3 {
  font-size: 36px;  /* 原型 36px Quicksand Light */
  font-weight: 200;
  letter-spacing: 1px;
  line-height: 45px;
  margin-bottom: 94px;  /* 原型：标题底 4203 → 按钮 4297 */
}
.cta-banner .btn { min-width: 218px; gap: 8px; }  /* 原型按钮 218×48；文字右 784 → 箭头 792 */
.cta-banner .legal-row {
  margin-top: 21px;  /* 原型：按钮底 4345 → 链接 4366 */
  text-align: center;
  font-size: 14px;  /* 原型 14px */
  font-weight: 200;
  letter-spacing: 0.39px;  /* 英文版原型 ls 0.39；中文版 ls 6 由 :lang(zh) 覆盖 */
  line-height: 20px;
  color: rgba(255,255,255,.8);  /* 原型 80% 白 */
}
.cta-banner .legal-row a { color: inherit; }
.cta-banner .legal-row a:hover { color: var(--brand); }
.cta-banner .legal-row .sep { margin: 0 8px; }  /* 英文版 sep 两侧 8px；中文版 sep 由 :lang(zh) 覆盖 */
:lang(zh) .cta-banner .legal-row { letter-spacing: 6px; }  /* 中文版原型：ls 6px */
:lang(zh) .cta-banner .legal-row .sep { margin: 0; }  /* 中文版用 · + 6px 字距，sep 不再加边距 */

/* ===== Responsive ===== */
@media (max-width: 960px) {
  .hero { height: 600px; }
  .hero-inner { max-width: 100%; padding-top: 160px; }
  .hero-sub { margin-bottom: 60px; }
  .framework .container { padding: 0 40px; }
  .framework-grid { grid-template-columns: 1fr; gap: 40px; }
  .framework-img { width: 100%; max-width: 318px; height: auto; aspect-ratio: 318/476; margin: 0 auto; }
  .solutions-grid, .insights-grid { grid-template-columns: 1fr; gap: 24px; justify-content: center; }
  .solution-card, .insight-card { width: 100%; max-width: 370px; margin: 0 auto; }
  .numbers-grid { grid-template-columns: repeat(2, 1fr); row-gap: 40px; }
  .numbers-grid .stat + .stat { border-left: 0; }  /* 移动端去掉竖线 */
  .steps-card { grid-template-columns: 1fr; padding: 40px; gap: 40px; }
}

/* ===== 中文原型覆盖（依据 #s1） ===== */
:lang(zh) .hero-inner { padding-top: 267px; }      /* 中文标题顶 y=267 */
:lang(zh) .hero-title { margin-bottom: 30px; }     /* 中文标题→副标题 30px */
:lang(zh) .steps-text h3 { line-height: 50px; margin-bottom: 57px; }  /* 中文单行标题 h=50；标题底 3674 → 副文 3731 */
:lang(zh) .step-item .name { line-height: 17px; }  /* 原型标签 h=17 */
:lang(zh) .hero-sub { margin-bottom: 204px; }      /* 中文副标题→按钮 204px */