/* ==========================================================
   麒麟港生活 - 顶尖教育页（education.html）专属样式
   依赖：style.css（变量/基础） + common.css（公共头部/尾部）
   ========================================================== */

.container-wide { width: 90%; max-width: 1420px; margin: 0 auto; }

/* 通用板块标题：英文 Times + 小副标题 */
.edu-head { text-align: center; }
.edu-head h2 {
  font-family: var(--title-font);
  font-size: 40px; font-weight: 400; letter-spacing: 1px;
  line-height: 1.5;
  color: var(--navy);
}
.edu-head p { margin-top: 0; font-size: 14px; letter-spacing: 3px; color: #6b7a93; }
.edu-head.light h2 { color: #fff; }
.edu-head.light p { color: rgba(255,255,255,.72); }

.edu-head.light h2.st1 { color: #48443b; }
.edu-head.light p.st2 { color:#48443b }

/* ======================= Banner ======================= */
.edu-banner {
  padding-top: 88px;
  min-height: 640px;
  display: flex; align-items: center;
  text-align: center;
  background: url("../images/sub/education/bg1.jpg") top center / 100% 100% no-repeat;
    /* radial-gradient(ellipse 52% 62% at 50% 46%, rgba(53,70,105,.6) 0%, rgba(17,36,67,0) 72%),
    var(--navy); */
}
.edu-banner .container { width: 100%; }
.eb-tag {
  display: flex; align-items: center; justify-content: center; gap: 18px;
  font-family: var(--title-font);
  font-size: 15px; letter-spacing: 5px; color: #49423a;
}
.eb-tag i { display: block; width: 64px; height: 1px; background: #49423a; }
.edu-banner h1 {
  margin-top: 26px;
  font-family: "Times New Roman", "STSong", "SimSun", "NSimSun", var(--cn-font);
  font-size: 46px; font-weight: 700; letter-spacing: 3px;
  color: #49423a;
  text-shadow: 0.06px 0 0 #49423a, -0.06px 0 0 #49423a;
}
.eb-sub { margin-top: 20px; font-size: 16px; letter-spacing: 2px; color: #49423a; }
.eb-btns { margin-top: 52px; display: flex; justify-content: center; gap: 26px; }
.eb-btn {
  display: inline-block; padding: 15px 46px;
  border-radius: 10px; font-size: 17px; letter-spacing: 3px;
  transition: all .3s ease;
}
.eb-btn.solid {
  background: linear-gradient(100deg, #c2a174, #e8ce91 55%, #c2a174);
  color: #1d2f52; 
  box-shadow: 0 8px 12px rgba(0,0,0,.08);
}
.eb-btn.solid:hover { filter: brightness(1.1); transform: translateY(-2px); }
.eb-btn.ghost { border: 1px solid var(--gold); color: #a07737; }
.eb-btn.ghost:hover { background: var(--gold); color: #ffff; }

/* ======================= P1：Who We Are ======================= */
.edu-who { background: #fff; padding: 72px 0 82px; }
.who-body { display: flex; gap: 90px; align-items: flex-start; margin-top: 56px; }
.who-left { width: 38%; flex: none; }
.who-left .quote {
  display: block; height: 66px; overflow: hidden;
  font-family: var(--title-font); font-weight: 700;
  font-size: 120px; line-height: 1; color: var(--gold);
}
.who-left h3 {
  margin-top: 22px;
  /* 与英文标题 Who We Are（Times New Roman 衬线）观感一致：中文回退宋体系 */
  font-family: "Times New Roman", "STSong", "SimSun", "NSimSun", var(--cn-font);
  font-size: 34px; font-weight: 600; line-height: 1.7; color: var(--navy);
}
.who-left .line { display: block; width: 92px; height: 4px; background: var(--gold); margin-top: 44px; }
.who-right { flex: 1; }
.who-right p {
  font-size: 15px; line-height: 1.95; color: #44526b;
  text-align: justify; margin-bottom: 22px;
}
.who-right p:last-child { margin-bottom: 0; }

/* ======================= P2：Our Journey（时间线 + 大背景图） ======================= */
.edu-journey {
  position: relative;
  background:  url("../images/sub/education/bg-journey.jpg") no-repeat center / cover;
  padding: 72px 0 88px;
}
.edu-journey::before {
  content: ""; position: absolute; inset: 0;
}
.edu-journey .container-wide { position: relative; z-index: 1; }

.tl { position: relative; margin-top: 56px; }
.tl-line {
  position: absolute; left: 50%; top: 6px; bottom: 6px;
  width: 2px; transform: translateX(-50%);
  background: #49423a;
}
.tl-item { position: relative; width: 50%; margin-bottom: 32px; }
.tl-item:last-child { margin-bottom: 0; }
.tl-item.left { padding-right: 42px; text-align: right; }
.tl-item.right { margin-left: 50%; padding-left: 42px; text-align: left; }
.tl-dot {
  position: absolute; top: 12px; z-index: 1;
  width: 10px; height:10px; border-radius: 50%; 
  background: #49423a; 
  box-shadow: 0 0 0 5px #49423a;
}
.tl-item.left .tl-dot { right: -5px; }
.tl-item.right .tl-dot { left: -5px; }
.tl-year {
  font-family: var(--title-font);
  font-size: 42px; line-height: 1; color: #49423a;
}
.tl-txt { margin-top: 8px; font-size: 15px; letter-spacing: 1px; color: #49423a; }

/* ======================= P3：Our Services（一张大图） ======================= */
.edu-services { background: #f9f8f3; padding: 72px 0 0; }
.sv-pic { margin-top: 50px; }
.sv-pic img { display: block; width: 100%; height: auto; }

/* ======================= P4：Educational Pathways ======================= */
.edu-path { background: #eee9e3; padding: 72px 0 82px; }
.path-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 30px; margin-top: 50px;
}
.p-card {
  display: flex; flex-direction: column;
  background: #fff; border-radius: 10px;
  padding: 44px 36px 48px;
}
.p-card h3 {
  font-size: 22px; font-weight: 600; color: var(--navy);
  padding-bottom: 20px; border-bottom: 1px solid #e3e6ec;
}
.p-q { margin-top: 26px; font-size: 20px; font-weight: 600; line-height: 1.55; color: var(--gold-deep); }
.p-desc { margin-top: 20px; flex: 1; font-size: 14px; line-height: 1.95; color: #5a6a85; }
.p-tags { margin-top: 20px; font-size: 13.5px; letter-spacing: 1px; color: var(--navy); }
.p-btn {
  margin-top: 32px; align-self: center;
  display: inline-block; padding: 12px 36px;
  background: linear-gradient(100deg, #b28e52, #d3b67a 55%, #c3a065);
  border-radius: 4px;
  font-size: 14.5px; letter-spacing: 1px; color: #1d2f52;
  transition: filter .3s;
}
.p-btn i { font-style: normal; display: inline-block; transition: transform .3s ease; }
/* 按钮 hover：箭头右移一下，移开缩回 */
.p-btn:hover { filter: brightness(1.08); }
.p-btn:hover i { transform: translateX(7px); }

/* ======================= P5：Success Stories  ======================= */
.edu-cases { background: #f9f8f3; padding: 72px 0 82px; }
.case { display: flex; gap: 70px; align-items: flex-start; margin-top: 56px; }
.case + .case { margin-top: 56px; }
.case-pic { width: 42%; flex: none; }
.case-pic img { display: block; width: 100%; height: auto; border-radius: 8px; }
.case-body { flex: 1; }
.case-body h3 { font-size: 26px; font-weight: 600; color: var(--navy); }
.case-q { margin-top: 12px; font-size: 19px; font-weight: 600; color: var(--gold-deep); }
.case-body dl { margin-top: 4px; }
.case-body dt { font-size: 15px; font-weight: 700; color: var(--navy); margin-bottom: 6px; }
.case-body dd { font-size: 14.5px; line-height: 1.8; color: #5a6a85; }

/* ==========================================================
   响应式
   ========================================================== */
@media (max-width: 992px) {
  .edu-banner { min-height: 520px; }
  .edu-banner h1 { font-size: 32px; letter-spacing: 2px; }
  .eb-sub { font-size: 14px; }
  .eb-btn { padding: 13px 34px; font-size: 15px; }

  .edu-head h2 { font-size: 32px; }

  .who-body { flex-direction: column; gap: 40px; margin-top: 38px; }
  .who-left { width: 100%; }
  .who-left h3 { font-size: 26px; }

  .path-grid { grid-template-columns: repeat(2, 1fr); gap: 22px; }

  .case { flex-direction: column; gap: 30px; margin-top: 44px; }
  .case-pic { width: 100%; }

  /* 时间线：单列靠左（需与 .tl-item.left/.right 同特异性覆盖，否则右对齐/内边距不生效） */
  .tl-line { left: 8px; transform: none; }
  .tl-item,
  .tl-item.left,
  .tl-item.right { width: 100%; margin-left: 0; padding: 0 0 0 48px; text-align: left; }
  .tl-item.left .tl-dot,
  .tl-item.right .tl-dot { left: 1px; right: auto; }
}

@media (max-width: 640px) {
  .edu-banner { min-height: 420px; }
  .edu-banner h1 { font-size: 24px; }
  .eb-tag { font-size: 12px; letter-spacing: 3px; gap: 10px; }
  .eb-tag i { width: 36px; }
  .eb-btns { flex-wrap: wrap; gap: 14px; margin-top: 38px; }
  .eb-btn { padding: 12px 28px; font-size: 14px; letter-spacing: 2px; }

  .edu-who, .edu-path, .edu-cases { padding: 48px 0 58px; }
  .edu-journey { padding: 48px 0 64px; }
  .edu-head h2 { font-size: 26px; }

  .path-grid { grid-template-columns: 1fr; }
  .p-card { padding: 32px 24px 38px; }
  .p-q { font-size: 18px; }

  .tl-item { margin-bottom: 40px; }
  .tl-year { font-size: 32px; }
  .tl-txt { font-size: 13.5px; margin-top: 10px; }

  .case-body h3 { font-size: 20px; }
  .case-q { font-size: 16px; }
}