/* ==========================================================================
   LifeTree 生命树 — brand layer
   Palette taken from the source deck:
     accent green  #00C06A   (hero gradient / highlights)
     deep green    #296B29   (headings, section labels)
     ink           #222222   (body copy)
     mist          #F4F8F4   (alternating section background)
   ========================================================================== */

:root {
  --lt-green:       #00C06A;
  --lt-green-dark:  #009653;
  --lt-forest:      #296B29;
  --lt-forest-deep: #1C4A1C;
  --lt-ink:         #222222;
  --lt-muted:       #5D6660;
  --lt-mist:        #F4F8F4;
  --lt-line:        #E2EAE3;
}

/* ---------- Typography ------------------------------------------------- */

body,
.container-wrap,
#header-outer .sf-menu > li > a,
#footer-outer {
  font-family: "Noto Sans SC", "PingFang SC", "Hiragino Sans GB",
               "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

body { color: var(--lt-ink); font-size: 16px; line-height: 1.85; }

h1, h2, h3, h4, h5, h6 {
  font-family: "Noto Sans SC", "PingFang SC", "Hiragino Sans GB",
               "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: var(--lt-forest-deep);
  letter-spacing: .01em;
  line-height: 1.4;
}

/* Chinese text needs a touch more air between characters than Latin. */
.lt-body p, .wpb_text_column p { letter-spacing: .015em; }

/* ---------- Section furniture ----------------------------------------- */

/* The deck's recurring "➜ 标题" section label. */
.lt-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 15px;
  font-weight: 700;
  color: var(--lt-forest);
  margin: 0 0 6px;
  letter-spacing: .06em;
}
.lt-eyebrow::before {
  content: "";
  width: 22px; height: 22px;
  flex: 0 0 22px;
  border-radius: 50%;
  background: var(--lt-forest) url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h13M13 6l6 6-6 6'/%3E%3C/svg%3E") center/13px 13px no-repeat;
}

/* Big green statement heading, as used across the deck. */
.lt-h-green { color: var(--lt-green) !important; font-weight: 900; }
.lt-h-forest { color: var(--lt-forest) !important; font-weight: 900; }

.lt-lead {
  font-size: 18px;
  line-height: 1.95;
  color: #3A423C;
  max-width: 1000px;
}
.lt-lead-center { margin-left: auto; margin-right: auto; text-align: center; }

.lt-note {
  font-size: 13px;
  color: #8A938C;
  font-style: normal;
}

.lt-rule {
  width: 64px; height: 4px; border-radius: 4px;
  background: linear-gradient(90deg, var(--lt-green), var(--lt-forest));
  margin: 18px 0 26px;
}
.lt-rule-center { margin-left: auto; margin-right: auto; }

/* ---------- Hero ------------------------------------------------------- */

.lt-hero .lt-hero-kicker {
  font-size: 17px; letter-spacing: .38em; color: rgba(255,255,255,.82);
  text-transform: uppercase; margin-bottom: 26px; font-weight: 400;
}
.lt-hero h1 {
  color: #fff !important;
  font-size: 62px; font-weight: 900; line-height: 1.22;
  margin: 0 0 14px; text-shadow: 0 2px 30px rgba(0,0,0,.35);
}
.lt-hero .lt-hero-sub {
  color: rgba(255,255,255,.92); font-size: 21px; letter-spacing: .16em; margin-bottom: 10px;
}
.lt-hero .lt-hero-tag {
  display: inline-block;
  color: #fff; font-size: 30px; font-weight: 900; letter-spacing: .04em;
  background: linear-gradient(90deg, var(--lt-green), #00E07E);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: none;
}

/* ---------- Cards ------------------------------------------------------ */

.lt-card {
  background: #fff;
  border: 1px solid var(--lt-line);
  border-radius: 14px;
  padding: 34px 30px;
  height: 100%;
  transition: transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s, border-color .35s;
}
.lt-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 44px rgba(29,74,29,.13);
  border-color: rgba(0,192,106,.45);
}
.lt-card h3 { font-size: 21px; margin: 0 0 12px; color: var(--lt-forest); }
.lt-card p  { font-size: 15.5px; color: var(--lt-muted); margin: 0; }

.lt-card-num {
  display: block;
  font-size: 13px; font-weight: 700; letter-spacing: .16em;
  color: var(--lt-green); margin-bottom: 14px;
}

/* Numbered pillar card with a tinted top edge. */
.lt-card-accent { border-top: 4px solid var(--lt-green); }

/* ---------- Icon/stat blocks ------------------------------------------ */

.lt-stat { text-align: center; padding: 10px 8px; }
.lt-stat .lt-stat-n {
  font-size: 40px; font-weight: 900; color: var(--lt-green); line-height: 1.1;
}
.lt-stat .lt-stat-l { font-size: 15px; color: var(--lt-muted); margin-top: 6px; }

/* ---------- Product cards --------------------------------------------- */

.lt-product {
  background: #fff;
  border: 1px solid var(--lt-line);
  border-radius: 14px;
  padding: 26px 24px 30px;
  height: 100%;
  text-align: center;
  transition: transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s;
}
.lt-product:hover { transform: translateY(-6px); box-shadow: 0 18px 44px rgba(29,74,29,.13); }
.lt-product img {
  height: 190px; width: auto; object-fit: contain; margin: 0 auto 18px; display: block;
}
.lt-product h3 { font-size: 18px; color: var(--lt-forest); margin: 0 0 6px; }
.lt-product .lt-product-sub {
  font-size: 15px; font-weight: 700; color: var(--lt-ink); margin: 0 0 14px;
}
.lt-product ul { text-align: left; margin: 0; padding-left: 18px; }
.lt-product li { font-size: 14.5px; color: var(--lt-muted); margin-bottom: 7px; line-height: 1.7; }

/* ---------- Bullet list with green ticks ------------------------------- */

.lt-ticks { list-style: none; margin: 0; padding: 0; }
.lt-ticks li {
  position: relative;
  padding-left: 30px;
  margin-bottom: 13px;
  font-size: 16px;
  color: #3A423C;
  line-height: 1.75;
}
.lt-ticks li::before {
  content: "";
  position: absolute; left: 0; top: .48em;
  width: 16px; height: 16px; border-radius: 50%;
  background: rgba(0,192,106,.14);
  box-shadow: inset 0 0 0 2px var(--lt-green);
}
.lt-ticks li::after {
  content: "";
  position: absolute; left: 5px; top: .72em;
  width: 6px; height: 3px;
  border-left: 2px solid var(--lt-green);
  border-bottom: 2px solid var(--lt-green);
  transform: rotate(-45deg);
}

/* ---------- Process / supply-chain chain ------------------------------- */

.lt-chain { display: flex; flex-wrap: wrap; gap: 14px; align-items: stretch; }
.lt-chain-step {
  flex: 1 1 0;
  min-width: 128px;
  background: #fff;
  border: 1px solid var(--lt-line);
  border-radius: 12px;
  padding: 22px 14px;
  text-align: center;
  position: relative;
}
.lt-chain-step .n {
  display: block; font-size: 12px; font-weight: 700; letter-spacing: .12em;
  color: var(--lt-green); margin-bottom: 8px;
}
.lt-chain-step .t { font-size: 15.5px; font-weight: 700; color: var(--lt-forest); }
.lt-chain-step:not(:last-child)::after {
  content: "";
  position: absolute; right: -12px; top: 50%;
  width: 10px; height: 10px;
  border-top: 2px solid var(--lt-green);
  border-right: 2px solid var(--lt-green);
  transform: translateY(-50%) rotate(45deg);
}
@media only screen and (max-width: 690px) {
  .lt-chain-step { flex: 1 1 100%; }
  .lt-chain-step:not(:last-child)::after {
    right: 50%; top: auto; bottom: -12px;
    transform: translateX(50%) rotate(135deg);
  }
}

/* ---------- Timeline (development strategy) ---------------------------- */

.lt-phase {
  background: #fff;
  border: 1px solid var(--lt-line);
  border-left: 4px solid var(--lt-green);
  border-radius: 12px;
  padding: 30px 32px;
  height: 100%;
}
.lt-phase .lt-phase-n {
  font-size: 44px; font-weight: 900; color: rgba(0,192,106,.24); line-height: 1; display: block;
}
.lt-phase h3 { font-size: 20px; margin: 8px 0 14px; color: var(--lt-forest); }

/* ---------- Currency / payment chips ----------------------------------- */

.lt-chips { display: flex; flex-wrap: wrap; gap: 9px; margin: 0; padding: 0; list-style: none; }
.lt-chips li {
  background: #fff;
  border: 1px solid var(--lt-line);
  border-radius: 999px;
  padding: 8px 17px;
  font-size: 14.5px;
  color: var(--lt-forest);
  font-weight: 500;
}

/* ---------- Region / office grid --------------------------------------- */

.lt-region {
  background: #fff; border: 1px solid var(--lt-line); border-radius: 14px;
  padding: 28px 26px; height: 100%;
}
.lt-region .lt-region-label {
  font-size: 13px; font-weight: 700; letter-spacing: .14em;
  color: var(--lt-green); margin-bottom: 12px;
}
.lt-region h3 { font-size: 19px; margin: 0 0 8px; }

.lt-region p { font-size: 15px; color: var(--lt-muted); margin: 0; }

/* ---------- Salient overrides ------------------------------------------ */

.nectar-button.regular,
.nectar-button.accent-color { border-radius: 6px !important; font-weight: 700 !important; }

#header-outer .sf-menu > li > a { font-size: 15px; font-weight: 500; }

/* Deck-matching section rhythm. */
.lt-section { padding-top: 96px; padding-bottom: 96px; }

/* Alternating tint is set with the row's own bg_color param (#F4F8F4), NOT a
   class. Salient only stretches a colour across the viewport when it comes
   from bg_color — it paints the full-bleed .row-bg layer. A CSS class lands on
   the container-width .vc_row instead, so the band stops short of both edges
   and reads as a floating block. Setting it via the param also keeps the
   colour editable in the builder's row settings. */

/* ---------- Footer ------------------------------------------------------ */

#footer-outer { background-color: #16321B; }
#footer-outer p, #footer-outer li, #footer-outer a { color: rgba(255,255,255,.72); font-size: 14.5px; }
#footer-outer a:hover { color: var(--lt-green); }
#footer-outer[data-full-width="true"] .row { padding-left: 0; padding-right: 0; }

/* CJK has no spaces, so the default break-anywhere behaviour splits words like
   马来西亚 across lines. keep-all confines breaks to punctuation and spaces. */
#footer-outer { word-break: keep-all; }
#footer-outer .nb { white-space: nowrap; }

#footer-outer .widget h4 {
  color: #fff;
  font-size: 15px;
  letter-spacing: .08em;
  margin-bottom: 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,.14);
}

/* Brand column.
   !important because Salient normalises images inside widget areas too — the
   same rule that beat the card image sizing further up this file. */
.lt-footer-logo {
  width: 128px !important;
  max-width: 128px !important;
  height: auto !important;
  display: block;
  margin: 0 0 16px;
}
.lt-footer-en   { color: rgba(255,255,255,.55) !important; font-size: 13.5px !important; margin-bottom: 14px; }
.lt-footer-tag  { line-height: 1.9; }

/* Navigation column — the site's 1.85 body line-height made this column
   noticeably taller than its neighbours. */
.lt-footer-nav { margin: 0; padding: 0; }
.lt-footer-nav li { list-style: none; margin-bottom: 0; line-height: 1.5; }
.lt-footer-nav li a { display: block; padding: 5px 0; }

/* Contact column — label above value, so no line runs long enough to wrap. */
.lt-footer-contact { margin: 0 0 18px; padding: 0; }
.lt-footer-contact li { list-style: none; margin-bottom: 15px; line-height: 1.65; }
.lt-footer-contact .k {
  display: block;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--lt-green);
  margin-bottom: 3px;
}
.lt-footer-contact .v { display: block; color: rgba(255,255,255,.78); }
.lt-footer-reach {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.12);
  line-height: 1.9;
}
.lt-footer-reach a { color: rgba(255,255,255,.88) !important; }

#copyright { background-color: #0F2414; border-top: 1px solid rgba(255,255,255,.08); }
#copyright p { color: rgba(255,255,255,.5); font-size: 13.5px; }

@media only screen and (max-width: 999px) {
  #footer-outer .widget h4 { margin-bottom: 16px; }
  .lt-footer-logo { width: 118px; }
}

/* ---------- Responsive -------------------------------------------------- */

@media only screen and (max-width: 999px) {
  .lt-hero h1 { font-size: 42px; }
  .lt-hero .lt-hero-tag { font-size: 23px; }
  .lt-section { padding-top: 68px; padding-bottom: 68px; }
}
@media only screen and (max-width: 690px) {
  body { font-size: 15.5px; }
  .lt-hero h1 { font-size: 31px; }
  .lt-hero .lt-hero-sub { font-size: 17px; }
  .lt-hero .lt-hero-tag { font-size: 19px; }
  .lt-lead { font-size: 16px; }
  .lt-card, .lt-region, .lt-phase { padding: 26px 22px; }
  .lt-section { padding-top: 54px; padding-bottom: 54px; }
}

/* ==========================================================================
   Deck-specific patterns
   ========================================================================== */

:root { --lt-lime: #A7D957; }

/* ---------- Hexagon photo tiles (end-to-end supply chain, deck p12) ------ */

.lt-hexrow {
  display: flex; flex-wrap: wrap; gap: 20px;
  justify-content: center; align-items: flex-start;
}
.lt-hexrow > li { list-style: none; flex: 1 1 150px; max-width: 210px; text-align: center; }

.lt-hex {
  position: relative;
  width: 100%; aspect-ratio: 1 / 1.12;
  margin: 0 auto 16px;
  background: var(--lt-lime);
  -webkit-clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
          clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  transition: transform .4s cubic-bezier(.2,.7,.3,1);
}
.lt-hex:hover { transform: translateY(-6px) scale(1.03); }
.lt-hex img {
  position: absolute; inset: 9px;
  width: calc(100% - 18px); height: calc(100% - 18px);
  object-fit: cover;
  -webkit-clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
          clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}
.lt-hexrow .lt-hex-label {
  font-size: 16.5px; font-weight: 700; color: var(--lt-forest-deep);
}

/* The origin → market rail beneath the hexagons. */
.lt-rail {
  display: flex; align-items: center; gap: 14px;
  margin-top: 40px;
}
.lt-rail .lt-rail-cap {
  background: var(--lt-forest); color: #fff;
  font-size: 14.5px; font-weight: 700; letter-spacing: .08em;
  padding: 12px 18px; border-radius: 8px; white-space: nowrap;
}
.lt-rail .lt-rail-line {
  flex: 1; height: 0;
  border-top: 3px dotted rgba(41,107,41,.45);
}
@media only screen and (max-width: 690px) {
  .lt-rail .lt-rail-cap { font-size: 13px; padding: 10px 12px; }
}

/* ---------- Capability list with outlined arrow markers (deck p14) ------- */

.lt-cap { margin: 0 0 34px; }
.lt-cap h3 {
  display: flex; align-items: center; gap: 12px;
  font-size: 20px; color: var(--lt-forest); margin: 0 0 8px;
}
.lt-cap h3::before {
  content: "";
  flex: 0 0 30px; width: 30px; height: 21px;
  border: 2px solid var(--lt-lime); border-radius: 999px;
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2372A62E' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/15px 15px no-repeat;
}
.lt-cap p { margin: 0 0 0 42px; font-size: 16px; color: var(--lt-muted); }

/* ---------- Vertical phase timeline (deck p15) -------------------------- */

.lt-timeline { position: relative; padding-left: 62px; margin: 0; }
.lt-timeline::before {
  content: ""; position: absolute; left: 21px; top: 12px; bottom: 12px;
  width: 5px; border-radius: 5px; background: var(--lt-lime);
}
.lt-timeline > li { list-style: none; position: relative; margin-bottom: 52px; }
.lt-timeline > li:last-child { margin-bottom: 0; }
.lt-timeline > li::before {
  content: attr(data-step);
  position: absolute; left: -62px; top: 0;
  width: 48px; height: 48px; border-radius: 50%;
  background: var(--lt-forest); color: #fff;
  font-size: 17px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.lt-timeline h3 { font-size: 22px; color: var(--lt-forest); margin: 8px 0 14px; }
.lt-timeline ul { margin: 0; padding-left: 20px; }
.lt-timeline li li { font-size: 16.5px; color: #3A423C; margin-bottom: 9px; }
@media only screen and (max-width: 690px) {
  .lt-timeline { padding-left: 52px; }
  .lt-timeline::before { left: 17px; }
  .lt-timeline > li::before { left: -52px; width: 40px; height: 40px; font-size: 15px; }
  .lt-timeline h3 { font-size: 19px; }
}

/* ---------- Business-model layers (deck p13) ---------------------------- */

.lt-layer {
  background: #fff; border: 1px solid var(--lt-line); border-radius: 14px;
  padding: 30px 28px; height: 100%; position: relative; overflow: hidden;
}
.lt-layer::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px;
  background: linear-gradient(180deg, var(--lt-green), var(--lt-lime));
}
.lt-layer .lt-layer-n {
  font-size: 13px; font-weight: 700; letter-spacing: .14em;
  color: var(--lt-green); display: block; margin-bottom: 10px;
}
.lt-layer h3 { font-size: 19px; margin: 0 0 10px; color: var(--lt-forest); }
.lt-layer p { font-size: 15.5px; color: var(--lt-muted); margin: 0; }

/* ---------- Pull quote (deck p2) ---------------------------------------- */

.lt-quote {
  max-width: 880px; margin: 0 auto; text-align: center;
  font-size: 23px; line-height: 1.95; color: var(--lt-forest-deep); font-weight: 500;
}
.lt-quote .lt-quote-mark { color: var(--lt-green); font-weight: 900; }
@media only screen and (max-width: 690px) { .lt-quote { font-size: 18px; } }

/* ---------- Media object (image beside copy) ---------------------------- */

.lt-media-img {
  width: 100%; border-radius: 14px; overflow: hidden;
  box-shadow: 0 16px 44px rgba(28,74,28,.14);
}
.lt-media-img img { display: block; width: 100%; height: auto; }

/* Plain (already-cut-out) artwork — no frame or shadow. */
.lt-cutout img { display: block; width: 100%; height: auto; }

/* ---------- Contact ------------------------------------------------------ */

.lt-contact-block { margin-bottom: 26px; }
.lt-contact-block .lt-contact-label {
  font-size: 13px; font-weight: 700; letter-spacing: .14em;
  color: var(--lt-green); margin-bottom: 6px;
}
.lt-contact-block p { margin: 0; font-size: 16px; color: #3A423C; }

.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"],
.wpcf7 textarea, .wpcf7 select {
  width: 100%; border: 1px solid var(--lt-line) !important;
  border-radius: 8px !important; background: #fff !important;
  padding: 13px 15px !important; font-size: 15.5px !important;
}
.wpcf7 input:focus, .wpcf7 textarea:focus, .wpcf7 select:focus {
  border-color: var(--lt-green) !important;
  box-shadow: 0 0 0 3px rgba(0,192,106,.13) !important;
  outline: none !important;
}
.wpcf7 label { font-size: 14.5px; font-weight: 500; color: var(--lt-forest-deep); }
.wpcf7 input[type="submit"] {
  background: var(--lt-green) !important; color: #fff !important;
  border: 0 !important; border-radius: 8px !important;
  padding: 14px 42px !important; font-size: 16px !important; font-weight: 700 !important;
  cursor: pointer; transition: background .25s;
}
.wpcf7 input[type="submit"]:hover { background: var(--lt-green-dark) !important; }

/* ---------- Page header -------------------------------------------------- */

.lt-page-head { text-align: center; }
.lt-page-head h1 { font-size: 46px; font-weight: 900; margin: 0 0 10px; color: #fff !important; }
.lt-page-head p  { font-size: 18px; color: rgba(255,255,255,.86); margin: 0; }
@media only screen and (max-width: 690px) { .lt-page-head h1 { font-size: 30px; } }

/* ---------- Infrastructure card: photo + green caption (deck p10) -------- */

.lt-infra { height: 100%; }
.lt-infra-media {
  border-radius: 10px 10px 0 0; overflow: hidden; aspect-ratio: 4 / 5;
}
.lt-infra-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lt-infra-cap {
  background: var(--lt-forest); color: #fff;
  padding: 16px 14px; text-align: center;
  border-radius: 0 0 10px 10px;
  font-size: 17px; font-weight: 700; line-height: 1.5;
}
.lt-infra-cap span { display: block; font-weight: 500; font-size: 15.5px; opacity: .92; }
.lt-infra p { font-size: 15px; color: var(--lt-muted); margin: 14px 2px 0; line-height: 1.75; }

/* ---------- Hero buttons ------------------------------------------------- */

.lt-hero a.nectar-button { display: inline-block; margin: 6px 7px; }

/* ---------- Form grid ---------------------------------------------------- */

.lt-form-grid label { display: block; margin-bottom: 6px; }
.lt-form-grid .lt-req { color: #D64545; }

/* A soft vertical scrim keeps hero and page-header copy legible over the
   busiest parts of the canopy photograph, on top of the row's own overlay. */
.lt-hero .row-bg-overlay,
.lt-page-head-row .row-bg-overlay {
  background-image: linear-gradient(180deg, rgba(9,24,12,.55) 0%, rgba(9,24,12,.15) 45%, rgba(9,24,12,.6) 100%) !important;
}

/* ==========================================================================
   Image sizing overrides

   Salient normalises every image inside the builder wrapper (width/height
   auto), which beats the plain selectors above on specificity. An unloaded
   lazy image then resolves to 0x0, never intersects the viewport, and so is
   never fetched at all — the cards render as empty boxes. These rules give
   each image an explicit layout box so it loads and crops predictably.
   ========================================================================== */

.lt-infra-media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.lt-product img {
  width: auto !important;
  max-width: 100% !important;
  height: 190px !important;
  object-fit: contain !important;
}

.lt-hex img {
  width: calc(100% - 18px) !important;
  height: calc(100% - 18px) !important;
  object-fit: cover !important;
}

/* Framed photo: fill the frame edge to edge.

   WordPress gives content images a bottom margin, and the frame's own
   overflow:hidden stops that margin collapsing out — so it showed as a white
   strip under the photo. line-height:0 removes the inline leading too. The
   frame stretches to its equal-height row via the lt-stretch class that
   media_col() adds, and the photo covers it rather than letterboxing. */
.lt-media-img {
  line-height: 0;
  font-size: 0;
}
.lt-media-img img {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
.lt-stretch .lt-media-img { height: 100%; }

/* Cut-out artwork keeps its own proportions — never crop it. */
.lt-cutout img {
  display: block !important;
  margin: 0 !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}

/* ==========================================================================
   List markers and equal-height columns
   ========================================================================== */

/* Salient re-applies a disc marker to list items inside the builder wrapper,
   which doubled up with the custom tick and chip markers. */
.lt-ticks li,
.lt-chips li,
.lt-hexrow > li,
.lt-timeline > li {
  list-style: none !important;
}
.lt-ticks,
.lt-chips,
.lt-hexrow,
.lt-timeline {
  list-style: none !important;
}

/* Cards use height:100% to line up in an equal-height row, which only works
   if every wrapper between the column and the card is also full height.
   Scoped to .lt-stretch (set by card_col) — applying it to every text block in
   an equal-height row spreads ordinary body copy down the whole column. */
/* Note: the column itself must NOT get height:100%. Salient's equal-height row
   is a flex container, and an item only stretches to the line height while its
   cross size is auto — setting a percentage height here opts the column out of
   stretching and each card falls back to its own content height. */
.lt-stretch > .vc_column-inner,
.lt-stretch > .vc_column-inner > .wpb_wrapper,
.lt-stretch .wpb_wrapper > .wpb_text_column,
.lt-stretch .wpb_text_column > .wpb_wrapper {
  height: 100%;
}

/* Contact form panel.

   The card is drawn on the column itself rather than on a <div> inside one
   text block, so the heading, the intro line and the Contact Form 7 element
   can stay three separate, individually selectable elements in the builder
   while still reading as a single panel. */
.lt-form-col > .vc_column-inner {
  background: #fff;
  border: 1px solid var(--lt-line);
  border-radius: 14px;
  padding: 34px 34px 28px;
}
.lt-form-col h3 {
  font-size: 21px;
  color: var(--lt-forest);
  margin: 0 0 10px;
}
.lt-form-col > .vc_column-inner > .wpb_wrapper > .wpb_text_column:first-child p {
  color: var(--lt-muted);
  margin: 0;
}
@media only screen and (max-width: 690px) {
  .lt-form-col > .vc_column-inner { padding: 26px 22px 22px; }
}

/* ---------- Flag chips and lists ---------------------------------------- */

/* Chips carrying a flag lay out as a row so the flag and label stay aligned
   when the label wraps. */
.lt-chips li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.lt-chips li .lt-flag + .lt-flag { margin-left: -4px; }


/* ---------- Cut-out that fills its column height ------------------------ */

/* The 发展战略 artwork sits beside a tall timeline. Filling the column height
   and centring keeps it as large as the space allows without cropping — the
   figures reach the edges of the trimmed PNG, so object-fit: cover would clip
   an arm or a bag. */
.lt-cutout-fill {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.lt-cutout-fill img {
  max-height: 100%;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
}

/* Stacked layouts give the artwork the full column width instead. */
@media only screen and (max-width: 999px) {
  .lt-cutout-fill { height: auto; }
  .lt-cutout-fill img { max-height: none; width: 100% !important; }
}

/* ==========================================================================
   全球支付解决方案 — three columns matching deck p11
   ========================================================================== */

.lt-pay-col { height: 100%; }

/* Green header bar that opens each column. */
.lt-pay-head {
  background: var(--lt-forest);
  color: #fff;
  font-size: 17px;
  font-weight: 700;
  text-align: center;
  padding: 13px 14px;
  border-radius: 8px;
  margin-bottom: 18px;
  line-height: 1.4;
}

.lt-pay-sub {
  font-size: 15.5px;
  font-weight: 700;
  color: var(--lt-forest-deep);
  margin: 20px 0 10px;
}
.lt-pay-col .lt-ticks li { font-size: 15px; }

/* Logo rows. Heights are capped rather than widths so wordmarks of very
   different proportions still read as one row. */
.lt-pay-logos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
}
.lt-pay-logo {
  width: auto !important;
  height: auto !important;
  max-height: 26px !important;
  max-width: 92px !important;
  object-fit: contain !important;
  display: block;
}

/* 本地银行转账 — rail logo left, market right. */
.lt-pay-rails { list-style: none !important; margin: 0; padding: 0; }
.lt-pay-rails li {
  list-style: none !important;
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 11px;
}
.lt-pay-rail {
  flex: 0 0 84px;
  display: flex;
  align-items: center;
  min-height: 26px;
}
.lt-pay-rail .lt-pay-logo { max-width: 84px !important; }
.lt-pay-market { font-size: 15px; color: #3A423C; }

/* 区域电子钱包收款 — logos above their market label. */
.lt-pay-group { margin-bottom: 16px; }
.lt-pay-group .lt-pay-market { display: block; margin-top: 6px; font-size: 14px; color: var(--lt-muted); }

/* 跨境资金分发 — image above caption. */
.lt-pay-dist { margin-top: 4px; }
.lt-pay-dist figure { margin: 0 0 18px; }
.lt-pay-dist figure img {
  width: 100% !important;
  height: 104px !important;
  max-height: none !important;
  max-width: none !important;
  object-fit: cover !important;
  border-radius: 8px;
  display: block;
}
.lt-pay-dist figcaption {
  margin-top: 8px;
  font-size: 15.5px;
  font-weight: 700;
  color: var(--lt-forest-deep);
}

/* Currency list in column one. */
.lt-flag-rows { list-style: none !important; margin: 0; padding: 0; }
.lt-flag-rows li {
  list-style: none !important;
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 8px;
  font-size: 15px;
  color: #3A423C;
}

@media only screen and (max-width: 999px) {
  .lt-pay-head { font-size: 16px; }
  .lt-pay-dist figure img { height: 150px !important; }
}

/* ==========================================================================
   Structures carried over from the deck
   ========================================================================== */

/* Deck's own disc bullets. */
.lt-dots { margin: 0; padding-left: 20px; }
.lt-dots li { font-size: 16px; line-height: 1.75; color: #3A423C; margin-bottom: 7px; }
.lt-dots li:last-child { margin-bottom: 0; }

/* p4 — photo, green caption bar, bullet. */
.lt-focus { height: 100%; }
.lt-focus-media { aspect-ratio: 16 / 10; border-radius: 10px 10px 0 0; overflow: hidden; }
.lt-focus-media img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
.lt-focus-cap {
  background: var(--lt-forest); color: #fff; text-align: center;
  font-size: 17px; font-weight: 700; padding: 13px 12px; border-radius: 0 0 10px 10px;
}
.lt-focus .lt-dots { margin-top: 14px; }

/* p2 — quote set left under its heading. */
.lt-quote-left {
  font-size: 20px; line-height: 2; color: var(--lt-forest-deep); font-weight: 500; margin-top: 18px;
}
@media only screen and (max-width: 690px) { .lt-quote-left { font-size: 17px; } }

/* p3 — the earth band carrying the three capability labels. */
.lt-earth-lead, .lt-earth-foot {
  color: #fff !important; text-align: center; font-size: 18px; line-height: 1.9; margin: 0;
}
/* !important on display: Salient sets ul { display: inline-block } inside a
   centred-text column, which otherwise beats the flex row. */
.lt-earth-points {
  list-style: none !important; margin: 22px 0; padding: 0;
  display: flex !important; flex-wrap: wrap; justify-content: center; gap: 18px 54px;
  position: relative;
}
.lt-earth-points li {
  list-style: none !important;
  display: block !important;
  color: var(--lt-lime); font-size: 21px; font-weight: 700; position: relative; padding-top: 22px;
}
.lt-earth-points li::before {
  content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: 11px; height: 11px; border-radius: 50%; background: var(--lt-lime);
}
@media only screen and (max-width: 690px) {
  .lt-earth-points { gap: 22px; }
  .lt-earth-points li { font-size: 18px; }
  .lt-earth-lead, .lt-earth-foot { font-size: 16px; }
}

/* p5 — mission / vision. */
.lt-mv-label { font-size: 19px; color: var(--lt-green) !important; margin: 0 0 6px; }
.lt-mv-head  { font-size: 20px; font-weight: 700; color: var(--lt-forest-deep); margin: 0 0 12px; }

/* p6 — office blocks. */
.lt-office { height: 100%; }
.lt-office-icon { width: 40px; height: 40px; color: var(--lt-green); display: block; margin-bottom: 12px; }
.lt-office h3 { font-size: 19px; color: var(--lt-forest); margin: 0 0 10px; }

/* p7 — paired photos above each pillar's copy. */
.lt-photo-pair { display: flex; gap: 12px; margin: 18px 0 20px; }
.lt-photo-pair img {
  width: 50% !important; height: 210px !important;
  object-fit: cover !important; border-radius: 10px; display: block;
}
/* Keeps the second pillar's heading level with the first, which has an eyebrow. */
.lt-eyebrow-spacer { display: block; height: 28px; }
@media only screen and (max-width: 999px) {
  .lt-photo-pair img { height: 160px !important; }
  .lt-eyebrow-spacer { display: none; }
}

/* p9 — four products across, spec boxes beneath. */
.lt-durian { text-align: center; height: 100%; }
.lt-durian img {
  width: auto !important; max-width: 100% !important; height: 190px !important;
  object-fit: contain !important; margin: 0 auto 14px; display: block;
}
.lt-durian h3 { font-size: 16px; color: var(--lt-forest); margin: 0; line-height: 1.5; }
.lt-spec {
  border: 1px solid var(--lt-green); border-radius: 10px; padding: 22px 24px; height: 100%;
}
.lt-spec .lt-dots li { font-size: 15.5px; }
