/* sgs 證書列表 */
.row-cols-2.row-cols-md-4.g-4 .col img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border: 1px solid #d0d0d0;
    border-radius: 4px;
    transition: transform .3s, box-shadow .3s;
}

.row-cols-2.row-cols-md-4.g-4 .col img:hover {
    transform: scale(1.02);
    box-shadow: 0 6px 16px rgba(0, 0, 0, .12);
}

.product-link .arrow {
    font-size:1.25em;
    position:relative;
    top:-2px;              /* ↑ 往上 2px，可依需求微調 */
    transition:transform .2s;
}

.product-link:hover .arrow {
    transform:translateX(3px);
}

/* 容器與格線設定 */

/* ① 加大卡片之間的縱橫間距（原本 g-4=1.5 rem）→ 改成 2 rem */
/* ① 卡片四周留 12px 白框（避免 margin 上塌陷）*/
.category-section .card {
    padding:12px;             /* 上下左右皆 12px */
}

/* ② 灰底比例盒維持 8px 圓角 */
.category-section .card .ratio {
    border-radius:8px;
}

/* ③ 把 .row 欄間距改大（等同 g-5：3rem）*/
.category-section .row {
    --bs-gutter-x:3rem;
    --bs-gutter-y:3rem;
}

.card-img-top {
    width:100%;height:100%;object-fit:contain;transition:transform .35s;
}

.hover-lift:hover .card-img-top {
    transform:scale(1.08);
}

/* Layout */

.rd-row {
    display: flex;
    gap: 40px;
}

/* === 主要三欄 Grid 版型 === */
.rd-col{
    display:grid;
    grid-template-columns:35rem 21rem 18rem;   /* 文字／主圖／副圖或數字卡 */
    grid-template-areas:
    "txt  img1 stat1"
    "txt  stat2 img2";
    /* gap:2rem;           欄列間距 */

}

.animate-item.first-item {
    padding-left:62px;
}

.animate-item.second-item {
    padding-left:20px;
}

.down-item {
    padding-left:60px;
}

/* 區塊對應到 Grid Area */
.rd-text      { grid-area:txt;  }
.vg-main      { grid-area:img1; }
.vg-stat--big { grid-area:stat1;}
.vg-stat--small{grid-area:stat2;}
.vg-sub       { grid-area:img2; }

/* === RWD：寬度 ≤ 992px 改為單欄直排 === */
@media (max-width:992px){
    .rd-col{
        grid-template-columns:1fr;
        grid-template-areas:
      "txt"
      "img1"
      "stat1"
      "stat2"
      "img2";
    }
}


/* 文字區 */
.rd-text .rd-title {
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: -0.06px;
    font-size:32px;
    color: #de9900;
    margin-bottom: 12px;
}



.img-gap{
    padding-top: 6rem;
}


/* 共用：文字置中，圓角一致 */
/* 讓數字卡片撐滿格子、顯示顏色 */
/* ---------- 數字卡 & 圖片：同寬不同高 ---------- */
.vg-stat,
.vg-main img,
.vg-sub  img{
    width:100%;     /*  ← 想要多小就改這裡 */
    max-width:none;      /* 防止被 100% 以外的限制干擾 */
    justify-self:stretch;/* Grid 子項水平拉滿 */

}

/* 數字卡共用樣式 */
.vg-stat{
    display:flex;
    flex-direction:column;
    justify-content:center;
    text-align:center;      /* 內部文字置中 */
    height:8rem;
    border-radius:16px;
    padding:2rem;
    color:#ffffff;
}
.vg-stat--big{
    background:#ffd680;
    align-self:end;
}
.vg-stat--small{
    background:#ffa500;

}

.stat-number{
    /* font-size:3rem;    想再大就調這裡 
    font-weight:500;  Extra‑Bold */
    font-size: 52px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #fff;

}

/* 標籤 → 稍大、粗體 */
.stat-label{
    /* font-size:2rem;   想再大就調這裡
    font-weight:500;  Extra‑Bold */
    font-size: 16px;
    font-weight: 900;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: -0.03px;
    color: #fff;
    margin-top:.1rem; /* 與數字微距離 */
}

/* 圖片附加樣式 */
/* 外層容器：保留上下間距 */
.vg-main,
.vg-sub{
    margin-bottom:2rem;
}

.vg-sub{
    margin-top: 2rem;
}

/* 內層圖片：真正裁切圓角 */
.vg-main img,
.vg-sub  img{
    display:block;     /* 清除預設 inline-gap */
    border-radius:16px;/* 四邊都會生效 */
}


/* ---------- 其它區塊 ---------- */
.rd-gap-2{padding-top:2rem;}  /* 仍需上下間距則保留 */



/* 先把預設隱藏＋往下位移 */
.animate-item {
    opacity: 0;
    transform: translateY(20px);
    /* 設定不執行，等 JS 幫你加上 .in 動畫才跑 */
}

/* 真正的淡入＋上移動畫 */
.animate-item.in {
    animation: fadeInUp 0.6s ease-out forwards;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* 僅放在自訂樣式檔最下方 */
.equip-section {
    background-color: #e0e0e0;
}

.equip-section .card {
    background-color: #fff;
    border-radius: 0.5rem;
}

.equip-section .card-img-top {
    object-fit: contain;
    width: 100%;
    height: 180px;
}

/* 自訂最下方加入 */
.testing-section .table-dark {
    background-color: #0a3150;
}

.testing-section .table-dark th {
    color: #fff;
}

.testing-section .table-secondary {
    background-color: #f2f2f2;
}

.testing-section table td, .testing-section table th {
    vertical-align: middle;
}

/* 3. 去掉 <p> 的預設上邊距，統一控制間距 */
.industry-app .card-body p {
    margin: 0 0 1rem;   /* 上 0，下 1rem */
    font-size: 0.9rem;
    color: #6c757d;
    line-height: 1.4;   /* 兩行文字約 2.8rem，高度一致 */
    min-height: 6rem; /* 確保不滿兩行時，也佔滿兩行高度 */
}


 
@media (max-width: 767px) {
    .down-item {
        padding-left:12px;
    }
}