@import url("./style.css?v=cf0c8041");

/* Dark variant — overrides the light palette from style.css.
   Everything else (layout, type, spacing) stays identical. */
:root {
  --bg: #17140f;
  --bg-alt: #201b14;
  --paper: #1c1712;
  --ink: #efe8dc;
  --ink-soft: #a89c88;
  --accent: #cdaa6c;
  --line: #34302a;
}

/* Give the flat dark panels some depth: a soft warm glow behind the
   logo/hero and footer, plus a fine film-grain texture over everything. */
body {
  position: relative;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 999;
  pointer-events: none;
  opacity: 0.05;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22200%22%20height%3D%22200%22%3E%0A%3Cfilter%20id%3D%22n%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.85%22%20numOctaves%3D%222%22%20stitchTiles%3D%22stitch%22/%3E%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220%200%200%200%201%20%200%200%200%200%200.95%20%200%200%200%200%200.85%20%200%200%200%200.35%200%22/%3E%3C/filter%3E%0A%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20filter%3D%22url%28%23n%29%22/%3E%0A%3C/svg%3E");
  background-size: 200px 200px;
}

header {
  background:
    radial-gradient(ellipse 820px 420px at 50% 0%, rgba(205,170,108,0.14), transparent 70%),
    var(--bg);
}
footer {
  background:
    radial-gradient(ellipse 820px 380px at 50% 100%, rgba(205,170,108,0.08), transparent 70%),
    var(--bg);
}
section.category {
  background: radial-gradient(ellipse 1100px 500px at 50% 0%, rgba(255,255,255,0.02), transparent 60%), var(--bg);
}
section.category.alt {
  background: radial-gradient(ellipse 1100px 500px at 50% 0%, rgba(255,255,255,0.02), transparent 60%), var(--bg-alt);
}
.contact {
  background: radial-gradient(ellipse 900px 500px at 50% 30%, rgba(205,170,108,0.10), transparent 70%), var(--paper);
}
.intro {
  background: radial-gradient(ellipse 700px 500px at 50% 20%, rgba(205,170,108,0.06), transparent 70%);
}