/* Prompty Club (working name) - design tokens v0.1
   Shared by: website, landing pages, cards, posters, and the student app (harness).
   Inspired by the soft, warm look of kid-first sites, with our own palette, mascot and Hebrew/RTL support.
   Fonts: Lilita One (display), Figtree (body), Secular One (Hebrew display), Rubik (Hebrew body). All Google Fonts. */

:root {
  /* Surfaces */
  --bic-cream:      #FFF6EE;   /* page background */
  --bic-peach:      #FFE8DC;   /* section background */
  --bic-peach-deep: #FFD9C6;
  --bic-paper:      #FFFFFF;
  --bic-cloud:      #F5F8FA;
  --bic-fog:        #E8EDF2;

  /* Brand */
  --bic-coral:      #F4713F;   /* primary action */
  --bic-coral-dark: #DB5528;
  --bic-coral-soft: #FFB89A;
  --bic-violet:     #7C5CFA;   /* AI / magic */
  --bic-violet-bg:  #ECE6FF;
  --bic-sun:        #F7C948;   /* rewards, highlights */
  --bic-sun-bg:     #FFF3CC;
  --bic-mint:       #29B98B;   /* success, safe */
  --bic-mint-bg:    #DFF5EC;
  --bic-sky:        #4C9BE8;   /* info, links */
  --bic-sky-bg:     #E3EFFC;

  /* Ink */
  --bic-ink:        #1B2540;   /* headings, footer */
  --bic-ink-2:      #2A3656;
  --bic-text:       #3B475F;
  --bic-muted:      #7B879C;
  --bic-error:      #C4442A;

  /* Type */
  --bic-font-display: "Lilita One", "Secular One", system-ui, sans-serif;
  --bic-font-body:    "Figtree", "Rubik", system-ui, sans-serif;
  --bic-font-he-display: "Secular One", "Rubik", sans-serif;
  --bic-font-he-body:    "Rubik", "Figtree", sans-serif;

  /* Shape and depth */
  --bic-radius-sm: 8px;
  --bic-radius-md: 14px;
  --bic-radius-lg: 20px;
  --bic-radius-xl: 28px;
  --bic-radius-pill: 999px;
  --bic-shadow-soft: 0 6px 24px rgba(244, 113, 63, .12);
  --bic-shadow-card: 0 2px 0 rgba(27, 37, 64, .06), 0 10px 30px rgba(27, 37, 64, .08);
  --bic-shadow-pop:  0 4px 0 var(--bic-coral-dark);

  /* Motion */
  --bic-ease: cubic-bezier(.2, .8, .2, 1);
}

html[dir="rtl"] body { font-family: var(--bic-font-he-body); }
html[dir="rtl"] .display { font-family: var(--bic-font-he-display); letter-spacing: 0; }

.display { font-family: var(--bic-font-display); letter-spacing: .01em; color: var(--bic-ink); line-height: 1.08; }
.btn-bic {
  font: 700 1rem/1 var(--bic-font-body); border: 0; cursor: pointer;
  padding: .95rem 1.5rem; border-radius: var(--bic-radius-pill);
  background: var(--bic-coral); color: #fff; box-shadow: var(--bic-shadow-pop);
  transition: transform .15s var(--bic-ease), box-shadow .15s var(--bic-ease);
}
.btn-bic:hover  { transform: translateY(-1px); }
.btn-bic:active { transform: translateY(3px); box-shadow: 0 1px 0 var(--bic-coral-dark); }
.btn-bic.secondary { background: #fff; color: var(--bic-coral-dark); box-shadow: inset 0 0 0 2px var(--bic-coral-soft); }