/* ===== Inter 本地映射（精简权重；如已全局引入可删） ===== */
@font-face {
  font-family: "Inter";
  src: url("../font/inter/Inter_24pt-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("../font/inter/Inter_24pt-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("../font/inter/Inter_24pt-SemiBold.ttf")format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("../font/inter/Inter_28pt-ExtraBold.ttf")format("truetype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("../font/inter/Inter_28pt-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --fs-body: clamp(14px, 1.1vw, 20px);
  --fs-kicker: clamp(18px, 1.6vw, 28px);
  --fs-degree: clamp(18px, 1.8vw, 30px);
  /* 学位标题（已下调） */
  --fs-h2: clamp(24px, 2.4vw, 40px);
  /* Section 标题 ≥ 学位 */
  --fs-h1: clamp(32px, 4.2vw, 68px);

  --edu-logo-col: clamp(280px, 22vw, 420px);
  --edu-logo-h: clamp(84px, 8vw, 140px);
}

* {
  box-sizing: border-box
}

html,
body {
  margin: 0
}

body {
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", sans-serif;
  color: #111;
  font-size: var(--fs-body);
  line-height: 1.6;
}

/* 容器与分段（与 index 对齐） */
.wrapper {
  max-width: clamp(1040px, 74vw, 1560px);
  margin: 0 auto;
  padding-left: clamp(20px, 4vw, 96px);
  padding-right: clamp(20px, 4vw, 96px);
}

.section-full {
  padding-top: clamp(24px, 5vh, 80px);
  padding-bottom: clamp(24px, 7vh, 96px);
}

.section-title {
  margin: 0;
  font-weight: 800;
  font-size: var(--fs-h2);
}

.section-rule {
  border: 0;
  height: 1px;
  background: #eee;
  margin: 12px calc(clamp(20px, 4vw, 96px) * -1) 8vh;
}

/* ============= 1) Hero ============= */
.about-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  justify-items: center;
  gap: clamp(16px, 3vw, 40px);
}

.hero-text {
  width: min(100%, 46rem);
  text-align: left;
}

.hero-title {
  font-weight: 900;
  font-size: var(--fs-h1);
  margin: 0 0 .5rem;
  letter-spacing: -.01em;
}

.about-kicker {
  font-size: var(--fs-kicker);
  font-weight: 500;
  margin: 0 0 .5rem;
  letter-spacing: .2px;
}

.about-intro {
  max-width: 42rem;
  color: #333;
}

.circle.profile {
  display: inline-block;
  width: clamp(180px, 24vw, 320px);
  height: clamp(180px, 24vw, 320px);
  background: #d0d0d0 center/cover no-repeat;
  background-image: url('../img/about/seaboat.png');
  border-radius: 50%;
}

@media (max-width:768px) {
  .about-hero {
    grid-template-columns: 1fr;
  }

  .about-ornaments {
    order: 2;
  }

  .circle.profile {
    width: clamp(140px, 44vw, 220px);
    height: clamp(140px, 44vw, 220px);
  }
}

/* ============= 2) Education ============= */
.edu-section {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--edu-logo-col);
  grid-auto-rows: minmax(120px, auto);
  align-items: center;
  column-gap: clamp(16px, 2vw, 24px);
  row-gap: 0;
}

.edu-section .section-title,
.edu-section .section-rule {
  grid-column: 1 / -1;
}

.edu-item {
  display: contents;
}

.edu-left {
  grid-column: 1;
  padding: 24px 0;
  border-top: 1px solid #eee;
  min-width: 0;
  text-align: left;
}

.edu-degree {
  margin: 0 0 6px;
  font-weight: 800;
  font-size: var(--fs-degree);
  line-height: 1.3;
  white-space: normal;
  overflow-wrap: anywhere;
}

.edu-school {
  margin: 0;
  color: #202020;
}

.edu-right {
  grid-column: 2;
  padding: 24px 0;
  border-top: 0;
  border-bottom: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.edu-logo {
  display: block;
  height: var(--edu-logo-h);
  width: auto;
  max-width: 100%;
  object-fit: contain;
  object-position: right center;
}

.edu-item:last-of-type .edu-left {
  border-bottom: 1px solid #eee;
}

/* 移动端：加大标题与证书间距、两证书间距；Logo 更大 */
@media (max-width:768px) {
  .edu-section {
    display: block;
  }

  .edu-section .section-title {
    text-align: center;
    font-size: clamp(26px, 7vw, 38px);
  }

  .edu-section .section-rule {
    margin-bottom: 40px;
  }

  /* 标题 → 列表 间距更大 */

  .edu-item {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 14px;
    row-gap: 12px;
    padding: 22px 0;
    /* 卡片内留白增加 */
    border-top: 1px solid #eee;
  }

  .edu-item+.edu-item {
    margin-top: 18px;
  }

  /* 两张证书之间加距 */
  .edu-item:last-child {
    border-bottom: 1px solid #eee;
  }

  .edu-left,
  .edu-right {
    border: 0;
    padding: 0;
  }

  .edu-right {
    order: -1;
    grid-column: 1 / 3;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .edu-logo {
    height: clamp(90px, 26vw, 150px);
  }

  /* 移动端 Logo 更大 */
  .edu-left {
    grid-column: 1 / 3;
    justify-self: center;
    text-align: left;
    width: min(100%, 600px);
  }
}

/* ============= 3) Traits ============= */
/* 桌面：文本在左，圆点图在右并靠右对齐 */
.traits-section {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(220px, 420px);
  align-items: center;
  gap: clamp(16px, 3vw, 40px);
}

.traits-copy .traits-text {
  color: #333;
  max-width: 48rem;
  margin-top: .5rem;
}

.traits-media {
  display: flex;
  justify-content: flex-end;
}

.traits-dot {
  width: clamp(160px, 20vw, 260px);
  height: clamp(160px, 20vw, 260px);
  background: url("../img/nav/round.png") center/cover no-repeat;
  border-radius: 50%;
}

/* 移动端：上下堆叠，图在下面居中 */
@media (max-width:768px) {
  .traits-section {
    grid-template-columns: 1fr;
  }

  .traits-copy {
    order: 1;
  }

  .traits-media {
    order: 2;
    justify-content: center;
  }

  .traits-dot {
    width: clamp(160px, 56vw, 280px);
    height: clamp(160px, 56vw, 280px);
  }
}