/* =============================
   Base
============================= */
.eng-components{
  width:100%;
  padding:24px 0;
  font-family: Inter, "Segoe UI", Arial, sans-serif;
  box-sizing:border-box;
}

/* ✅ 外层：用来整体缩放 */
.eng-wrap{
  width:min(1400px, 100%);
  margin:0 auto;
  transform-origin: top center;
}

/* 标题 */
.eng-wrap h2{
  text-align:center;
  font-size:clamp(28px, 2.4vw, 32px);
  font-weight:700;
  line-height:1.25;
  margin:0 0 18px;
  padding:0 18px;
}

/* Grid */
.eng-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:18px;
  padding:0 64px;
  box-sizing:border-box;
}

/* Card */
.eng-card{
  position:relative;
  display:block;
  border-radius:16px;
  overflow:hidden;
  aspect-ratio:16/9;
  background:#f3f3f3;
  text-decoration:none;
  color:#111;

  transition:transform .22s ease, box-shadow .22s ease;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
}

.eng-card:hover{
  transform:translateY(-6px);
  box-shadow:0 18px 36px rgba(0,0,0,.14);
}

.eng-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* Overlay（弧形） */
.eng-overlay{
  position:absolute;
  left:0;
  top:0;

  width:48%;
  height:36%;
  padding:26px 24px 18px 24px;

  background:rgba(255,255,255,.88);
  clip-path:ellipse(78% 88% at 0% 0%);
}

/* Typography */
.eng-title{
  font-size:20px;
  font-weight:700;
  line-height:1.2;
  margin:0;
}

.eng-sub{
  margin-top:18px;
  font-size:15px;
  font-weight:500;
  line-height:1.6;
  color:#495057;

  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
  text-decoration-color:rgba(0,0,0,.35);
}
.eng-card:hover .eng-sub{
  text-decoration-color:rgba(0,0,0,.65);
}

/* =============================
   ✅ 整体同步缩小（关键）
   你可以把这些 scale 当成“75% / 更小”的视觉效果
============================= */

/* 类似你说的 75% 观感（整体小一号） */
@media (max-width:1200px){
  .eng-wrap{ transform:scale(.92); }
}

/* 类似更小（接近你说的 33% 那种整体紧凑的观感） */
@media (max-width:900px){
  .eng-wrap{ transform:scale(.86); }
}

/* Mobile：不再用 scale（避免点击区域错位），改为真实响应式布局 */
@media (max-width:768px){
  .eng-wrap{ transform:none; }

  .eng-grid{
    grid-template-columns:1fr;
    gap:12px;
    padding:0 18px;
  }

  .eng-overlay{
    width:66%;
    height:34%;
    padding:22px 18px 16px 18px;
    clip-path:ellipse(84% 94% at 0% 0%);
  }

  .eng-title{ font-size:17px; }
  .eng-sub{ margin-top:12px; font-size:14px; }
}