/* KOFFIE · artisan coffee roaster / koffiewinkel
   Dark roast: espresso brown, crema, copper. Characterful soft serif (Fraunces) +
   clean geometric sans (DM Sans). Dark-mode by default, subtle steam/bean texture.
   Default hero: full. */
:root {
  --c-bg: #1c1411;
  --c-surface: #271c17;
  --c-surface-2: #22180f;
  --c-text: #f4eade;
  --c-muted: #cbb7a4;
  --c-primary: #e0a06a;
  --c-on-primary: #1c1411;
  --c-accent: #e0a06a;
  --c-on-accent: #1c1411;
  --c-accent-text: #e9b98d;
  --c-line: #4b3a31;
  --c-hero-bg: #1c1411;
  --c-hero-text: #f4eade;
  --c-footer-bg: #120c0a;
  --c-footer-text: #e9dccd;
  --c-ph-a: #3a2a22; --c-ph-b: #4a362b;
  --c-ph-label-bg: rgba(28,20,17,.88);
  --c-ph-label-text: #f4eade;
  --c-price: #e9b98d;

  --f-head: "Fraunces", Georgia, serif;
  --f-body: "DM Sans", system-ui, sans-serif;
  --fw-head: 700;
  --ls-head: -.01em;
  --radius-s: 6px; --radius-m: 16px; --radius-l: 28px; --radius-btn: 999px;
  --shadow: 0 10px 30px rgba(0,0,0,.35);
  --motif-color: #e0a06a;

  --texture: radial-gradient(circle at 20% 10%, rgba(224,160,106,.06), transparent 40%), radial-gradient(circle at 90% 60%, rgba(224,160,106,.05), transparent 35%);
  --hero-texture: none;
  --ph-pattern:
    radial-gradient(ellipse 18px 26px at 50% 50%, #5a4032 40%, transparent 42%) 0 0 / 60px 60px,
    radial-gradient(ellipse 18px 26px at 50% 50%, #5a4032 40%, transparent 42%) 30px 30px / 60px 60px,
    linear-gradient(180deg, #3a2a22, #2a1d17);
}
.site-header { background: rgba(28,20,17,.92); backdrop-filter: blur(6px); }
.brand__mark { background: transparent; color: var(--c-primary); border: 2px solid var(--c-primary); font-style: italic; }
.site-nav a:hover { background: var(--c-surface); }
.hero h1 { font-style: italic; font-weight: 600; }
.hero--full .hero__text { background: rgba(28,20,17,.9); border: 1px solid var(--c-line); }
.card { border-color: var(--c-line); }
.card__price { font-family: var(--f-head); font-style: italic; }
.quote blockquote { font-style: italic; }
.section:nth-of-type(even) { background: var(--c-surface-2); }
.map-ph { --c-ph-b: #5a4032; }