/* Casalta design system — extracted verbatim from the approved design
   mockups (casalta-homepage/*.dc.html): fonts, color tokens, light/dark
   themes. Every page imports this file first, before its own page.css. */

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

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }

body {
  font-family: 'Manrope', system-ui, sans-serif;
  background: var(--bg);
  color: var(--text);
  min-height: 100%;

  --bg: #FAF7F1;
  --surface: #FFFFFF;
  --surface-2: #F2EBDC;
  --border: #E7DFCE;
  --text: #26221C;
  --muted: #756B5C;
  --shadow: rgba(38, 34, 28, .12);
  --accent: oklch(0.45 0.11 152);
  --accent-text: #FFFFFF;
  --accent2: oklch(0.45 0.11 35);
  --bad: oklch(0.52 0.16 25);
  --good: oklch(0.55 0.14 152);
}

body[data-theme="dark"] {
  --bg: #171512;
  --surface: #211E1A;
  --surface-2: #29241E;
  --border: #383025;
  --text: #F3EEE3;
  --muted: #B4AA92;
  --shadow: rgba(0, 0, 0, .5);
  --accent: oklch(0.74 0.11 152);
  --accent-text: #171512;
  --accent2: oklch(0.74 0.11 35);
  --bad: oklch(0.7 0.16 25);
  --good: oklch(0.72 0.14 152);
}

a { text-decoration: none; color: inherit; }
button { font: inherit; cursor: pointer; background: none; border: none; color: inherit; }
input, select, textarea { font: inherit; }

.container { max-width: 1360px; margin: 0 auto; padding: 0 40px; }
.container-wide { max-width: 1520px; margin: 0 auto; padding: 0 40px; }

@media (max-width: 900px) {
  .container, .container-wide { padding: 0 18px; }
}