/* ==========================================================================
   Le Mont - Cam Duong | Design tokens + tieu de + nut bam
   Nap dau tien, truoc lemont-components.css

   NGUYEN TAC SCOPE: moi selector deu bat dau bang tien to .lm-
   => dan duoc vao Flatsome > Custom CSS ma khong lam hong trang khac,
      va khong phu thuoc class <body> do PHP sinh ra.
   ========================================================================== */

:root {
  /* Mau thuong hieu */
  --lm-green: #14312a;
  --lm-green-deep: #0f211b;
  --lm-green-mid: #1e4a3c;
  --lm-cream: #f6f3ec;
  --lm-gold: #b68a4e;
  --lm-gold-dark: #8f6a37;

  /* Mau chu */
  --lm-ink: #16241f;
  --lm-body: #4a5750;
  --lm-body-strong: #2c3934;
  --lm-muted: #7a8a80;
  --lm-sand: #c8c2b3;
  --lm-sage: #8fa199;

  /* Duong vien */
  --lm-line: #ececec; /* khop duong ke bang/tieu de cua site */
  --lm-line-gold: #d8a650; /* gach chan vang duoi tieu de (Xuan Phuong) */
  --lm-line-strong: #dcdcdc;
  --lm-line-light: rgba(255, 255, 255, 0.12);

  /* Hinh khoi */
  --lm-radius-card: 10px; /* khop the ha tang cua site */
  --lm-radius: 5px; /* khop nut/o nhap cua site (Flatsome: 5px) */
  --lm-shadow-lg: 0 20px 50px rgba(20, 49, 42, 0.15);
  --lm-shadow-md: 0 20px 50px rgba(20, 49, 42, 0.12);

  /* Font THUONG: khong khai bao - ke thua tu <body> cua site
     (lemont.com.vn: 'svn-gotham-book' do plugin Use Any Font dat).

     Font DAM: site khai bao moi do day la MOT FAMILY RIENG BIET
     ('svn-gotham-book' va 'svn-gotham-bold'), moi family chi co 1 weight.
     => Dat font-weight:700/800 KHONG ra font Bold that, ma chi ra ban
        "gia lap dam" (faux bold) cua font Book - nhat va khac han chu dam
        o cac tieu de h1-h6 (duoc uaf.css ep sang svn-gotham-bold).
     => Do do phai goi DUNG TEN FAMILY dam qua bien duoi day.
     Dung cho site khac: doi gia tri nay thanh ten font dam cua site do,
     hoac de trong (unset) neu font cua site ho tro nhieu do day binh thuong. */
  --lm-font-bold: 'svn-gotham-bold', sans-serif;
}

/* --------------------------------------------------------------------------
   Cum tieu de section: [lemont_section_heading]
   -------------------------------------------------------------------------- */

.lm-heading {
  margin-bottom: 56px;
}

.lm-heading--center {
  text-align: center;
}

.lm-heading--left {
  text-align: left;
}

.lm-heading__eyebrow {
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.2em;
  color: var(--lm-gold);
  text-transform: uppercase;
}

/* Tieu de kieu "section-title-normal" cua trang Le Mont - Xuan Phuong:
   chu IN HOA, mau xanh #012a2c, mot duong ke xam 2px chay het chieu ngang
   h2, va gach chan vang 2px chi dai bang chieu rong chu (nam de len duong xam).
   Markup: <h2 class="lm-heading__title"><span>TIEU DE</span></h2>
   Font-family: ke thua svn-gotham-bold tu theme. */
.lm-heading__title {
  margin: 0;
  border-bottom: 2px solid var(--lm-line);
  font-size: 26px;
  line-height: 1.3;
  font-weight: 400;
  color: #012a2c;
  text-transform: uppercase;
}

.lm-heading__title,
.lm-heading__title span {
  text-wrap: balance;
}

.lm-heading__title span {
  display: inline-block;
  padding-bottom: 7.5px;
  margin-bottom: -2px;
  border-bottom: 2px solid var(--lm-line-gold);
}

.lm-heading__lead {
  margin: 20px auto 0;
  max-width: 640px;
  font-size: 16px;
  line-height: 1.6;
  color: var(--lm-body);
}

.lm-heading--left .lm-heading__lead {
  margin-left: 0;
}

/* Bien the tren nen xanh dam */
.lm-heading--dark .lm-heading__title {
  border-bottom-color: rgba(255, 255, 255, 0.18);
  color: #fff;
}

.lm-heading--dark .lm-heading__lead {
  color: var(--lm-sand);
}

/* --------------------------------------------------------------------------
   Nut bam
   Dung .button.lm-btn (0,2,0) de chac chan thang style nut cua Flatsome.
   -------------------------------------------------------------------------- */

.button.lm-btn,
a.lm-btn {
  display: inline-block;
  margin: 0;
  padding: 15px 30px;
  border-radius: var(--lm-radius);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.03em;
  line-height: 1.2;
  text-transform: none;
  min-height: 0;
  transition: opacity 0.2s ease, background-color 0.2s ease;
}

.button.lm-btn--gold,
a.lm-btn--gold {
  background-color: var(--lm-gold);
  border-color: var(--lm-gold);
  color: var(--lm-ink);
}

.button.lm-btn--gold:hover,
a.lm-btn--gold:hover {
  background-color: var(--lm-gold);
  border-color: var(--lm-gold);
  color: var(--lm-ink);
  opacity: 0.88;
}

.button.lm-btn--ghost,
a.lm-btn--ghost {
  background-color: transparent;
  border: 1px solid rgba(255, 255, 255, 0.5);
  color: #fff;
}

.button.lm-btn--ghost:hover,
a.lm-btn--ghost:hover {
  background-color: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.7);
  color: #fff;
}