﻿   /* ===== CSS VARIABLES ===== */
    :root {
      --primary:       #0a2342;
      --primary-light: #143560;
      --accent:        #c8962e;
      --accent-light:  #e8b84b;
      --white:         #ffffff;
      --off-white:     #f7f8fc;
      --text-dark:     #0d1b2a;
      --text-mid:      #3d5168;
      --text-light:    #6b7f96;
      --border:        #dce3ed;
      --shadow-sm:     0 2px 12px rgba(10,35,66,.08);
      --shadow-md:     0 8px 32px rgba(10,35,66,.13);
      --shadow-lg:     0 20px 60px rgba(10,35,66,.18);
      --radius:        12px;
      --transition:    .35s cubic-bezier(.4,0,.2,1);
    }
  /* ===== VISION MISSION ===== */
.fiuguy_tri { display: block; } .fuyfty_tri { /* width: 30%; */ padding: 50px 0; background: linear-gradient(#2361a31a, #ffffff, #2361a31a); } .vision-mission {background: #2361a314;padding: 0 0 23px;background: linear-gradient(to top, #ebeaea, #fff);} .vm-grid {display: grid;grid-template-columns: 1fr 1fr;gap: 1rem;margin-top: 0;width: 100%;/* border-left: 1px solid #c7c7c7; *//* padding-left: 30px; */} .vm-card { /* background: #fff; */ border-radius: 0; padding: 20px; /* border-left: 1px solid #c7c7c7; */ /* box-shadow: var(--shadow-sm); */ transition: all var(--transition); position: relative; overflow: hidden; margin-bottom: 15px; } .vm-card::before { content: ''; } .vm-card:hover {transform: translateY(-4px);box-shadow: var(--shadow-md);/* background: #ffffff; */} .vm-icon { width: 55px; height: 55px; border-radius: 14px; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; background: #ffffff; } .vm-icon i {font-size: 1.5rem;color: #1b4280;} .vm-card h3 {font-size: 22px;font-weight: 500;color: #1b4280;margin-bottom: 6px;} .vm-card p {font-size: 14.3px;line-height: 27px;margin-bottom: 10px;}
/* ===== CORE VALUES ===== */
.values-header p.fesfc_tri { width: 60%; margin: 7px auto 0; color: #249ea3; font-weight: 500; margin-bottom: 35px; text-align: center; margin-top: 15px; } .core-values {/* background-image: url(../images/OurCoreValues.jpg); */padding: 42px 0 55px;background-blend-mode: overlay;background-color: #ffffff6b;/* background-color: #ffffffc4; */background-attachment: fixed;background-size: cover;background-position: top;background-repeat: no-repeat;position: relative; overflow: hidden;} .values-header {/* display: flex; *//* flex-direction: row-reverse; *//* width: 66%; *//* gap: 18px; */margin-bottom: 23px;} .values-header .divider { margin: 1.25rem auto; } .values-header .section-desc { margin: 0 auto; } .values-grid {display: flex;flex-wrap: wrap;gap: 18px;justify-content: center;} .value-card { width: 29%; } .valuecard_tri { border-radius: 7px; padding: 20px 15px 25px; /* background: #f7f8fc; */ /* border: 1px solid #dce3ed; */ transition: all var(--transition); cursor: default; width: 100%; text-align: center; box-shadow: 0 2px 3px #00000042; } .values-header .valuecard_tri { width: 50%; } .value-card:nth-child(1) .valuecard_tri {background: #F7F3D7;color: #b97a09;} .value-card:nth-child(2) .valuecard_tri {background: #fee7eb; color: #a90000;} .value-card:nth-child(3) .valuecard_tri {background: #CDE9F6; color: #00577f;} .value-card:nth-child(4) .valuecard_tri {background: #daf1e9; color: #00892c;} .value-card:nth-child(5) .valuecard_tri {background: #ece2fd; color: #472978;} .valuecard_tri:hover {/* background: #1b4280; *//* border-color: #0a2342; */transform: translateY(-5px);box-shadow: var(--shadow-md);} .valuecard_tri:hover .v-icon {background: #ffffff73;} .valuecard_tri:hover .v-icon i {color: #1b4280;} .valuecard_tri:hover h4 {/* color: var(--white); */} .valuecard_tri:hover p {/* color: rgba(255,255,255,.7); */} .v-icon { width: 52px; height: 52px; background: #ffffff; border-radius: 50px; display: flex; align-items: center; justify-content: center; transition: var(--transition); margin: 0 auto 12px; /* position: relative; */ /* left: -5px; */ overflow: hidden; padding: 6px; box-shadow: 2px 2px #0000003b; } .v-icon i {font-size: 1.3rem;color: #0a2342;transition: var(--transition);} .valuecard_tri h4 {font-size: 16px;font-weight: 600;/* color: #1b4280; */margin-bottom: 4px;transition: var(--transition);} .valuecard_tri p {line-height: 25px;transition: var(--transition);font-size: 13px;line-height: 25px;margin-bottom: 0;color: #181818;} p.section-label.thuygbuy_tri { color: #249ea3; font-weight: 500; margin-bottom: 35px; text-align: center; margin-top: 15px; } @media screen and (max-width: 991px) { .fuyfty_tri { width: 100%; padding-right: 0; padding-top: 20px; } .fiuguy_tri { display: flex; flex-direction: column; } .vm-grid { grid-template-columns: auto; width: 100%; } .value-card { width: 100%; } } span.efiug_tri { display: block; } img.rgfguygt_tri { animation: gradient1 3s ease infinite, rocking 3s ease infinite; } img.uygt_tri { animation: gradient1 3s ease infinite, rocking 3s ease infinite; width: 100%; } img.rgfguygt_tri { width: 100%; /* position: relative; */ /* left: 12px; */ }
 /* ── LAYOUT ── */
.section.rgiutghy_tri .section-grid {display: grid;grid-template-columns: 65% 1fr;gap: 1px;align-items: center;}
.section.rgygu_tri .section-grid {display: grid;grid-template-columns: 1fr 2fr;gap: 56px;align-items: center;}
.section-grid.reverse .text-col { order: 2; }
.section-grid.reverse .img-col  { order: 1; }
/* ── TEXT COLUMN ── */
.text-col {position: relative;/* width: 100%; */padding-right: 30px;}
.accent-bar {position: absolute;left: -16px;top: 0;bottom: 0;width: 4px;border-radius: 4px;display: none;}
.accent-bar.blue  { background: linear-gradient(to bottom, #1a73e8, #60a5fa); }
.accent-bar.green { background: linear-gradient(to bottom, #34a853, #6ee7b7); }
.text-inner {padding-left: 0;position: relative;margin-bottom: 50px;}
.section-badge { display: inline-flex; padding: 4px 12px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 16px; border: 1px solid; }
.section-badge.blue  { background: #e8f0fe; color: #1a47a1; border-color: #c2d3f5; }
.section-badge.green { background: #e6f4ea; color: #1a6633; border-color: #b2d9be; }
.section-title {  position: relative;font-size: 21px;font-weight: 600;line-height: 1.25;margin-bottom: 20px;padding-left: 62px;margin-bottom: 8px;transition: all 500ms ease;}
.section-para {color: var(--muted);font-size: 13px;line-height: 28px;margin-bottom: 8px;}
/* ── IMAGE COLUMN ── */
.img-col {position: relative;border-radius: 16px;overflow: hidden;/* box-shadow: 0 20px 40px -8px rgba(0,0,0,0.15); *//* aspect-ratio: 4/3; *//* width: 61%; */}
.img-col img { width: 100%; height: 100%; object-fit: cover; display: block; }
.img-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(13,30,60,0.35), transparent); }
.img-card { position: absolute; bottom: 16px; left: 16px; right: 16px; display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 12px; background: rgba(255,255,255,0.92); backdrop-filter: blur(8px); box-shadow: 0 4px 12px rgba(0,0,0,0.10); }
.img-card-label { font-size: 13px; font-weight: 700; color: var(--text); }
.img-card-sub { font-size: 12px; color: var(--muted); }
img.ftyggfty_tri { width: 40px; } .fuyfty_tri h2.section-title:before { content: ""; position: absolute; width: 40px; height: 2px; left: 0; top: 15px; transition: all 500ms ease; background: #249ea3; } .text-inner:hover h2.section-title { padding-left: 0; color: #249ea3; } .text-inner:hover h2.section-title:before { width: 0; } @media (max-width: 767.98px) { .section.rgiutghy_tri .section-grid { display: block; grid-template-columns: unset; } }