/* PICKLE BEAR - base
   Reset, typography, page furniture. Reads tokens only. */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--pb-bg);
  color: var(--pb-fg);
  font-family: var(--pb-font-body);
  font-size: var(--pb-size-body);
  line-height: var(--pb-leading-body);
  -webkit-font-smoothing: antialiased;
}

/* Paper grain. Kept very low (see --pb-texture-paper) so it reads as substrate
   rather than noise, and pinned to the viewport so it never tiles visibly. */
.pb-grain {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 90;
  opacity: var(--pb-texture-paper);
  background-image: url("../assets/noise.svg");
}

h1, h2, h3, h4 {
  font-family: var(--pb-font-display);
  font-weight: 400;
  line-height: var(--pb-leading-tight);
  letter-spacing: var(--pb-track-display);
  text-transform: uppercase;
  margin: 0 0 var(--pb-space-4);
}

h1 { font-size: var(--pb-size-h1); }
h2 { font-size: var(--pb-size-h2); }
h3 { font-size: var(--pb-size-h3); }

p { margin: 0 0 var(--pb-space-4); max-width: var(--pb-measure); }

a { color: inherit; }

img, svg { max-width: 100%; display: block; }

button { font: inherit; color: inherit; }

/* --- shared text utilities --------------------------------------------- */

.pb-eyebrow {
  font-family: var(--pb-font-data);
  font-size: var(--pb-size-micro);
  letter-spacing: var(--pb-track-caps);
  text-transform: uppercase;
  color: var(--pb-fg-muted);
  margin: 0 0 var(--pb-space-3);
}

.pb-caps {
  font-family: var(--pb-font-data);
  letter-spacing: var(--pb-track-caps);
  text-transform: uppercase;
}

.pb-lede { font-size: 1.15rem; color: var(--pb-fg-muted); }

.pb-pink  { color: var(--pb-accent); }
.pb-olive { color: var(--pb-brand-ink); }

/* --- layout ------------------------------------------------------------- */

.pb-page { max-width: var(--pb-page-max); margin: 0 auto; padding: 0 var(--pb-space-5); }

.pb-section { padding: var(--pb-space-8) 0; position: relative; }
.pb-section--tight { padding: var(--pb-space-6) 0; }
.pb-section--invert { background: var(--pb-bg-invert); color: var(--pb-fg-invert); }
.pb-section--invert .pb-eyebrow { color: rgba(244, 237, 224, 0.6); }

.pb-grid { display: grid; gap: var(--pb-space-5); }
.pb-grid--2 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.pb-grid--3 { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }

.pb-stack > * + * { margin-top: var(--pb-space-4); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}