/* ============================================================
   Theme: SKETCH  -  small, hand-made, notebook-feel cafe
   ------------------------------------------------------------
   For: little neighbourhood cafes with a handwritten chalkboard
   menu and notebooks on the counter - cafe-bookshop hybrids,
   small-batch bakery counters. Mood: a quiet shop in a side
   street, brown ink on cream, a single soft sage accent. A
   humanist serif over Inter, hairline rules, lots of air.
   Calm, friendly, restrained.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap');

.theme-sketch {
  /* -------- Surfaces (cream + warm bone) ---------------- */
  --bg:        #F5EFE2;
  --bg-2:      #ECE4D2;
  --surface:   #FBF7EC;

  /* -------- Text (warm brown ink on cream) -------------- */
  --fg:            #3B2F22;
  --fg-muted:      #7A6A56;
  --heading-color: #2A2018;

  /* -------- Accent (single soft sage) ------------------- */
  --accent:        #5E7A52;
  --accent-bright: #6E8A60;
  --accent-hover:  #455D3C;
  --accent-2:      #5E7A52;
  --on-accent:     #FBF7EC;

  --hairline:   rgba(59, 47, 34, 0.14);
  --hairline-2: rgba(59, 47, 34, 0.24);

  /* -------- Hero (warm brown veil) ---------------------- */
  --hero-ink: #FBF7EC;
  --hero-min-h: 82vh;
  --hero-overlay:
    radial-gradient(120% 95% at 50% 40%, rgba(42,32,24,0.30) 0%, rgba(42,32,24,0.56) 66%, rgba(30,22,16,0.84) 100%),
    linear-gradient(180deg, rgba(42,32,24,0.38) 0%, rgba(42,32,24,0.32) 42%, rgba(30,22,16,0.86) 100%);

  /* -------- Footer (warm brown ink) --------------------- */
  --footer-bg:     #2A2018;
  --footer-fg:     rgba(251, 247, 236, 0.76);
  --footer-strong: #FBF7EC;
  --footer-head:   #8FB07F;

  /* -------- Type ---------------------------------------- */
  --font-display: 'Lora', Georgia, 'Times New Roman', serif;
  --font-body:    'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --fs-hero: clamp(2.4rem, 5.5vw + 1rem, 4.6rem);
  --heading-weight: 500;
  --heading-tracking: -0.005em;
  --eyebrow-tracking: 0.18em;

  /* -------- Soft corners, hairline rules ---------------- */
  --radius-1: 4px;
  --radius-2: 10px;
  --radius-3: 14px;
  --radius-pill: 999px;
  --radius-btn: 10px;   /* soft, friendly - rounded but not a pill */
  --rule-width: 36px;
  --rule-height: 1px;
  --rule-color: var(--accent);

  --shadow-1: none;
  --shadow-2: none;
}

/* ---- Structural personality: handwritten, friendly ------- */

.theme-sketch h1,
.theme-sketch h2,
.theme-sketch h3,
.theme-sketch .footer__wordmark {
  font-family: var(--font-display);
  font-weight: 500;
  letter-spacing: -0.005em;
}

.theme-sketch .rule { height: 1px; width: 36px; }

.theme-sketch .menu-group {
  background: var(--surface);
  border: 1px solid var(--hairline);
  box-shadow: none;
}
.theme-sketch .menu-group__title { border-bottom: 1px solid var(--hairline-2); }
.theme-sketch .menu-group__title h3 { font-family: var(--font-display); font-weight: 600; }
.theme-sketch .menu-row__price {
  color: var(--accent);
  font-family: var(--font-body);
  font-variant-numeric: tabular-nums;
}

.theme-sketch .intro__lede { font-style: italic; font-weight: 400; }
.theme-sketch .intro__lede em { font-style: normal; color: var(--accent); }