/* MIZUKIN 弥滋Kin 页面样式
   设计稿 1024 x 1536，等比放大到 1440（比例 1.40625）
   所有数值均由设计图像素测量得出（v3 精校） */

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  background: #fff;
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Heiti SC", sans-serif;
  -webkit-font-smoothing: antialiased;
}

.page { width: 1440px; margin: 0 auto; position: relative; }

/* ============ 顶部导航 ============
   已改为全站统一组件：css/nav.css（在 mizukin.html 中于本文件之后引入）
   原设计稿的 65px 导航条（4 项、无 logo）已被统一导航条取代。
   以下主视觉等区块按「相对各自 section 定位」，导航变高后整块下移，内部布局不变。 */

/* ============ 主视觉 (设计 y 47~390 → 65~547) ============ */
.hero { position: relative; height: 482px; overflow: hidden; }
.hero-img { position: absolute; left: 0; top: 0; width: 1440px; height: 482px; display: block; }

.hero-title {                                  /* 设计墨迹 191.6,191.2,379.7,96 */
  position: absolute; left: 187px; top: 124px;
  font-size: 103px; line-height: 1; letter-spacing: 7.2px;
  color: #cd5671; font-weight: 400; white-space: nowrap;
}
.hero-en {                                     /* 设计墨迹 305.2,311.1,130.8,19 */
  position: absolute; left: 304px; top: 244px;
  font-size: 24px; line-height: 1; letter-spacing: 5.8px;
  color: #b49481; white-space: nowrap;
}
.hero-slog {                                   /* 设计墨迹 215.5,359.3,330.5,28.1 */
  position: absolute; left: 214px; top: 294px;
  font-size: 29px; line-height: 1; letter-spacing: 6.3px;
  color: #8d5661; white-space: nowrap;
}
.hero-body {                                   /* 设计墨迹 215.5,421.9,349.1,87.5 行距33 */
  position: absolute; left: 215px; top: 352px;
  font-size: 23px; line-height: 33px;
  color: #827e77; white-space: nowrap;
}

/* ============ 品牌理念 (设计 y 390~620 → 547~871) ============ */
.care { position: relative; height: 324px; background: #fdfdfd; }
.care-img { position: absolute; left: 613px; top: 3px; width: 827px; height: 321px; display: block; }

.care-h {                                      /* 设计墨迹 87.5,606.0,362.8,37.3 */
  position: absolute; left: 86px; top: 58px;
  font-size: 40px; line-height: 1; letter-spacing: 0.8px; font-weight: 400;
  color: #864a57; white-space: nowrap;
}
.care-body {                                   /* 设计墨迹 86.1,706.8,512.9,135.6 行距38.2 */
  position: absolute; left: 85px; top: 153px;
  font-size: 24px; line-height: 38px;
  color: #7f7e7f; white-space: nowrap;
}

/* ============ 产品系列 (设计 y 620~990 → 871~1391) ============ */
.prods { position: relative; height: 520px; background: #f8f7f5; }
.prod-h {                                      /* 设计墨迹 86.5,923.7,153.6,36.3 */
  position: absolute; left: 86px; top: 53px;
  font-size: 38px; line-height: 1; letter-spacing: 1.8px; font-weight: 400;
  color: #864c58; white-space: nowrap;
}
.prod-sub {                                    /* 设计墨迹 86.1,990.0,555.1,21.8 */
  position: absolute; left: 85px; top: 119px;
  font-size: 23.8px; line-height: 1;
  color: #7f7d7b; white-space: nowrap;
}

.cards { position: absolute; left: 0; top: 165px; width: 1440px; height: 325px; }
.card {
  position: absolute; top: 0; width: 318px; height: 325px;
  background: #fffdfc; overflow: hidden;
}
.card.c1 { left: 53px; }
.card.c2 { left: 395px; }
.card.c3 { left: 737px; }
.card.c4 { left: 1077px; }
.card-photo { display: block; width: 318px; height: 201px; }
.card-t {                                      /* 设计墨迹 164.8,1260.0,61.2,20.0 */
  position: absolute; left: 110px; top: 224px;
  font-size: 20px; line-height: 1; letter-spacing: 2px; font-weight: 400;
  color: #8c6b71; white-space: nowrap;
}
.card-d {                                      /* 设计墨迹 164.5,1297.3,137.8,39.8 行距25 */
  position: absolute; left: 110px; top: 258px;
  font-size: 17px; line-height: 25px; letter-spacing: -0.5px;
  color: #ada1a4; white-space: nowrap;
}
.card.c3 .card-t, .card.c3 .card-d { left: 101px; }  /* 设计墨迹 x837.7 / 838.1 */
.card.c4 .card-t, .card.c4 .card-d { left: 106px; }  /* 设计墨迹 x1183.7 / 1185.4 */

/* ============ 陪伴每个阶段 (设计 y 990~1204 → 1391~1693) ============ */
.stage { position: relative; height: 302px; background: #fdfdfd; }
.stage-img { position: absolute; left: 619px; top: 1px; width: 821px; height: 300px; display: block; }

.stage-h {                                     /* 设计墨迹 87.2,1456.4,514.7,36.3 */
  position: absolute; left: 86px; top: 66px;
  font-size: 38px; line-height: 1; letter-spacing: 1.6px; font-weight: 400;
  color: #864c59; white-space: nowrap;
}
.stage-body {                                  /* 设计墨迹 86.9,1543.7,537.5,95.9 行距38.6 */
  position: absolute; left: 86px; top: 146px;
  font-size: 24px; line-height: 39px;
  color: #7f7e7f; white-space: nowrap;
}

/* ============ 前往官方店铺 (设计 y 1204~1400 → 1693~1969) ============ */
.cta { position: relative; height: 276px; background: #fdeeee; }
.cta-img { position: absolute; left: 619px; top: 0; width: 821px; height: 276px; display: block; }

.cta-h {                                       /* 设计墨迹 180.7,1733.6,446.5,36.8 */
  position: absolute; left: 179px; top: 41px;
  font-size: 38px; line-height: 1; letter-spacing: 1px; font-weight: 400;
  color: #904c5b; white-space: nowrap;
}
.cta-sub {                                     /* 设计墨迹 181.4,1797.2,566.7,22.2 */
  position: absolute; left: 181px; top: 105px;
  font-size: 25.5px; line-height: 1;
  color: #817472; white-space: nowrap;
  z-index: 2;
}
.cta-btn {                                     /* 填充设计 267.4,1851.7,259.8,68.6 */
  position: absolute; left: 267px; top: 158px;
  width: 260px; height: 69px;
  border-radius: 34.5px;
  background: #c8475c;
  color: #ffeeef;
  font-size: 24px; line-height: 69px; text-align: center;
  text-decoration: none; letter-spacing: 3.4px;
  white-space: nowrap;
}
.cta-btn:hover { background: #b93f52; }

/* ============ 页脚 (设计 y 1400~1536 → 1969~2160) ============
   实测：页脚文字为「比背景更亮」的浅色（近白），非深色 */
.footer { position: relative; height: 191px; background: #ba505c; }

.foot-mark {                                   /* logo 上方标记 设计 x95..155,y1400..1430 */
  position: absolute; left: 134px; top: 0;
  width: 84px; height: 42px; display: block;
}
.foot-logo {                                   /* 设计墨迹 95.6,2007.9,160.3,42.3 */
  position: absolute; left: 92px; top: 38px;
  font-size: 46px; line-height: 1;
  color: #ffffff; white-space: nowrap;
}
.foot-en {                                     /* 设计墨迹 139.2,2050.3,75.9,15.5 */
  position: absolute; left: 138px; top: 82px;
  font-size: 18.5px; line-height: 1; letter-spacing: 0;
  color: #ffffff; white-space: nowrap;
}
.foot-menu a {                                 /* 设计墨迹 y2022.2 */
  position: absolute; top: 54px;
  font-size: 18px; line-height: 1;
  color: #ffffff; text-decoration: none; white-space: nowrap;
}
.foot-menu a:nth-child(1) { left: 507px; }     /* 首页     x507.7 */
.foot-menu a:nth-child(2) { left: 602px; }     /* PETRO    x603.3 */
.foot-menu a:nth-child(3) { left: 723px; }     /* 弥滋Kin  x724.2 */
.foot-menu a:nth-child(4) { left: 848px; }     /* 关于我们 x849.4 */
.foot-icons {                                  /* 设计墨迹 1267.0,2018.0,98.4,28.1 */
  position: absolute; left: 1267px; top: 49px;
  width: 98px; height: 28px; display: block;
}
.foot-rule {                                   /* 分隔亮线 设计 y1482..1484, x48..976 */
  position: absolute; left: 68px; top: 115px;
  width: 1305px; height: 3px;
  background: #e08a92;
}
.foot-copy {                                   /* 设计墨迹 572,2106,292,19 */
  position: absolute; left: 572px; top: 138px;
  font-size: 17px; line-height: 1; letter-spacing: 0;
  color: #ffffff; white-space: nowrap;
}

.foot-beian {                                   /* 合规要求：备案号展示 */
  position: absolute; left: 0; top: 165px; width: 1440px;
  text-align: center; font-size: 13px; line-height: 1; color: #e9a7b1;
}