/* TravelToc inspired UI palette
   Palette:
   - Primary Navy: #102038
   - Secondary Blue Grey: #828388
   - Text Navy: #102038
   - Warm Sand: #EAD7C7
   - Soft Cream: #FFF9F4
*/

:root {
  --c-primary: #102038;
  --c-secondary: #828388;
  --c-text: #102038;
  --c-soft: #EAD7C7;
  --c-white: #FFF9F4;

  --font-editorial: "Cormorant Garamond", "Garamond", "Times New Roman", serif;
  --font-ui: "Montserrat", system-ui, -apple-system, Segoe UI, Arial, sans-serif;

  --c-muted: rgba(16,32,56,0.72);
  --c-muted-2: rgba(16,32,56,0.56);
  --c-danger: #B42318;
  --c-danger-bg: rgba(180, 35, 24, 0.08);
  --c-warning: #B54708;
  --c-warning-bg: rgba(181, 71, 8, 0.10);

  --r-xl: 16px;
  --r-lg: 12px;
  --shadow: 0 10px 30px rgba(0,0,0,0.08);
}

* { box-sizing: border-box; }
html, body {
  margin: 0;
  padding: 0;
  background: var(--c-white);
  color: var(--c-text);
  font-family: var(--font-ui);
  font-size: 16px;
  line-height: 1.4;
}

h1, h2, h3 {
  font-family: var(--font-editorial);
  margin: 0 0 10px 0;
}

h1 { font-size: clamp(36px, 3.8vw, 48px); font-weight: 600; letter-spacing: -0.035em; }
h2 { font-size: clamp(28px, 3vw, 38px); font-weight: 600; letter-spacing: -0.025em; }
h3 { font-size: clamp(22px, 2.2vw, 28px); font-weight: 600; letter-spacing: -0.015em; }
.small { font-size: 14px; }

.container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 24px;
}