/* =========================================================
   HE THONG THIET KE - VUA DO DONG
   Bam sat nhan dien hien tai: nau dam #321301 + vang kim #EDB24F,
   tieu de Roboto Slab. Chi chuan hoa lai, khong doi nhan dien.
   ========================================================= */

:root{
  /* --- Nhan dien goc (lay tu site hien tai) --- */
  --vdd-brown:        #321301;  /* nau dam - header, footer */
  --vdd-brown-2:      #4A2208;  /* nau nhat hon - lop phu */
  --vdd-gold:         #EDB24F;  /* vang kim - nhan dien chinh */
  --vdd-gold-deep:    #CF9D4C;  /* vang dam - vien, hover */
  --vdd-amber:        #EEAC25;  /* ho phach - nhan manh */
  --vdd-gold-soft:    #FBF1DD;  /* nen vang rat nhat */
  --vdd-gold-text:    #8A5A14;  /* vang dam dung cho CHU tren nen sang - dat 5.6:1 */

  /* --- Nen & muc --- */
  --vdd-page:         #FFFFFF;
  --vdd-cream:        #FAF4E9;  /* nen kem cua banner hien tai */
  --vdd-sand:         #F4EDE1;
  --vdd-shell:        #FFFFFF;
  --vdd-ink:          #2B2119;  /* chu chinh - nau den, am hon #333 */
  --vdd-ink-2:        #4A3C30;
  --vdd-muted:        #7A6B5C;
  --vdd-line:         #E6DCCB;
  --vdd-line-2:       #D2C3AC;

  /* --- Mau hanh dong (goi dien, Zalo) ---
     Xanh la da lam dam hon #1F8A3B: mau do voi chu trang chi dat
     ty le tuong phan 4,41 trong khi chuan WCAG AA la 4,5. */
  --vdd-goi:          #1B7A34;
  --vdd-goi-dam:      #14602A;
  --vdd-zalo:         #0068FF;
  --vdd-zalo-dam:     #0052CC;

  /* --- Trang thai --- */
  --vdd-sale:         #B3341F;
  --vdd-sale-soft:    #FBE8E3;
  --vdd-stock:        #3F6B4F;

  /* --- Chu --- */
  /* Giu Roboto Slab cho tieu de de khong doi nhan dien,
     nhung chi nap 2 do dam thay vi 9 do dam x 2 ho font. */
  --vdd-font-display: "Roboto Slab", Georgia, serif;
  /* Than bai dung font he thong: 0 KB tai ve, hien thi tieng Viet tot */
  --vdd-font-body:    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                      "Helvetica Neue", Arial, "Noto Sans", sans-serif;

  --vdd-text-xs:   0.75rem;
  --vdd-text-sm:   0.875rem;
  --vdd-text-base: 1rem;
  --vdd-text-md:   1.125rem;
  --vdd-text-lg:   1.375rem;
  --vdd-text-xl:   1.625rem;
  --vdd-text-2xl:  2rem;
  --vdd-text-3xl:  2.5rem;
  --vdd-text-4xl:  clamp(2rem, 4.5vw, 3.25rem);

  --vdd-s1: 0.25rem; --vdd-s2: 0.5rem;  --vdd-s3: 0.75rem;
  --vdd-s4: 1rem;    --vdd-s5: 1.5rem;  --vdd-s6: 2rem;
  --vdd-s7: 3rem;    --vdd-s8: 4rem;    --vdd-s9: 6rem;

  --vdd-wide:   1280px;
  --vdd-normal: 1200px;
  /* Be rong noi dung that: khung 1200px tru hai ben le.
     Khoi trai het man hinh phai dung so nay moi thang hang
     voi cac section thuong. */
  --vdd-content: calc(1200px - 2 * var(--vdd-gutter));
  --vdd-narrow: 720px;
  /* Cot van ban cho trang thong tin (chinh sach, huong dan mua hang).
     68ch = 685px thi qua hep trong khung 1144px: chu lo lung o giua
     con tieu de chay het be rong, nhin khong can doi. 860px ~ 85 ky
     tu, van de doc ma lap day 3/4 khung. */
  --vdd-doc: 860px;
  --vdd-gutter: clamp(0.875rem, 3vw, 1.75rem);

  --vdd-r-sm: 3px;
  --vdd-r-md: 6px;

  --vdd-shadow-sm: 0 1px 2px rgba(43,33,25,.07);
  --vdd-shadow-md: 0 6px 20px -6px rgba(43,33,25,.16);
  --vdd-shadow-lg: 0 18px 44px -14px rgba(43,33,25,.26);

  --vdd-ease: cubic-bezier(.22,.61,.36,1);
  --vdd-dur:  .28s;
}