/* ==========================================================================
   DESIGN TOKENS — Sen Vàng Kindergarten
   Cảm hứng: logo sen vàng trên nền ngà. Sang trọng nhờ khoảng trắng, chữ tinh,
   vàng dùng tiết chế; tươi vui nhờ bo tròn mềm, chữ tròn và điểm nhấn màu nhẹ.
   ========================================================================== */
:root {
  /* Vàng sen (lấy từ logo) */
  --c-gold:        #EDB53A;   /* vàng đậm — nút, đường nhấn */
  --c-gold-light:  #F5CD5A;   /* vàng nhạt — mặt logo */
  --c-gold-pale:   #FBEFC9;   /* nền vàng rất nhạt */
  --c-gold-ink:    #B8860B;   /* chữ vàng trên nền sáng (đủ tương phản) */

  /* Nền & chữ */
  --c-ivory:       #FCFAF4;   /* nền trang */
  --c-sand:        #F5EFE2;   /* nền section phụ */
  --c-white:       #FFFFFF;
  --c-ink:         #26262B;   /* tiêu đề */
  --c-text:        #4A4A50;   /* nội dung */
  --c-muted:       #8B8B92;   /* chú thích (xám của chữ "Kindergarten") */
  --c-line:        #EAE3D3;
  --c-surface:     #FFFFFF;   /* nền thẻ/khối nổi */
  --c-header:      rgba(252,250,244,.86);
  --c-footer:      #26262B;   /* footer tông sậm */

  /* Điểm nhấn trẻ thơ — dùng rất tiết chế */
  --c-sage:        #A9CDB8;
  --c-sage-pale:   #EAF3EE;
  --c-coral:       #F0A896;
  --c-coral-pale:  #FCEBE6;
  --c-sky:         #B9D7EE;
  --c-sky-pale:    #EDF4FA;

  /* Chữ */
  --f-display: "Playfair Display", "Cormorant Garamond", Georgia, serif; /* serif cổ điển — sang, tinh tế */
  --f-accent:  "Playfair Display", Georgia, serif;                       /* italic của cùng họ chữ cho điểm nhấn */
  --f-ui:      "Be Vietnam Pro", system-ui, sans-serif;                  /* menu, nhãn, nút: sans gọn, viết hoa giãn chữ */
  --f-body:    "Be Vietnam Pro", system-ui, -apple-system, sans-serif;
  --fs-xs: .78rem; --fs-sm: .9rem; --fs-md: 1rem; --fs-lg: 1.125rem;
  --fs-xl: 1.4rem; --fs-2xl: 1.9rem; --fs-3xl: clamp(2rem, 3.6vw, 2.9rem); --fs-4xl: clamp(2.4rem, 5vw, 4rem);
  --lh-tight: 1.12; --lh-body: 1.7;
  --track: .01em;

  /* Khoảng cách */
  --space-1: 4px; --space-2: 8px; --space-3: 16px; --space-4: 24px;
  --space-5: 40px; --space-6: 64px; --space-7: 104px;
  --section-y: clamp(64px, 9vw, 120px);
  --container: 1200px;
  --gutter: clamp(20px, 5vw, 48px);

  /* Hình khối */
  --radius-sm: 8px; --radius: 14px; --radius-lg: 22px; --radius-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(38,38,43,.04), 0 4px 14px rgba(38,38,43,.05);
  --shadow:    0 6px 20px rgba(38,38,43,.06), 0 18px 48px rgba(184,134,11,.08);
  --shadow-lg: 0 30px 80px rgba(38,38,43,.14);
  --ease: cubic-bezier(.22,.8,.26,1);
  --dur: .35s;
}

/* ---------- CHẾ ĐỘ TỐI ---------- */
:root[data-theme="dark"] {
  --c-ivory:   #141416; --c-sand: #1B1B1F; --c-white: #202026; --c-surface: #202026;
  --c-header:  rgba(20,20,22,.82); --c-footer: #0F0F11;
  --c-ink:     #F3EFE6; --c-text: #CBC7BE; --c-muted: #8E8B84; --c-line: #2E2E35;
  --c-gold-ink: #F5CD5A; --c-gold-pale: rgba(237,181,58,.16);
  --c-sage-pale: rgba(169,205,184,.14); --c-coral-pale: rgba(240,168,150,.14); --c-sky-pale: rgba(185,215,238,.14);
  --shadow-sm: 0 1px 2px rgba(0,0,0,.3), 0 4px 14px rgba(0,0,0,.25);
  --shadow:    0 6px 20px rgba(0,0,0,.35), 0 18px 48px rgba(0,0,0,.35);
  --shadow-lg: 0 30px 80px rgba(0,0,0,.6);
  color-scheme: dark;
}
:root[data-theme="dark"] img.brand__mark, :root[data-theme="dark"] .m-daily__mark { filter: brightness(1.05); }
:root[data-theme="dark"] .m-contact__map iframe { filter: invert(.9) hue-rotate(180deg) saturate(.6); }