/* ==========================================================================
   OIT AWARDS · 组织机构页  —  页面专属样式
   顶部导航 / 底部页脚 / .sec-title 等公用样式见 css/style.css（home 页面）
   设计稿基准：1920px（PSD 2560 / 1.3333 倍图），与 style.css 保持一致
   ========================================================================== */

/* ---------- 顶部横幅（导航下方，2560×671 → 高 503 @1920） ---------- */
.org-hero{
  position:relative;
  aspect-ratio:2560 / 671;
  overflow:hidden;
  background:#1b6f92;
}
.org-hero__bg{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover; object-position:center;
}
/* 横幅底部的内容宽度分隔线（设计稿 y=740，距底约 15px） */
.org-hero::after{
  content:"";
  position:absolute;
  left:50%; bottom:15px;
  transform:translateX(-50%);
  width:min(1329px, 100% - 48px);
  height:2px;
  background:linear-gradient(90deg, rgba(48,181,216,0), #30b5d8 18%, #30b5d8 82%, rgba(48,181,216,0));
}

/* ---------- 内容区：共用氛围背景（横幅底 → 页脚顶） ---------- */
/* 背景图为无色带的纯氛围渐变，100% 100% 拉伸铺满区块，
   任意视口宽度下都不会出现色带错位 / 颜色突变 */
.org-main{
  background:#1e377e url("../images/org_bg_main.jpg") center top / 100% 100% no-repeat;
  padding-bottom:clamp(48px, 4.219vw, 81px);
}

/* 区块小标题（评审委员会-主席 / 委员 / 主办单位） */
h4{ margin:0; }   /* style.css 只重置了 h1-h3 */
.org-title{ padding-top:clamp(40px, 3.854vw, 74px); }
.org-label{
  font-size:clamp(15px, 1.40625vw, 27px);
  line-height:1;
  font-weight:600;
  text-align:center;
  letter-spacing:.02em;
}

/* ---------- 主办单位 ---------- */
.org-host{ margin-top:clamp(34px, 3.125vw, 60px); }
.org-host__logos{
  margin-top:clamp(26px, 2.292vw, 44px);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:clamp(24px, 2.604vw, 50px);
}
.org-host__logos img{ height:auto; }
.org-host__logos img:first-child{ width:clamp(132px, 12.656vw, 243px); }
.org-host__logos img:last-child{ width:clamp(152px, 14.531vw, 279px); }
.org-host__sep{
  width:4px;
  height:clamp(24px, 1.979vw, 38px);
  background:rgba(255,255,255,.85);
  border-radius:2px;
}

/* ---------- 评审委员会-主席（色带区，常规流布局） ---------- */
/* 色带改为区块自身背景（cover），高度随内容自适应：
   内容再多也不会溢出色带，背景始终与内容同步 */
.org-band{
  position:relative;
  margin-top:clamp(48px, 4.688vw, 90px);
  background:#112c6f url("../images/org_chair_band.jpg") left center / cover no-repeat;
  padding:clamp(28px, 2.865vw, 55px) 0 clamp(26px, 1.667vw, 32px);
}

/* 色带上下沿的内容宽度分隔线 */
.org-band::before,
.org-band::after{
  content:"";
  position:absolute;
  left:50%; transform:translateX(-50%);
  width:min(1329px, 100% - 48px);
  height:2px;
  background:linear-gradient(90deg, rgba(17,152,209,0), #1098d1 18%, #1098d1 82%, rgba(17,152,209,0));
}
.org-band::before{ top:0; }
.org-band::after{ bottom:0; }

.chair{
  margin-top:clamp(26px, 3.854vw, 74px);
  display:flex;
  align-items:flex-start;
}
.chair__photo{
  flex:none;
  width:clamp(240px, 23.438vw, 450px);
  margin-left:45px;
  border-radius:6px;
  overflow:hidden;
}
.chair__photo img{ width:100%; aspect-ratio:3/2; object-fit:cover; }
.chair__info{
  flex:1;
  min-width:0;
  margin-left:clamp(20px, 7.23vw, 139px);
  padding-right:44px;
}
.chair__name{
  font-size:clamp(22px, 2.135vw, 41px);
  line-height:1.1;
  font-weight:700;
  color:#2acddb;
}
.chair__title{
  margin-top:clamp(8px, .729vw, 14px);
  font-size:clamp(13px, 1.25vw, 24px);
  font-weight:600;
}
.chair__desc{
  margin-top:clamp(14px, 1.406vw, 27px);
  font-size:clamp(12px, .833vw, 16px);
  line-height:1.95;
  text-align:justify;
  text-justify:inter-ideograph;
  color:rgba(255,255,255,.96);
}

/* ---------- 评审委员会-委员（3 列 × 4 行；卡片左半为照片） ---------- */
.org-members{ margin-top:clamp(28px, 2.292vw, 44px); }
.org-members__wrap{
  margin-top:clamp(26px, 2.344vw, 45px);
}
/* 一行三个时保持水平居中（设计稿卡片组在容器内左右各留 ~44px） */
.members-row{
  display:grid;
  grid-template-columns:repeat(3, clamp(230px, 19.61vw, 376.5px));
  column-gap:clamp(20px, 2.891vw, 55.5px);
  justify-content:center;
}
.members-row + .members-row{ margin-top:clamp(24px, 2.266vw, 43.5px); }
.member{
  position:relative;
  aspect-ratio:502 / 302;
  border-radius:6px;
  overflow:hidden;
  background:linear-gradient(112deg, #01406f 0%, #013258 55%, #002a4d 100%);
  box-shadow:0 8px 22px rgba(0,12,40,.28);
  transition:transform .22s, box-shadow .22s;
  margin-bottom:24px;
}
.member:hover{ transform:translateY(-3px); box-shadow:0 14px 30px rgba(0,12,40,.4); }
.member__photo{
  position:absolute;
  left:0; top:0;
  width:49.8%;               /* 250/502，照片占卡片左半 */
  height:100%;
  object-fit:cover;
  object-position:center top;
}
.member__name{
  position:absolute;
  left:58.17%;               /* 219/376.5 */
  top:13.25%;                /* 30/226.5 */
  font-size:clamp(16px, 1.354vw, 26px);
  line-height:1;
  font-weight:700;
  letter-spacing:.06em;
  white-space:nowrap;
}
.member__firm{
  position:absolute;
  left:57.77%;               /* 217.5/376.5 */
  top:34.77%;                /* 78.75/226.5 */
  font-size:clamp(10px, .677vw, 13px);
  line-height:1.35;
  color:rgba(255,255,255,.95);
}

/* ---------- 滚动淡入 ---------- */
.fade-in{ opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }
.fade-in.visible{ opacity:1; transform:none; }

/* ==========================================================================
   响应式
   ========================================================================== */
@media (max-width:1424px){
  .chair__info{ padding-right:24px; }
}

@media (max-width:1100px){
  .chair__photo{ margin-left:0; }
  .chair__info{ margin-left:clamp(16px, 4vw, 60px); }
  .members-row{ grid-template-columns:repeat(3, minmax(0, 1fr)); column-gap:20px; }
}

@media (max-width:900px){
  /* 色带底图改为纯色渐变，内容常规流 */
  .org-band{
    background:linear-gradient(180deg, #1a2f66 0%, #152a5e 100%);
    padding:44px 0 52px;
  }
  .chair{ flex-direction:column; align-items:center; margin-top:34px; }
  .chair__photo{ width:min(100%, 450px); }
  .chair__info{ margin:26px 0 0; padding-right:0; }
  .chair__name{ font-size:30px; }
  .chair__title{ font-size:16px; }
  .chair__desc{ font-size:14px; }

  /* 委员：单列居中 */
  .org-members{ margin-top:40px; }
  .org-members__wrap{ margin-top:30px; margin-left:0; }
  .members-row{
    grid-template-columns:min(376px, 92%);
    justify-content:center;
    row-gap:24px;
  }
  .member__name{ font-size:20px; }
  .member__firm{ font-size:12px; }
}
