/* ===== sections.css — gioi thieu, ky nang, footer, mobile ===== */
section{margin-top:42px}
.sec-title{font-size:21px;font-weight:800;margin-bottom:4px}
.sec-sub{color:var(--sub);font-size:14px;margin-bottom:16px}
.card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:20px;backdrop-filter:blur(6px)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.item{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px}
.item .ic{font-size:22px}
.item b{display:block;margin:6px 0 4px;font-size:15px}
.item span{font-size:13px;color:var(--sub);line-height:1.5}
.skill{margin:12px 0}
.skill .lbl{display:flex;justify-content:space-between;font-size:14px;margin-bottom:6px}
.bar{height:12px;background:rgba(127,127,127,.18);border-radius:999px;overflow:hidden}
.fill{height:100%;width:0;border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width 1.2s ease}
.footer{text-align:center;color:var(--sub);font-size:12px;margin-top:46px;line-height:1.7}
.coming{text-align:center;padding:30px 20px}
.coming-emoji{font-size:44px;margin-bottom:10px;animation:float 3s ease-in-out infinite}
.coming-title{font-size:19px;font-weight:800;margin-bottom:8px;background:linear-gradient(90deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.coming-text{font-size:14px;color:var(--sub);line-height:1.7}
@media(max-width:560px){.grid2{grid-template-columns:1fr}.hero h1{font-size:24px}}