/* Goods&Cargo — shared tokens & base
   Brand palette + typography (see media/brand-typography.png) */

:root {
  /* Core brand palette */
  --color-teal: #a8e0dc;
  --color-oat: #f1f0e9;
  --color-orange: #ff9f3c;
  --color-yellow: #fbd14b;
  --color-purple: #c6b3e4;

  /* Typography — Inter only */
  --font-sans: Inter, system-ui, sans-serif;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;

  /* Scale (pt → CSS px 1:1 for screen) */
  --text-heading: 40px;
  --text-subheading: 30px;
  --text-body: 16px;

  /* Tracking */
  --tracking-heading: -0.02em; /* -2% — heading + subheading */
  --tracking-body: 0;

  /* Leading */
  --leading-heading: 1.1; /* 110% — heading + subheading */
  --leading-body: 1.4; /* 140% */

  /* Semantic */
  --ink: #000000;
  --ink-inverse: #ffffff;
  --page-max: 1550px;
  --pad-x: clamp(1.25rem, 8.5vw, 8.23rem);
  --pad-top: clamp(1.5rem, 4.4vw, 4.26rem);
}

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

html,
body {
  margin: 0;
  min-height: 100%;
  font-family: var(--font-sans);
  font-size: var(--text-body);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--tracking-body);
  line-height: var(--leading-body);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Wheel scrolling stays native. Anchor duration lives in js/smooth-scroll.js. */
html {
  scroll-behavior: auto;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

body {
  overflow-x: hidden;
}

img {
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
  text-decoration: none;
}

/* Type utilities */
.text-heading {
  font-family: var(--font-sans);
  font-size: var(--text-heading);
  font-weight: var(--font-weight-semibold);
  letter-spacing: var(--tracking-heading);
  line-height: var(--leading-heading);
}

.text-subheading {
  font-family: var(--font-sans);
  font-size: var(--text-subheading);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--tracking-heading);
  line-height: var(--leading-heading);
}

.text-body {
  font-family: var(--font-sans);
  font-size: var(--text-body);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--tracking-body);
  line-height: var(--leading-body);
}

.text-body-medium {
  font-family: var(--font-sans);
  font-size: var(--text-body);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--tracking-body);
  line-height: var(--leading-body);
}