/* ============================================================
   PHOEBE STOREFRONT - Design tokens (quiet luxury)
   Theo QUY CHUAN THIET KE PHOEBE 26/09/2026: chi kem/trang + vang + navy.
   2 bo chu: Cormorant Garamond (serif) + sans he thong.
   Moi page CHI dung bien o day; khong hardcode mau/size roi rac.
   ============================================================ */
:root {
  /* --- Bang mau chuan (muc 1 quy chuan) --- */
  --c-cream:     #FBFAF7;   /* nen trang */
  --c-white:     #FFFFFF;   /* nen o nhap / anh */
  --c-navy:      #1F3A5F;   /* chu + icon chinh, tieu de */
  --c-ink:       #3F3F3F;   /* chu than dai */
  --c-muted:     #6E6A65;   /* chu phu (dat WCAG) */
  --c-champ:     #C9A96A;   /* nen nut chinh, gach tab, diem nhan */
  --c-gold:      #A8874F;   /* vang trang tri (icon lon, cham) */
  --c-gold-ink:  #7D6437;   /* chu vang (link, nhan, nut chu) */
  --c-gold-tint: #F5EEE0;   /* nen vang nhat (chon, avatar, nhan) */
  --c-line:      #ECE7DF;   /* duong ke manh */
  --c-err:       #A9563F;   /* loi / xoa */
  --c-err-tint:  #F7ECE8;   /* nen loi nhat */

  /* --- Ten cu (cac file CSS dang dung) tro ve bang chuan --- */
  --cream:      var(--c-cream);
  --ivory:      var(--c-white);
  --paper:      var(--c-white);
  --ink:        var(--c-navy);     /* chu chinh = navy */
  --ink-soft:   var(--c-ink);      /* chu than = xam am (bo navy diu xanh) */
  --muted:      var(--c-muted);
  --faint:      var(--c-muted);
  --line:       var(--c-line);
  --line-soft:  var(--c-line);
  --navy:       var(--c-navy);
  --champagne:  var(--c-champ);
  --gold:       var(--c-gold);
  --gold-deep:  var(--c-gold-ink);
  --gold-ink:   var(--c-gold-ink);
  --gold-tint:  var(--c-gold-tint);
  --sale:       var(--c-err);
  --err:        var(--c-err);

  /* --- Chu: Cormorant Garamond (tieu de, ten SP, gia, so tien) + sans he thong --- */
  --serif: 'Cormorant Garamond', 'Times New Roman', Georgia, serif;
  --sans:  -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

  /* Cormorant nho mat hon Playfair: thang serif tang ~12% cho can */
  --fs-giant:  clamp(62px, 10vw, 168px);
  --fs-hero:   clamp(54px, 7.8vw, 116px);
  --fs-d1:     clamp(38px, 4.9vw, 67px);
  --fs-d2:     clamp(29px, 3.4vw, 45px);
  --fs-d3:     clamp(23px, 2.5vw, 31px);
  --fs-price:  18px;    /* gia tren the luoi */
  --fs-body:   14px;
  --fs-sm:     13px;
  --fs-cap:    12px;
  --fs-xs:     11px;    /* nhan chu hoa, nho nhat cho phep */
  --lh-tight:  1.08;
  --lh-body:   1.6;
  --ls-label:  .16em;   /* letter-spacing nhan hoa */
  --ls-wide:   .03em;

  /* --- Khong gian --- */
  --gut:       clamp(16px, 4vw, 64px);   /* le trang */
  --maxw:      1440px;
  --sp-1: 6px; --sp-2: 12px; --sp-3: 20px; --sp-4: 32px;
  --sp-5: 52px; --sp-6: 80px; --sp-7: 120px; --sp-8: 168px; --sp-9: 220px;

  /* --- Chi tiet --- */
  --radius: 10px;          /* nut + o nhap */
  --ease: cubic-bezier(.22,.61,.36,1);
  --dur: .5s;
  --header-h: 112px;
}

@media (max-width: 900px){ :root{ --header-h: 84px; } }