/* =====================================================
   PETRO 品牌页样式
   设计稿 1024×1536 → 1440 宽（比例 1.40625）
   所有数值均由设计图像素测量得出
   顶部导航使用全站统一组件 css/nav.css
   ===================================================== */

* { 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; }

a { text-decoration: none; }

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

.hero-title {                                   /* 设计墨迹 139,168,396,235 */
  position: absolute; left: 187px; top: 151px;
  font-size: 128px; line-height: 1; font-weight: 800;
  letter-spacing: -15px; color: #2a1609; white-space: nowrap;
}
.hero-slog {                                    /* 设计墨迹 172,253,359,272 */
  position: absolute; left: 240px; top: 290px;
  font-size: 33px; line-height: 1; font-weight: 600;
  color: #190e09; white-space: nowrap;
}
.hero-body {                                    /* 设计墨迹 125,299,393,341 */
  position: absolute; left: 177px; top: 347px;
  font-size: 23px; line-height: 38px; color: #302a24; white-space: nowrap;
}

/* ============ 与爱宠共度美好时光 (设计 y390~753 → h510) ============ */
.about { position: relative; height: 510px; background: #fff; }
.about-fade { position: absolute; left: 0; top: 472px; width: 1440px; height: 38px; background: #f9efe5; }
.about-img { position: absolute; left: 619px; top: 20px; width: 821px; height: 465px; z-index: 1; }

.about-h {                                      /* 设计墨迹 57,443,408,485 */
  position: absolute; left: 78px; top: 74px;
  font-size: 55px; line-height: 1; font-weight: 600;
  color: #211109; white-space: nowrap;
}
.about-bar {                                    /* 设计 59,496,102,500 */
  position: absolute; left: 83px; top: 149px; width: 61px; height: 6px; background: #9b4e26;
}
.about-body {                                   /* 设计墨迹 60,529,430,605 */
  position: absolute; left: 83px; top: 187px;
  font-size: 24px; line-height: 42px; letter-spacing: .7px; color: #262525; white-space: nowrap;
}

/* 三个特性（图标 + 标题 + 描述） */
.feat-ico { position: absolute; width: 62px; height: 53px; z-index: 2; }
.fi1 { left: 79px;  top: 368px; }
.fi2 { left: 321px; top: 368px; }
.fi3 { left: 592px; top: 368px; width: 63px; }

.feat-t { position: absolute; top: 376px; z-index: 2; font-size: 21px; line-height: 1; font-weight: 600; color: #14100d; white-space: nowrap; }
.ft1 { left: 151px; }
.ft2 { left: 395px; }
.ft3 { left: 666px; }

.feat-s { position: absolute; top: 411px; z-index: 2; font-size: 16px; line-height: 1; color: #63605f; white-space: nowrap; }
.fs1 { left: 151px; }
.fs2 { left: 396px; }
.fs3 { left: 668px; }

/* ============ 产品系列 (设计 y753~1112 → h505) ============ */
.prods { position: relative; height: 505px; background: #f7f6f4; }

.prod-h {                                       /* 设计墨迹 60,781,195,817 */
  position: absolute; left: 85px; top: 39px;
  font-size: 48px; line-height: 1; font-weight: 600;
  color: #22140d; white-space: nowrap;
}
.prod-bar {                                     /* 设计 60,823,100,828 */
  position: absolute; left: 84px; top: 100px; width: 57px; height: 6px; background: #a34f28;
}
.prod-sub {                                     /* 设计墨迹 61,836,364,854 */
  position: absolute; left: 85px; top: 119px;
  font-size: 24px; line-height: 1; letter-spacing: .5px; color: #41403d; white-space: nowrap;
}

.cards { position: absolute; left: 0; top: 170px; width: 1440px; height: 304px; }
.card { position: absolute; top: 0; width: 315px; height: 304px; background: #fff; }
.card:nth-child(1) { left: 53px; }
.card:nth-child(2) { left: 394px; }
.card:nth-child(3) { left: 734px; }
.card:nth-child(4) { left: 1074px; }

.card-photo { width: 315px; height: 208px; }
.card-ico { position: absolute; left: 53px; top: 231px; width: 37px; height: 51px; }
.card-t {                                       /* 设计墨迹 115,1040,174,1054 */
  position: absolute; left: 109px; top: 234px;
  font-size: 21px; line-height: 1; font-weight: 600; color: #1d1412; white-space: nowrap;
}
.card-d {                                       /* 设计墨迹 115,1064,211,1075 */
  position: absolute; left: 109px; top: 268px;
  font-size: 16px; line-height: 1; color: #6e6e6f; white-space: nowrap;
}
.card-btn {                                     /* 设计圆钮 231,1045,253,1066 */
  position: absolute; left: 272px; top: 241px; width: 31px; height: 31px;
  border-radius: 50%; background: #9b481a; color: #fff;
  font-size: 20px; line-height: 31px; text-align: center;
}
.card-btn:hover { opacity: .88; }

/* ============ 前往淘宝店 (设计 y1112~1370 → h363，米色块 y1136 起) ============ */
.cta { position: relative; height: 363px; background: #fff; }
.cta-inner { position: absolute; left: 0; top: 34px; width: 1440px; height: 329px; background: #faf0e6; }
.cta-img { position: absolute; left: 675px; top: 0; width: 765px; height: 329px; }

.cta-h {                                        /* 设计墨迹 128,1169,440,1196 */
  position: absolute; left: 180px; top: 47px;
  font-size: 40px; line-height: 1; font-weight: 600;
  color: #211109; white-space: nowrap;
}
.cta-sub {                                      /* 设计墨迹 129,1214,438,1232 */
  position: absolute; left: 181px; top: 112px;
  font-size: 24px; line-height: 1; letter-spacing: 1px; color: #51483d; white-space: nowrap;
}
.cta-btn {                                      /* 设计按钮 193,1256,378,1308 */
  position: absolute; left: 272px; top: 170px; width: 260px; height: 73px;
  border-radius: 37px; background: #a84f19; color: #fdf0dd;
  font-size: 27px; line-height: 77px; text-align: center; letter-spacing: 0;
}
.cta-btn:hover { opacity: .9; }

/* ============ 页脚 (设计 y1370~1536 → h233) ============ */
.footer { position: relative; height: 233px; background: #392315; }
.foot-logo { position: absolute; left: 78px; top: 37px; width: 225px; height: 73px; }

.foot-menu a {
  position: absolute; top: 68px;
  font-size: 20px; line-height: 1; color: #f2e2d5; letter-spacing: .5px;
}
.foot-menu a:hover { color: #fff; }
.foot-menu a:nth-child(1) { left: 502px; }  /* 首页 */
.foot-menu a:nth-child(2) { left: 600px; }  /* PETRO */
.foot-menu a:nth-child(3) { left: 723px; }  /* 喜滋Kin */
.foot-menu a:nth-child(4) { left: 852px; }  /* 关于我们 */
.foot-menu a.on::after {
  content: '';
  position: absolute; left: 14px; top: 31px;
  width: 34px; height: 4px; background: #8b4c21;
}

.foot-icons { position: absolute; left: 1256px; top: 53px; width: 122px; height: 45px; }
.foot-line { position: absolute; left: 90px; top: 136px; width: 1282px; height: 3px; background: #564032; }
.foot-copy {
  position: absolute; left: 0; top: 170px; width: 1440px;
  text-align: center; font-size: 17.8px; line-height: 1; color: #bca698; letter-spacing: .2px;
}

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