:root {
  --navy: #0f2c4c;
  --teal: #0e6b4f;
  --gold: #c4a35a;
  --paper: #fcfbf7;
  --sand: #f4f1ea;
}
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body { font-family: Inter, ui-sans-serif, system-ui, sans-serif; background: var(--paper); color: #334155; }
[data-lang="ca"].is-off, [data-lang="es"].is-off { display: none !important; }
.img-ph {
  background:
    linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 100%);
  min-height: 220px;
  object-fit: cover;
  width: 100%;
}
.img-ph[src=""] { height: 280px; }
.quiz-step { display: none; }
.quiz-step.active { display: block; }
.opt {
  border: 1px solid #cbd5e1;
  border-radius: 12px;
  padding: 14px 16px;
  cursor: pointer;
  background: #fff;
  transition: 0.15s ease;
}
.opt:hover, .opt.selected { border-color: var(--teal); background: #ecfdf5; }
.cookie-bar { box-shadow: 0 -8px 30px rgba(15, 44, 76, 0.08); }
.prose-legal h2 { font-size: 1.15rem; color: var(--navy); margin-top: 1.5rem; font-weight: 700; }
.prose-legal p, .prose-legal li { font-size: 0.95rem; line-height: 1.65; }