/* Thịnh Phát Core Values – isolated styles */
.tpvc-section {
    --tpvc-navy: #0b2d5b;
    --tpvc-orange: #f39812;
    --tpvc-text: #152f55;
    --tpvc-muted: #28364a;
    width: 100%;
    padding: 34px 18px 42px;
    background: #fff;
    color: var(--tpvc-text);
    font-family: "Be Vietnam Pro", Arial, sans-serif;
    overflow: hidden;
}
.tpvc-section * { box-sizing: border-box; }
.tpvc-container { width: 100%; max-width: 1180px; margin: 0 auto; }
.tpvc-heading { text-align: center; margin: 0 auto 28px; }
.tpvc-title-row {
    display: flex; align-items: center; justify-content: center;
    gap: 22px;
}
.tpvc-title-row h2 {
    margin: 0; padding: 0; color: var(--tpvc-navy);
    font-size: clamp(25px, 3vw, 38px); line-height: 1.18;
    font-weight: 800; letter-spacing: .1px;
}
.tpvc-title-line {
    display: block; width: 48px; height: 4px;
    border-radius: 10px; background: var(--tpvc-orange);
}
.tpvc-heading > p {
    margin: 7px 0 0; color: #34445e;
    font-size: clamp(14px, 1.5vw, 20px); line-height: 1.5;
}
.tpvc-grid {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px 26px;
}
.tpvc-card {
    --tpvc-x: 0deg; --tpvc-y: 0deg;
    min-height: 142px; position: relative; isolation: isolate;
    display: grid; grid-template-columns: 150px 5px minmax(0, 1fr);
    align-items: center; gap: 24px;
    padding: 20px 24px;
    background: #fff; border: 1px solid #e5e8ed;
    border-radius: 17px;
    box-shadow: 0 4px 12px rgba(10, 35, 70, .055);
    transform: perspective(900px) rotateX(var(--tpvc-x)) rotateY(var(--tpvc-y));
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
    overflow: hidden;
}
.tpvc-card:hover {
    transform: perspective(900px) rotateX(var(--tpvc-x)) rotateY(var(--tpvc-y)) translateY(-6px);
    border-color: rgba(243, 152, 18, .52);
    box-shadow: 0 15px 32px rgba(10, 35, 70, .13);
}
.tpvc-icon-wrap {
    width: 100%; min-height: 94px;
    display: flex; align-items: center; justify-content: center;
    color: var(--tpvc-navy);
    transform: translateZ(18px);
    transition: transform .35s cubic-bezier(.2,.75,.25,1), color .3s ease;
}
.tpvc-svg { width: 92px; height: 92px; display: block; fill: none; stroke: currentColor; stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; overflow: visible; }
.tpvc-svg-handshake { width: 100px; height: 100px; }
.tpvc-svg-box { color: var(--tpvc-orange); }
.tpvc-svg .tpvc-icon-accent { fill: var(--tpvc-orange); stroke: var(--tpvc-orange); }
.tpvc-svg .tpvc-icon-accent-line { stroke: #fff; stroke-width: 1.5; }
.tpvc-card:hover .tpvc-icon-wrap { transform: translateY(-3px) translateZ(28px) scale(1.09) rotate(-3deg); color: var(--tpvc-orange); }
.tpvc-card:hover .tpvc-svg-box { color: var(--tpvc-navy); }
.tpvc-card-divider {
    display: block; width: 5px; height: 82px;
    border-radius: 8px; background: var(--tpvc-orange);
    transition: height .3s ease, box-shadow .3s ease;
}
.tpvc-card:hover .tpvc-card-divider { height: 96px; box-shadow: 0 0 13px rgba(243, 152, 18, .32); }
.tpvc-card-content { position: relative; z-index: 1; transform: translateZ(12px); }
.tpvc-card-content h3 {
    margin: 0 0 5px; color: var(--tpvc-navy);
    font-size: clamp(17px, 1.55vw, 23px); font-weight: 800;
    line-height: 1.25; letter-spacing: .1px;
}
.tpvc-card-content p {
    margin: 0; color: #29384e;
    font-size: clamp(13px, 1.2vw, 17px); line-height: 1.55;
}
.tpvc-card-glow {
    position: absolute; z-index: -1; width: 170px; height: 170px;
    right: -95px; top: -105px; border-radius: 50%;
    background: radial-gradient(circle, rgba(243,152,18,.13), rgba(243,152,18,0) 68%);
    opacity: 0; transform: scale(.7);
    transition: opacity .35s ease, transform .45s ease;
    pointer-events: none;
}
.tpvc-card:hover .tpvc-card-glow { opacity: 1; transform: scale(1.4); }
.tpvc-section.tpvc-js .tpvc-reveal {
    opacity: 0; transform: translateY(18px);
    transition: opacity .6s ease, transform .6s cubic-bezier(.2,.7,.2,1);
    transition-delay: var(--tpvc-delay, 0ms);
}
.tpvc-section.tpvc-js .tpvc-reveal.tpvc-visible { opacity: 1; transform: translateY(0); }
@media (max-width: 820px) {
    .tpvc-card { grid-template-columns: 110px 4px minmax(0,1fr); gap: 18px; padding: 18px; min-height: 130px; }
    .tpvc-svg { width: 78px; height: 78px; }
    .tpvc-svg-handshake { width: 86px; height: 86px; }
}
@media (max-width: 600px) {
    .tpvc-section { padding: 28px 13px 32px; }
    .tpvc-heading { margin-bottom: 20px; }
    .tpvc-title-row { gap: 10px; }
    .tpvc-title-line { width: 25px; height: 3px; }
    .tpvc-title-row h2 { font-size: 24px; }
    .tpvc-heading > p { font-size: 13px; }
    .tpvc-grid { grid-template-columns: 1fr; gap: 12px; }
    .tpvc-card { grid-template-columns: 76px 4px minmax(0,1fr); gap: 13px; min-height: 112px; padding: 13px 12px; border-radius: 13px; }
    .tpvc-icon-wrap { min-height: 70px; }
    .tpvc-svg { width: 62px; height: 62px; }
    .tpvc-svg-handshake { width: 68px; height: 68px; }
    .tpvc-card-divider { height: 66px; }
    .tpvc-card:hover .tpvc-card-divider { height: 78px; }
    .tpvc-card-content h3 { font-size: 15px; margin-bottom: 4px; }
    .tpvc-card-content p { font-size: 12px; line-height: 1.45; }
}
@media (prefers-reduced-motion: reduce) {
    .tpvc-section *, .tpvc-section *::before, .tpvc-section *::after {
        animation: none !important; transition: none !important; scroll-behavior: auto !important;
    }
    .tpvc-section.tpvc-js .tpvc-reveal { opacity:  1; transform: none; }
}
