/* ==========================================================================
   INFO BOX GRID / CONTACT SECTION - PURE BEM STANDARD
   ========================================================================== */

.site-lienhe {
    padding-top: clamp(120px, 12vw, 150px);
    background-color: transparent;
}

.info-box-grid {
    padding: 20px 0 80px 0;
    background-color: transparent;
}

.info-box-grid__container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}

.info-box-grid__header {
    text-align: center;
}

.info-box-grid__header h1 {
    color: var(--text-dark, #2B2B2B);
    letter-spacing: 2px;
    margin-bottom: 0;
}

/* BỐ CỤC 2 CỘT PHẲNG DẸT */
.info-box-grid__row {
    display: flex;
    gap: 50px;
    margin-top: 50px;
}

.info-box-grid__col-left,
.info-box-grid__col-right {
    flex: 1;
}

/* --- CỘT TRÁI: HỘP THÔNG TIN --- */
.info-box-grid__box {
    border: 1px solid #777777;
    padding: 50px;
    background-color: var(--color-primary, #ffffff);
    color: var(--text-dark, #2B2B2B);
    text-align: left;
    height: 100%;
    box-sizing: border-box;
    border-radius: 0 !important;
}

.info-box-grid__box h3 {
    margin-bottom: 35px;
}

/* DANH SÁCH THÔNG TIN */
.info-box-grid__list {
    list-style: none;
    padding: 0;
    margin: 0 0 45px 0;
}

.info-box-grid__item {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 25px;
    color: var(--text-dark, #777777); /* Cấp màu ở thẻ cha thay vì gọi class trực tiếp vào thẻ span */
}

/* Căn chỉnh màu liên kết kế thừa từ thẻ cha */
.info-box-grid__item a {
    color: inherit;
    text-decoration: none;
    transition: var(--transition-base, all 0.3s ease);
}

.info-box-grid__item a:hover {
    color: var(--color-accent, #4B5E40);
}

/* ICON VECTOR SVG NHÚNG MÃ HÓA */
.info-box-grid__icon {
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: inline-block;
    flex-shrink: 0;
}

.icon-phone {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M6.62 10.79a15.15 15.15 0 006.59 6.59l2.2-2.2a1 1 0 011.11-.27 11.72 11.72 0 003.7 1.18 1 1 0 01.88 1V21a1 1 0 01-1 1A19 19 0 012 3a1 1 0 011-1h3.5a1 1 0 011 .88 11.72 11.72 0 001.18 3.7 1 1 0 01-.27 1.1l-2.2 2.2z'/%3E%3C/svg%3E");
}

.icon-clock {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67z'/%3E%3C/svg%3E");
}

.icon-mail {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z'/%3E%3C/svg%3E");
}

/* NÚT LIÊN KẾT MXH DẠNG TRÒN */
.info-box-grid__social {
    border-top: 1px solid #E2E2E2;
    padding-top: 30px;
}

.info-box-grid__social h4 {
    margin-bottom: 20px;
    color: var(--text-dark, #2B2B2B);
}

.info-box-grid__social-row {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.info-box-grid__social-icon {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1px solid #cccccc;
    background-size: 18px;
    background-repeat: no-repeat;
    background-position: center;
    transition: var(--transition-base, all 0.3s ease);
    display: inline-block;
}

.info-box-grid__social-icon:hover {
    border-color: var(--color-accent, #4B5E40);
    background-color: rgba(75, 94, 64, 0.1);
    transform: translateY(-2px);
}

/* SVG MXH */
.icon-ig {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23666666'%3E%3Cpath d='M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zM12 0C8.741 0 8.333.014 7.053.072 2.695.272.273 2.69.073 7.051.014 8.333 0 8.741 0 12c0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 100 12.324 6.162 6.162 0 000-12.324zM12 16a4.162 4.162 0 110-8.324A4.162 4.162 0 0112 16zm6.406-11.845a1.44 1.44 0 100 2.881 1.44 1.44 0 000-2.881z'/%3E%3C/svg%3E");
}

.icon-fb {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23666666'%3E%3Cpath d='M22 12c0-5.52-4.48-10-10-10S2 6.48 2 12c0 4.84 3.44 8.87 8 9.8V15H8v-3h2V9.5C10 7.57 11.57 6 13.5 6H16v3h-2c-.55 0-1 .45-1 1v2h3v3h-3v6.95c4.56-.93 8-4.96 8-9.75z'/%3E%3C/svg%3E");
}

.icon-threads {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23666666'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1.46 13.14c-.66.09-1.32-.23-1.63-.82l-.12-.22a3.832 3.832 0 01-.65.26c-.34.09-.7.13-1.06.13-.88 0-1.62-.28-2.11-.8-.44-.48-.67-1.14-.67-1.92 0-.82.26-1.5.76-2 .54-.53 1.3-.81 2.18-.81.65 0 1.25.12 1.74.34l.11-1.1c-.03-.31.29-.53.6-.5.31.03.53.29.5.6l-.37 3.7c-.11 1.07.18 1.49.52 1.49.33 0 .54-.3.57-1 .09-.94.01-1.89-.25-2.8a5.952 5.952 0 00-4.04-4.14c-.81-.25-1.65-.33-2.5-.22-.3.04-.57-.17-.61-.47-.04-.3.17-.57.47-.61.99-.13 1.99-.04 2.95.25.96.29 1.83.84 2.51 1.58.55.6 1.01 1.34 1.34 2.16.29.73.45 1.52.46 2.31 0 1.51-.76 2.39-1.81 2.39-.41.01-.81-.13-1.11-.4zm-3.08-4.22c-.41 0-.74.12-.96.34-.23.23-.34.56-.34.92 0 .39.1.72.31.91.21.19.55.29.95.29.23 0 .46-.04.68-.13.23-.09.43-.22.61-.39l.11-1.1c-.26-.11-.58-.17-.89-.17h-.47z'/%3E%3C/svg%3E");
}

.icon-yt {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23666666'%3E%3Cpath d='M23.498 6.163a3.003 3.003 0 00-2.11-2.11C19.517 3.545 12 3.545 12 3.545s-7.517 0-9.388.508a3.003 3.003 0 00-2.11 2.11C0 8.033 0 12 0 12s0 3.967.502 5.837a3.003 3.003 0 002.11 2.11c1.871.508 9.388.508 9.388.508s7.517 0 9.388-.508a3.003 3.003 0 002.11-2.11C24 15.967 24 12 24 12s0-3.967-.502-5.837zM9.545 15.568V8.432L15.818 12l-6.273 3.568z'/%3E%3C/svg%3E");
}

.icon-tiktok {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23666666'%3E%3Cpath d='M12.525.02c1.31-.02 2.61-.01 3.91-.01.08 1.53.63 3.02 1.59 4.17.94 1.13 2.27 1.9 3.73 2.19v3.83c-1.63-.05-3.2-.62-4.51-1.63-.26-.2-.5-.42-.72-.66v5.89c0 2.3-.92 4.43-2.58 6.01-1.67 1.59-3.92 2.37-6.22 2.18-2.61-.22-4.9-1.89-5.91-4.29-1.01-2.4-.48-5.2 1.34-7.05 1.63-1.66 4.02-2.31 6.27-1.68v3.89c-.93-.32-1.97-.1-2.68.58-.69.69-.9 1.77-.52 2.66.38.88 1.28 1.41 2.24 1.31 1.05-.11 1.81-1.02 1.81-2.08V0c-.01.01-.01.01 0 .02z'/%3E%3C/svg%3E");
}

/* --- CỘT PHẢI: HỘP ĐỊA CHỈ & BẢN ĐỒ --- */
.info-box-grid__address-card {
    border: 1px solid #777777;
    padding: 30px 40px;
    background-color: var(--color-primary, #ffffff);
    text-align: left;
    margin-bottom: 30px;
    box-sizing: border-box;
    border-radius: 0 !important;
}

.info-box-grid__address-card h3 {
    color: var(--text-dark, #2B2B2B);
    margin-bottom: 20px;
}

.info-box-grid__address-row {
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

.info-box-grid__address-pin {
    width: 22px;
    height: 22px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5a2.5 2.5 0 010-5 2.5 2.5 0 010 5z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: inline-block;
    flex-shrink: 0;
    margin-top: 3px;
}

.info-box-grid__address-card p {
    color: var(--text-dark, #777777);
    margin: 0;
    line-height: 1.5;
}

/* GOOGLE MAPS WRAPPER */
.info-box-grid__map-wrapper {
    border: 1px solid #777777;
    padding: 30px 40px;
    background-color: var(--color-primary, #ffffff);
    text-align: left;
    box-sizing: border-box;
    border-radius: 0 !important;
}

.info-box-grid__map-wrapper h3 {
    color: var(--text-dark, #2B2B2B);
    margin-bottom: 20px;
}

.info-box-grid__map-container {
    width: 100%;
    overflow: hidden;
}

.info-box-grid__map-container iframe {
    display: block;
    width: 100%;
}