/* =========================================================
   同德会官网 - 非首页图片版式精修（2026-05）
   目标：只优化 about / spirit / projects / action / gallery / news / join / team
   原则：不把所有图片裁成一样；按页面语义分别排版，统一但不死板。
   ========================================================= */

:root{
  --tdh-radius-xl:34px;
  --tdh-radius-lg:28px;
  --tdh-radius-md:24px;
  --tdh-card-border:1px solid rgba(216,173,92,.20);
  --tdh-soft-shadow:0 22px 60px rgba(55,35,0,.10);
  --tdh-dark-shadow:0 28px 72px rgba(0,0,0,.18);
}

body[data-page$=".html"] .subpage-hero-visual,
body[data-page$=".html"] .photo-banner,
body[data-page$=".html"] .gallery-feature-card,
body[data-page$=".html"] .news-card,
body[data-page$=".html"] .news-feature-card,
body[data-page$=".html"] .team-pro-card,
body[data-page$=".html"] .team-support-card,
body[data-page$=".html"] .project-detail,
body[data-page$=".html"] .join-visual-panel,
body[data-page$=".html"] .story-photo-grid figure,
body[data-page$=".html"] .values-photo-grid figure,
body[data-page$=".html"] .action-scenes-grid figure,
body[data-page$=".html"] .project-document-grid figure,
body[data-page$=".html"] .join-real-grid figure,
body[data-page$=".html"] .gallery-mosaic-grid figure{
  overflow:hidden;
}

body[data-page$=".html"] .story-photo-grid figure,
body[data-page$=".html"] .values-photo-grid figure,
body[data-page$=".html"] .action-scenes-grid figure,
body[data-page$=".html"] .project-document-grid figure,
body[data-page$=".html"] .join-real-grid figure,
body[data-page$=".html"] .gallery-mosaic-grid figure,
body[data-page$=".html"] .gallery-feature-thumb,
body[data-page$=".html"] .news-thumb,
body[data-page$=".html"] .team-pro-photo,
body[data-page$=".html"] .team-support-card img,
body[data-page$=".html"] .projects-top-visual-photo,
body[data-page$=".html"] .news-feature-image,
body[data-page$=".html"] .subpage-hero-visual{
  border-radius:var(--tdh-radius-lg);
}

body[data-page$=".html"] .story-photo-grid img,
body[data-page$=".html"] .values-photo-grid img,
body[data-page$=".html"] .action-scenes-grid img,
body[data-page$=".html"] .project-document-grid img,
body[data-page$=".html"] .join-real-grid img,
body[data-page$=".html"] .gallery-mosaic-grid img,
body[data-page$=".html"] .gallery-feature-thumb img,
body[data-page$=".html"] .news-thumb img,
body[data-page$=".html"] .projects-top-visual-photo img,
body[data-page$=".html"] .news-feature-image img,
body[data-page$=".html"] .subpage-hero-visual img,
body[data-page$=".html"] .photo-banner img,
body[data-page$=".html"] .join-visual-panel img,
body[data-page$=".html"] .team-pro-photo img,
body[data-page$=".html"] .team-support-card img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

/* ---------- 通用：非首页 banner / hero 统一更高级 ---------- */
body[data-page="about.html"] .subpage-hero-visual,
body[data-page="spirit.html"] .subpage-hero-visual,
body[data-page="projects.html"] .subpage-hero-visual,
body[data-page="action.html"] .subpage-hero-visual,
body[data-page="gallery.html"] .subpage-hero-visual,
body[data-page="news.html"] .subpage-hero-visual,
body[data-page="join.html"] .subpage-hero-visual,
body[data-page="team.html"] .subpage-hero-visual{
  aspect-ratio:16 / 10;
  min-height:0 !important;
  border:1px solid rgba(244,210,138,.16);
  box-shadow:var(--tdh-dark-shadow);
}

body[data-page="gallery.html"] .subpage-hero-visual img{object-position:center 38%}
body[data-page="news.html"] .subpage-hero-visual img{object-position:center 36%}
body[data-page="about.html"] .subpage-hero-visual img,
body[data-page="spirit.html"] .subpage-hero-visual img,
body[data-page="projects.html"] .subpage-hero-visual img,
body[data-page="action.html"] .subpage-hero-visual img,
body[data-page="join.html"] .subpage-hero-visual img,
body[data-page="team.html"] .subpage-hero-visual img{object-position:center 34%}

/* ---------- 关于同德会 ---------- */
body[data-page="about.html"] .photo-banner{
  aspect-ratio:16 / 7;
  min-height:0 !important;
  border-radius:var(--tdh-radius-xl);
}
body[data-page="about.html"] .photo-banner img{object-position:center 42%}
body[data-page="about.html"] .photo-banner-copy{max-width:620px}

body[data-page="about.html"] .story-photo-grid{
  display:grid !important;
  grid-template-columns:1.15fr .85fr .85fr !important;
  grid-auto-rows:250px;
  gap:20px !important;
}
body[data-page="about.html"] .story-photo-grid figure{
  min-height:0 !important;
  aspect-ratio:auto !important;
  box-shadow:var(--tdh-dark-shadow);
  border:var(--tdh-card-border);
}
body[data-page="about.html"] .story-photo-grid figure.big{
  grid-row:span 2;
}
body[data-page="about.html"] .story-photo-grid figure.big img{object-position:center 42%}
body[data-page="about.html"] .story-photo-grid figure:nth-child(2) img{object-position:center 40%}
body[data-page="about.html"] .story-photo-grid figure:nth-child(3) img{object-position:center 34%}

/* ---------- 精神理念 ---------- */
body[data-page="spirit.html"] .values-photo-grid{
  display:grid !important;
  grid-template-columns:.92fr 1.04fr 1.04fr !important;
  grid-auto-rows:250px;
  gap:20px !important;
}
body[data-page="spirit.html"] .values-photo-grid figure{
  min-height:0 !important;
  aspect-ratio:auto !important;
  border:var(--tdh-card-border);
  box-shadow:var(--tdh-dark-shadow);
}
body[data-page="spirit.html"] .values-photo-grid figure.tall{
  grid-row:span 2;
}
body[data-page="spirit.html"] .values-photo-grid figure.tall img{object-position:center 42%}
body[data-page="spirit.html"] .values-photo-grid figure:nth-child(2) img{object-position:center 48%}
body[data-page="spirit.html"] .values-photo-grid figure:nth-child(3) img{object-position:center 38%}

/* ---------- 公益项目 ---------- */
body[data-page="projects.html"] .projects-top-visual{
  grid-template-columns:1.02fr .98fr !important;
  gap:28px !important;
  margin-bottom:38px !important;
}
body[data-page="projects.html"] .projects-top-visual-photo{
  aspect-ratio:6 / 5;
  min-height:0 !important;
  box-shadow:var(--tdh-dark-shadow);
}
body[data-page="projects.html"] .projects-top-visual-photo img{object-position:center 40%}

body[data-page="projects.html"] .image-project{
  grid-template-columns:350px 1fr !important;
  gap:30px !important;
}
body[data-page="projects.html"] .image-project .project-image{
  min-height:0 !important;
  aspect-ratio:4 / 5 !important;
  background:#f8f3ea !important;
  border:1px solid rgba(216,173,92,.22) !important;
  box-shadow:var(--tdh-soft-shadow);
  padding:12px;
}
body[data-page="projects.html"] .image-project .project-image img{
  object-fit:contain !important;
  object-position:center top !important;
  background:#f8f3ea !important;
  border-radius:18px;
  position:relative !important;
}
body[data-page="projects.html"] .project-document-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:18px !important;
  margin-top:34px !important;
}
body[data-page="projects.html"] .project-document-grid figure{
  aspect-ratio:4 / 3 !important;
  min-height:0 !important;
  border:var(--tdh-card-border);
  box-shadow:var(--tdh-dark-shadow);
}
body[data-page="projects.html"] .project-document-grid figure:nth-child(1) img{object-position:center 42%}
body[data-page="projects.html"] .project-document-grid figure:nth-child(2) img{object-position:center 44%}
body[data-page="projects.html"] .project-document-grid figure:nth-child(3) img{object-position:center 48%}
body[data-page="projects.html"] .project-document-grid figure:nth-child(4) img{object-position:center 38%}

/* ---------- 行动方式 ---------- */
body[data-page="action.html"] .photo-banner{
  aspect-ratio:16 / 7;
  min-height:0 !important;
  border-radius:var(--tdh-radius-xl);
}
body[data-page="action.html"] .photo-banner img{object-position:center 40%}
body[data-page="action.html"] .action-scenes-grid{
  display:grid !important;
  grid-template-columns:1.18fr 1fr 1fr !important;
  grid-auto-rows:210px;
  gap:20px !important;
}
body[data-page="action.html"] .action-scenes-grid figure{
  min-height:0 !important;
  aspect-ratio:auto !important;
  border:var(--tdh-card-border);
  box-shadow:var(--tdh-dark-shadow);
}
body[data-page="action.html"] .action-scenes-grid figure.large{
  grid-row:span 2;
}
body[data-page="action.html"] .action-scenes-grid figure.large img{object-position:center 42%}
body[data-page="action.html"] .action-scenes-grid figure:nth-child(2) img{object-position:center 50%}
body[data-page="action.html"] .action-scenes-grid figure:nth-child(3) img{object-position:center 40%}
body[data-page="action.html"] .action-scenes-grid figure:nth-child(4) img{object-position:center 38%}

/* ---------- 公益相册 ---------- */
body[data-page="gallery.html"] .gallery-mosaic-grid{
  display:grid !important;
  grid-template-columns:repeat(12,minmax(0,1fr)) !important;
  gap:20px !important;
  grid-auto-flow:dense;
}
body[data-page="gallery.html"] .gallery-mosaic-grid figure{
  grid-column:span 4 !important;
  aspect-ratio:4 / 3 !important;
  min-height:0 !important;
  border:var(--tdh-card-border);
  box-shadow:var(--tdh-dark-shadow);
  border-radius:28px !important;
}
body[data-page="gallery.html"] .gallery-mosaic-grid figure.large{
  grid-column:span 8 !important;
  aspect-ratio:16 / 10 !important;
}
body[data-page="gallery.html"] .gallery-mosaic-grid figure.tall{
  grid-column:span 4 !important;
  aspect-ratio:4 / 5 !important;
}
body[data-page="gallery.html"] .gallery-mosaic-grid figure:nth-child(1) img{object-position:center 34% !important;}
body[data-page="gallery.html"] .gallery-mosaic-grid figure:nth-child(2) img{object-position:center 44% !important;}
body[data-page="gallery.html"] .gallery-mosaic-grid figure:nth-child(3) img{object-position:center 48% !important;}
body[data-page="gallery.html"] .gallery-mosaic-grid figure:nth-child(4) img{object-position:center 38% !important;}
body[data-page="gallery.html"] .gallery-mosaic-grid figure:nth-child(5) img{object-position:center 40% !important;}
body[data-page="gallery.html"] .gallery-mosaic-grid figure:nth-child(6) img{object-position:center 42% !important;}
body[data-page="gallery.html"] .gallery-mosaic-grid figure:nth-child(7) img{object-position:center 36% !important;}
body[data-page="gallery.html"] .gallery-mosaic-grid figure:nth-child(8) img{object-position:center 40% !important;}

body[data-page="gallery.html"] .gallery-feature-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:22px !important;
}
body[data-page="gallery.html"] .gallery-feature-card{
  box-shadow:var(--tdh-soft-shadow);
  border:var(--tdh-card-border);
  border-radius:28px !important;
}
body[data-page="gallery.html"] .gallery-feature-thumb{
  aspect-ratio:16 / 10;
}
body[data-page="gallery.html"] .gallery-feature-grid article:nth-child(1) img{object-position:center 38%}
body[data-page="gallery.html"] .gallery-feature-grid article:nth-child(2) img{object-position:center 42%}
body[data-page="gallery.html"] .gallery-feature-grid article:nth-child(3) img{object-position:center 46%}

/* ---------- 新闻动态 ---------- */
body[data-page="news.html"] .news-feature-card{
  grid-template-columns:1.02fr .98fr !important;
  gap:28px !important;
  box-shadow:var(--tdh-soft-shadow);
}
body[data-page="news.html"] .news-feature-image{
  aspect-ratio:10 / 7;
  min-height:0 !important;
}
body[data-page="news.html"] .news-feature-image img{object-position:center 38%}
body[data-page="news.html"] .news-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:22px !important;
}
body[data-page="news.html"] .news-card{
  box-shadow:var(--tdh-soft-shadow);
  border:var(--tdh-card-border);
}
body[data-page="news.html"] .news-thumb{
  aspect-ratio:4 / 3;
}
body[data-page="news.html"] .news-card:nth-child(1) .news-thumb img{object-position:center 42%}
body[data-page="news.html"] .news-card:nth-child(2) .news-thumb img{object-position:center 44%}
body[data-page="news.html"] .news-card:nth-child(3) .news-thumb img{object-position:center 48%}
body[data-page="news.html"] .news-card:nth-child(4) .news-thumb img{object-position:center 40%}
body[data-page="news.html"] .news-card:nth-child(5) .news-thumb img{object-position:center 38%}
body[data-page="news.html"] .news-card:nth-child(6) .news-thumb img{object-position:center 42%}

/* ---------- 加入我们 ---------- */
body[data-page="join.html"] .join-visual-panel{
  min-height:0 !important;
  aspect-ratio:4 / 5;
  border-radius:34px !important;
  box-shadow:var(--tdh-dark-shadow);
}
body[data-page="join.html"] .join-visual-panel img{object-position:center 38%}
body[data-page="join.html"] .join-real-grid.join-real-grid-4{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:18px !important;
}
body[data-page="join.html"] .join-real-grid.join-real-grid-4 figure{
  min-height:0 !important;
  aspect-ratio:5 / 4 !important;
  border:var(--tdh-card-border);
  box-shadow:var(--tdh-soft-shadow);
}
body[data-page="join.html"] .join-real-grid.join-real-grid-4 figure:nth-child(1) img{object-position:center 42%}
body[data-page="join.html"] .join-real-grid.join-real-grid-4 figure:nth-child(2) img{object-position:center 38%}
body[data-page="join.html"] .join-real-grid.join-real-grid-4 figure:nth-child(3) img{object-position:center 42%}
body[data-page="join.html"] .join-real-grid.join-real-grid-4 figure:nth-child(4) img{object-position:center 46%}

/* ---------- 核心团队 ---------- */
body[data-page="team.html"] .team-page-hero-grid{
  align-items:center;
}
body[data-page="team.html"] .team-hero-image{
  border-radius:34px !important;
}
body[data-page="team.html"] .team-pro-grid{
  gap:30px !important;
}
body[data-page="team.html"] .team-pro-card{
  grid-template-columns:340px 1fr !important;
  gap:30px !important;
  padding:18px !important;
  border-radius:32px !important;
}
body[data-page="team.html"] .team-pro-photo{
  aspect-ratio:4 / 5;
  min-height:0 !important;
  border-radius:24px !important;
}
body[data-page="team.html"] .team-pro-card:nth-child(1) .team-pro-photo img{object-position:center 20%}
body[data-page="team.html"] .team-pro-card:nth-child(2) .team-pro-photo img{object-position:center 22%}
body[data-page="team.html"] .team-pro-card:nth-child(3) .team-pro-photo img{object-position:center 16%}

body[data-page="team.html"] .team-support-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:26px !important;
}
body[data-page="team.html"] .team-support-card{
  grid-template-columns:220px 1fr !important;
  gap:22px !important;
  align-items:center !important;
  border-radius:30px !important;
}
body[data-page="team.html"] .team-support-card img{
  height:auto !important;
  aspect-ratio:4 / 5;
  border-radius:22px !important;
}
body[data-page="team.html"] .team-support-card:nth-child(1) img{object-position:center 18%}
body[data-page="team.html"] .team-support-card:nth-child(2) img{object-position:center 20%}

/* ---------- 响应式 ---------- */
@media (max-width:1180px){
  body[data-page="news.html"] .news-grid,
  body[data-page="gallery.html"] .gallery-feature-grid,
  body[data-page="projects.html"] .project-document-grid,
  body[data-page="join.html"] .join-real-grid.join-real-grid-4,
  body[data-page="team.html"] .team-support-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  body[data-page="gallery.html"] .gallery-mosaic-grid figure{grid-column:span 6 !important;}
  body[data-page="gallery.html"] .gallery-mosaic-grid figure.large{grid-column:span 12 !important;}
}

@media (max-width:1040px){
  body[data-page="about.html"] .story-photo-grid,
  body[data-page="spirit.html"] .values-photo-grid,
  body[data-page="action.html"] .action-scenes-grid,
  body[data-page="projects.html"] .projects-top-visual,
  body[data-page="projects.html"] .image-project,
  body[data-page="news.html"] .news-feature-card,
  body[data-page="team.html"] .team-pro-card,
  body[data-page="team.html"] .team-support-card{
    grid-template-columns:1fr !important;
  }

  body[data-page="about.html"] .story-photo-grid,
  body[data-page="spirit.html"] .values-photo-grid,
  body[data-page="action.html"] .action-scenes-grid{
    grid-auto-rows:auto;
  }

  body[data-page="about.html"] .story-photo-grid figure,
  body[data-page="about.html"] .story-photo-grid figure.big,
  body[data-page="spirit.html"] .values-photo-grid figure,
  body[data-page="spirit.html"] .values-photo-grid figure.tall,
  body[data-page="action.html"] .action-scenes-grid figure,
  body[data-page="action.html"] .action-scenes-grid figure.large{
    grid-row:auto;
    aspect-ratio:16 / 10 !important;
  }

  body[data-page="news.html"] .news-grid,
  body[data-page="gallery.html"] .gallery-feature-grid,
  body[data-page="projects.html"] .project-document-grid,
  body[data-page="join.html"] .join-real-grid.join-real-grid-4,
  body[data-page="team.html"] .team-support-grid{
    grid-template-columns:1fr 1fr !important;
  }
}

@media (max-width:760px){
  body[data-page="about.html"] .photo-banner,
  body[data-page="action.html"] .photo-banner,
  body[data-page="projects.html"] .projects-top-visual-photo,
  body[data-page="news.html"] .news-feature-image,
  body[data-page="join.html"] .join-visual-panel,
  body[data-page="team.html"] .team-pro-photo,
  body[data-page="team.html"] .team-support-card img{
    aspect-ratio:4 / 3 !important;
  }

  body[data-page="gallery.html"] .gallery-mosaic-grid,
  body[data-page="news.html"] .news-grid,
  body[data-page="gallery.html"] .gallery-feature-grid,
  body[data-page="projects.html"] .project-document-grid,
  body[data-page="join.html"] .join-real-grid.join-real-grid-4,
  body[data-page="team.html"] .team-support-grid{
    grid-template-columns:1fr !important;
  }

  body[data-page="gallery.html"] .gallery-mosaic-grid figure,
  body[data-page="gallery.html"] .gallery-mosaic-grid figure.large,
  body[data-page="gallery.html"] .gallery-mosaic-grid figure.tall,
  body[data-page="news.html"] .news-thumb,
  body[data-page="gallery.html"] .gallery-feature-thumb,
  body[data-page="projects.html"] .project-document-grid figure,
  body[data-page="join.html"] .join-real-grid.join-real-grid-4 figure,
  body[data-page="team.html"] .team-support-card img{
    aspect-ratio:4 / 3 !important;
  }

  body[data-page="about.html"] .story-photo-grid figure,
  body[data-page="spirit.html"] .values-photo-grid figure,
  body[data-page="action.html"] .action-scenes-grid figure,
  body[data-page="projects.html"] .image-project .project-image,
  body[data-page="team.html"] .team-pro-photo{
    aspect-ratio:4 / 3 !important;
  }

  body[data-page="projects.html"] .image-project .project-image img{
    object-fit:contain !important;
  }

  body[data-page="team.html"] .team-pro-card,
  body[data-page="team.html"] .team-support-card{
    padding:12px !important;
    border-radius:24px !important;
  }
}