/* BLUU Brand Kit v1 — token bersama. Link dari file mana pun di kit/:  <link rel="stylesheet" href="../assets/bluu.css">
   Aturan: BLUU = logo (file SVG), bukan teks. Semua teks Poppins. Aksen (maks ±10% teks) = Fraunces Italic. */

@font-face { font-family: "Poppins"; font-weight: 500; src: url("fonts/Poppins-500.woff") format("woff"); }
@font-face { font-family: "Poppins"; font-weight: 600; src: url("fonts/Poppins-600.woff") format("woff"); }
@font-face { font-family: "Poppins"; font-weight: 700; src: url("fonts/Poppins-700.woff") format("woff"); }
@font-face { font-family: "Poppins"; font-weight: 800; src: url("fonts/Poppins-800.woff") format("woff"); }
@font-face { font-family: "Poppins"; font-weight: 900; src: url("fonts/Poppins-900.woff") format("woff"); }
@font-face { font-family: "Fraunces"; font-weight: 800; font-style: italic; src: url("fonts/Fraunces-Soft-800i.woff") format("woff"); }

:root {
  /* warna */
  --bluu-cobalt: #1F3A93;   /* utama, ±60% */
  --bluu-navy:   #10225F;   /* bayangan, outline, teks di krem */
  --bluu-milk:   #F0F0EF;   /* putih susu, ±25% */
  --bluu-krem:   #F3E4C4;   /* adonan, ±10% */
  --bluu-krem-2: #E2C48E;   /* adonan matang */
  --bluu-yellow: #F6DD00;   /* label harga (ikut menu), ±5% */
  --bluu-pink:   #F39BB4;   /* meses, dekorasi saja */
  --bluu-white:  #FFFFFF;

  /* tipografi */
  --font-sans:   "Poppins", system-ui, sans-serif;
  --font-accent: "Fraunces", Georgia, serif;   /* selalu italic 800 */

  /* bentuk */
  --radius-s: 8px; --radius-m: 16px; --radius-l: 28px; --radius-pill: 999px;
  --shadow-pop: 4px 5px 0 var(--bluu-navy);          /* bayangan offset khas BLUU */
  --checker: repeating-conic-gradient(var(--bluu-milk) 0 25%, var(--bluu-cobalt) 0 50%);
}

.bluu-accent { font-family: var(--font-accent); font-style: italic; font-weight: 800; letter-spacing: -0.01em; }
.bluu-title  { font-family: var(--font-sans); font-weight: 800; letter-spacing: -0.02em; line-height: 1.02; }
.bluu-label  { font-family: var(--font-sans); font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.bluu-checker { background: var(--checker); background-size: 24px 24px; }