:root {
  /* ========================
     BACKGROUND
  ======================== */
  --bgTop: #756ea4;
  --bgBottom: #8781b3;

  /* ========================
     BRAND COLORS
  ======================== */
  --brand: #8080b0;
  --brand2: #6f6aa8;
  --brandSoft: rgba(128, 128, 176, 0.18);

  /* ========================
     SURFACE / CARDS
  ======================== */
  --surface: #ffffff;
  --cardBg: rgba(0, 0, 0, 0.12);
  --cardStroke: rgba(255, 255, 255, 0.1);

  /* ========================
     TEXT
  ======================== */
  --ink: #1b1b2f;
  --text: #ffffff;
  --muted: rgba(255, 255, 255, 0.78);
  --lightText: #e9e8ff;
  --stars: #ffd84d;

  /* ========================
     BUTTONS
  ======================== */
  --btn: #6f6aa8;
  --btnHover: #8080b0;

  /* ========================
     INSTAGRAM
  ======================== */
  --igA: #7c6fb4;
  --igB: #ec4899;

  /* ========================
     WHATSAPP
  ======================== */
  --wa: #25d366;

  /* ========================
     SHADOWS
  ======================== */
  --shadow: 0 14px 40px rgba(0, 0, 0, 0.18);
  --shadowSoft: 0 10px 30px rgba(0, 0, 0, 0.12);

  /* ========================
     RADIUS
  ======================== */
  --radius: 16px;
  --radiusSm: 14px;

  /* ========================
     LAYOUT
  ======================== */
  --containerMax: 520px;
  --containerPadding: 18px;

  /* ========================
     PIN
  ======================== */

  --bgPin: rgba(255, 255, 255, 0.06);
  --bgPinBorder: rgba(255, 255, 255, 0.08);
}