body { background: #f5f7fa; }
.about-container { max-width: min(calc(100% - 2rem),980px); margin: 60px auto 45px auto; background: #fff; border-radius: 14px; box-shadow: 0 4px 24px #0001; padding: 40px 36px 36px 36px;}
.about-title { font-family: HW2; color: #0066a1; font-size: 2rem; font-weight: bold; text-align: center; letter-spacing: 2px; }
.about-section { margin-bottom: 38px; padding-top: 54px;}
.about-section-title { color: #2cacd1; font-size: 1.25rem; font-weight: bold; margin-bottom: 14px; border-left: 4px solid #35eb93; padding-left: 12px; }
.about-section-content { color: #444; font-size: 1.08rem; line-height: 2; margin-bottom: 8px; }
.about-list { margin: 10px 0 10px 24px; color: #444; font-size: 1.05rem; }
.about-list li { margin-bottom: 6px; }
.about-list img { width: 40%; height: auto; object-fit: contain; background: #f5f7fa; border-radius: 8px; box-shadow: 0 2px 8px #0001; transition: transform 0.24s ease;transform-origin:left;}
.about-list img:hover { transform: translateX(6px) scale(1.02); }
.certificates-grid {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 12px;
    align-items: flex-start;
}
.certificates-grid img {
    max-width: 240px;
    width: calc(33.333% - 8px);
    height: auto;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.08);
    background: #fff;
    border: 1px solid #eee;
    object-fit: contain;
    padding: 8px;
    transition: transform 0.24s ease, box-shadow 0.24s ease;
}
.certificates-grid img:hover {
    transform: translateX(6px) scale(1.02);
    box-shadow: 0 8px 26px rgba(0,0,0,0.12);
}
@media (max-width: 800px) {
    .about-container { padding: 16px 6px 18px 6px;}
    .about-title { font-size: 1.3rem; }
    .about-section-title { font-size: 1.05rem; }
    .about-section-content, .about-list { font-size: 0.98rem; }
    .about-list img { width: 80px; height: 40px; }
    .certificates-grid img { width: calc(50% - 8px); max-width: none; }
}
@media (max-width: 420px) {
    .certificates-grid img { width: 100%; }
}
