/* Thành Vinh: Fields of Activity (SVG 1920 reference).
   Isolated from legacy .dc-hhfa styles so old Elementor settings cannot override this layout.
   Elementor dynamic selectors intentionally have higher specificity than these defaults. */
.dc-hhfa--svg,
.dc-hhfa--svg * { box-sizing: border-box; }
.dc-hhfa--svg {
  display: block;
  width: 100%;
  min-width: 0;
  padding: 96px 24px;
  background-color: #F4F7FA;
  color: #34343A;
  isolation: isolate;
}
.dc-hhfa--svg :where(.dc-tvfa__inner) {
  width: 100%;
  max-width: min(100%, var(--dc-tvfa-max-width, 1320px));
  margin-inline: auto;
  min-width: 0;
}
.dc-hhfa--svg :where(.dc-tvfa__header,.dc-tvfa__grid,.dc-tvfa__card,.dc-tvfa__media,.dc-tvfa__content,.dc-tvfa__card-head,.dc-tvfa__description) {
  min-width: 0;
  max-width: 100%;
}
.dc-hhfa--svg :where(.dc-tvfa__eyebrow) {
  display: flex;
  gap: 8px;
  align-items: center;
  color: #C8010A;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.dc-hhfa--svg :where(.dc-tvfa__eyebrow)::before {
  content: '';
  display: block;
  width: 8px;
  height: 8px;
  margin: 0;
  align-self: center;
  flex: 0 0 8px;
  border-radius: 50%;
  background-color: #C8010A;
}
.dc-hhfa--svg :where(.dc-tvfa__heading) {
  margin: 14px 0 0;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.02em;
  color: #0A2056;
  overflow-wrap: anywhere;
}
.dc-hhfa--svg :where(.dc-tvfa__grid) {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 40px;
  margin-top: 60px;
  align-items: stretch;
}
.dc-hhfa--svg :where(.dc-tvfa__card) {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 24px;
  background-color: #fff;
  box-shadow: none;
  transition: box-shadow .35s ease;
}
.dc-hhfa--svg :where(.dc-tvfa__card):hover { box-shadow: 0 12px 32px rgba(8,20,58,.07); }
.dc-hhfa--svg :where(.dc-tvfa__media) {
  position: relative;
  width: 100%;
  height: 380px;
  min-height: 0;
  flex: 0 0 auto;
  padding: 0;
  margin: 0;
  background: #e9eef2;
  overflow: hidden;
}
/* Use a selector stronger than Elementor's `.elementor img { height:auto; max-width:100%; }`.
   The image always fills its own media box; Elementor's responsive height control
   changes the media box, not the media element's natural intrinsic height. */
.dc-hhfa--svg .dc-tvfa__card .dc-tvfa__media > img,
.dc-hhfa--svg .dc-tvfa__card .dc-tvfa__media > picture,
.dc-hhfa--svg .dc-tvfa__card .dc-tvfa__media > picture > img {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: 0;
  object-fit: cover;
  object-position: center center;
  transform: none;
  transition: none;
}
/* No hover zoom: retain the exact image crop and alignment in normal/hover/focus. */
.dc-hhfa--svg .dc-tvfa__card:is(:hover,:focus-within) .dc-tvfa__media img {
  transform: none;
}
.dc-hhfa--svg :where(.dc-tvfa__content) {
  display: flex;
  flex: 1 0 auto;
  flex-direction: column;
  min-height: 289px;
  padding: 32px;
}
.dc-hhfa--svg :where(.dc-tvfa__card-head) {
  display: flex;
  align-items: center;
  gap: 20px;
  min-width: 0;
}
.dc-hhfa--svg :where(.dc-tvfa__icon) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
  border-radius: 16px;
  background-color: #FCEAEA;
  color: #C8010A;
}
.dc-hhfa--svg :where(.dc-tvfa__icon svg,.dc-tvfa__icon i) {
  display: block;
  width: 24px;
  height: 24px;
  font-size: 24px;
  flex: 0 0 auto;
  /* Elementor library SVG icons use their own fill and stroke. */
}
.dc-hhfa--svg :where(svg.dc-tvfa__outline) { fill: none; stroke: currentColor; }
.dc-hhfa--svg :where(.dc-tvfa__card-title) {
  margin: 0;
  font-size: 24px;
  line-height: 1.32;
  font-weight: 700;
  color: #0A2056;
  overflow-wrap: anywhere;
}
.dc-hhfa--svg :where(.dc-tvfa__description) {
  margin: 20px 0 0;
  color: #34343A;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.dc-hhfa--svg :where(.dc-tvfa__description p) { margin: 0; color: inherit; font: inherit; }
.dc-hhfa--svg :where(.dc-tvfa__description p + p) { margin-top: .75em; }
.dc-hhfa--svg :where(.dc-tvfa__description :is(ul,ol)) { padding-inline-start: 1.3em; }
.dc-hhfa--svg :where(.dc-tvfa__description :is(img,iframe,video,svg)) { max-width: 100%; height: auto; }
.dc-hhfa--svg :where(.dc-tvfa__description :is(table,pre,code)) { max-width: 100%; overflow-wrap: anywhere; }
.dc-hhfa--svg :where(.dc-tvfa__description table) { display: block; overflow-x: auto; }
.dc-hhfa--svg :where(.dc-tvfa__cta-wrap) {
  margin-top: auto;
  padding-top: 24px;
}
.dc-hhfa--svg :where(.dc-tvfa__cta),
.dc-hhfa--svg :where(.dc-tvfa__cta:visited) {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 48px;
  max-width: 100%;
  padding: 3px 3px 3px 22px;
  border: 1px solid #080977;
  border-radius: 999px;
  background-color: #080977;
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.25;
  text-decoration: none;
  overflow-wrap: anywhere;
  cursor: pointer;
  transition: background-color .28s ease, border-color .28s ease, color .28s ease, box-shadow .28s ease;
}
.dc-hhfa--svg :where(.dc-tvfa__cta:is(:hover,:focus-visible)) {
  color: #080977;
  border-color: #080977;
  background-color: #fff;
  text-decoration: none;
}
.dc-hhfa--svg :where(.dc-tvfa__cta:focus-visible) { outline: 2px solid currentColor; outline-offset: 3px; }
.dc-hhfa--svg :where(.dc-tvfa__cta-text) { min-width: 0; }
.dc-hhfa--svg :where(.dc-tvfa__cta-circle) {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  flex: 0 0 auto;
  background-color: #fff;
  color: #080977;
  transition: background-color .28s ease, color .28s ease;
}
.dc-hhfa--svg :where(.dc-tvfa__cta:is(:hover,:focus-visible) .dc-tvfa__cta-circle) {
  background-color: #080977;
  color: #fff;
}
.dc-hhfa--svg :where(.dc-tvfa__cta-icon) {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  transition: opacity .25s ease, transform .3s ease;
}
.dc-hhfa--svg :where(.dc-tvfa__cta-icon svg,.dc-tvfa__cta-icon i) {
  display: block;
  width: 20px;
  height: 20px;
  font-size: 20px;
  flex: 0 0 auto;
}
.dc-hhfa--svg :where(.dc-tvfa__cta-icon--hover) { opacity: 0; transform: translateX(-5px); }
.dc-hhfa--svg :where(.dc-tvfa__cta:is(:hover,:focus-visible) .dc-tvfa__cta-icon--normal) { opacity: 0; transform: translate(5px,-5px); }
.dc-hhfa--svg :where(.dc-tvfa__cta:is(:hover,:focus-visible) .dc-tvfa__cta-icon--hover) { opacity: 1; transform: none; }
@media (max-width: 1279px) {
  .dc-hhfa--svg { padding-block: 72px; }
  .dc-hhfa--svg :where(.dc-tvfa__heading) { font-size: clamp(28px, 3vw, 40px); }
  .dc-hhfa--svg :where(.dc-tvfa__eyebrow) { font-size: clamp(20px, 2vw, 28px); }
  .dc-hhfa--svg :where(.dc-tvfa__grid) { gap: 28px; margin-top: 44px; }
  .dc-hhfa--svg :where(.dc-tvfa__media) { height: clamp(240px, 26vw, 380px); }
  .dc-hhfa--svg :where(.dc-tvfa__content) { padding: 26px; }
  .dc-hhfa--svg :where(.dc-tvfa__description) { font-size: 17px; }
  .dc-hhfa--svg :where(.dc-tvfa__card-title) { font-size: 21px; }
}
@media (max-width: 850px) {
  .dc-hhfa--svg :where(.dc-tvfa__grid) { grid-template-columns: minmax(0,1fr); }
  .dc-hhfa--svg :where(.dc-tvfa__media) { height: clamp(260px, 48vw, 430px); }
  .dc-hhfa--svg :where(.dc-tvfa__content) { min-height: 0; }
}
@media (max-width: 767px) {
  .dc-hhfa--svg { padding: 48px 16px 56px; }
  .dc-hhfa--svg :where(.dc-tvfa__eyebrow) { font-size: 18px; }
  .dc-hhfa--svg :where(.dc-tvfa__heading) { font-size: clamp(25px, 6.7vw, 33px); margin-top: 16px; }
  .dc-hhfa--svg :where(.dc-tvfa__grid) { margin-top: 32px; gap: 20px; }
  .dc-hhfa--svg :where(.dc-tvfa__media) { height: clamp(200px, 58vw, 260px); }
  .dc-hhfa--svg :where(.dc-tvfa__content) { padding: 22px; }
  .dc-hhfa--svg :where(.dc-tvfa__card-head) { gap: 14px; }
  .dc-hhfa--svg :where(.dc-tvfa__icon) { width: 50px; height: 50px; border-radius: 14px; }
  .dc-hhfa--svg :where(.dc-tvfa__icon svg,.dc-tvfa__icon i) { width: 22px; height: 22px; font-size: 22px; }
  .dc-hhfa--svg :where(.dc-tvfa__card-title) { font-size: clamp(18px, 4.4vw, 22px); }
  .dc-hhfa--svg :where(.dc-tvfa__description) { font-size: 15px; margin-top: 18px; }
  .dc-hhfa--svg :where(.dc-tvfa__cta-wrap) { padding-top: 24px; }
}
@media (max-width: 359px) {
  .dc-hhfa--svg :where(.dc-tvfa__content) { padding: 18px; }
  .dc-hhfa--svg :where(.dc-tvfa__card-head) { align-items: flex-start; }
}
@media (prefers-reduced-motion:reduce) {
  .dc-hhfa--svg :where(.dc-tvfa__card,.dc-tvfa__cta,.dc-tvfa__cta-circle,.dc-tvfa__cta-icon) { transition: none; }
}
