/* ============================================================
   Weinbau Schweifer — design tokens + baseline

   The palette is sampled from the customer's brush-stroke logo
   (bin/gen_assets.py prints the averages): the painted "S" is
   berry violet #8f4e7c (dark passages #6f3869), the swipe under
   it grape green #669b56, the flecks straw yellow. The grape
   green of the OLD site — rgb(133,172,79) = #85ac4f — is kept
   verbatim as the heritage accent, so the site still "feels"
   like Schweifer.

   Conventions:
   - every rule scopes under #wrapwrap.o-schweifer
   - bare-element resets use :where() so their specificity stays
     at 0 (we still beat Bootstrap: these <link>s load after the
     frontend bundle)
   - bump ?v=N in views/layout.xml for ALL asset urls whenever
     any CSS/JS changes, then `make update` (the ?v lives in a
     DB view)
   ============================================================ */

:root {
  /* --- brand: the painted S ------------------------------------------- */
  --sw-wine: #7d3f6b;          /* berry violet — links, headings accents  */
  --sw-wine-soft: #a4699a;     /* violet on dark grounds                  */
  --sw-wine-deep: #4c2447;     /* dark violet band                        */
  --sw-wine-ink: #351832;      /* deepest violet — footer floor           */
  --sw-wine-wash: #f4ecf3;     /* violet tint surface                     */

  --sw-grape: #85ac4f;         /* HERITAGE grape green of the old site    */
  --sw-grape-deep: #4f6f28;    /* green that passes AA on paper           */
  --sw-grape-wash: #eef3e4;

  --sw-straw: #e3b93f;         /* straw yellow accent (awards, chips)     */
  --sw-straw-deep: #8a6a11;    /* straw that passes AA on paper           */
  --sw-straw-wash: #fbf3dc;

  /* --- surfaces + ink -------------------------------------------------- */
  --sw-paper: #faf6ee;         /* warm paper white — page background      */
  --sw-surface: #f3ece0;       /* alternating sections (warm linen)       */
  --sw-card: #ffffff;
  --sw-sky: #eaf0fa;           /* a whisper of the old site's light blue  */
  --sw-ink: #2a2427;           /* body text                               */
  --sw-muted: #6b6068;         /* secondary text (5.5:1 on paper)         */
  --sw-line: rgba(42, 36, 39, 0.14);
  --sw-line-soft: rgba(42, 36, 39, 0.07);

  /* --- type ------------------------------------------------------------ */
  --sw-font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --sw-font-body: 'Mulish', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --sw-font-script: 'Yellowtail', 'Brush Script MT', cursive;

  /* --- layout ---------------------------------------------------------- */
  --sw-wrap: 1160px;
  --sw-radius: 20px;           /* the old site's round boxes, modernised  */
  --sw-radius-sm: 12px;
  --sw-radius-pill: 999px;
  --sw-header-h: 78px;
  --sw-shadow: 0 18px 40px -28px rgba(53, 24, 50, 0.55);
  --sw-shadow-lift: 0 26px 55px -26px rgba(53, 24, 50, 0.5);
}

/* ---------- baseline ------------------------------------------------- */

#wrapwrap.o-schweifer {
  background: var(--sw-paper);
  color: var(--sw-ink);
  font-family: var(--sw-font-body);
  font-size: 17px;
  line-height: 1.7;
  font-synthesis-weight: none;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

:where(#wrapwrap.o-schweifer) img {
  max-width: 100%;
  height: auto;
}

:where(#wrapwrap.o-schweifer) h1,
:where(#wrapwrap.o-schweifer) h2,
:where(#wrapwrap.o-schweifer) h3,
:where(#wrapwrap.o-schweifer) h4 {
  font-family: var(--sw-font-display);
  font-weight: 600;
  font-variation-settings: 'SOFT' 30, 'WONK' 1;
  line-height: 1.16;
  letter-spacing: -0.005em;
  color: var(--sw-ink);
  text-wrap: balance;
}

:where(#wrapwrap.o-schweifer) p,
:where(#wrapwrap.o-schweifer) ul,
:where(#wrapwrap.o-schweifer) ol {
  margin: 0 0 1em;
}

/* NOTE: this reset weighs (0,0,1) because of the :where(), so Bootstrap's
   `a:hover { text-decoration: underline }` (0,1,1) still wins on hover. The
   components that must never grow that second line are listed once, at class
   specificity, in the "link decoration (kill list)" block of components.css. */
:where(#wrapwrap.o-schweifer) a {
  color: inherit;
  text-decoration: none;
}

:where(#wrapwrap.o-schweifer) strong,
:where(#wrapwrap.o-schweifer) b {
  font-weight: 700;
}

/* Focus: a straw ring on a violet halo — visible on paper AND on the
   dark violet bands. */
.o-schweifer :is(a, button, [tabindex]):focus-visible {
  outline: 3px solid var(--sw-straw);
  outline-offset: 3px;
  border-radius: 6px;
}

/* Text selection in brand colours. */
.o-schweifer ::selection {
  background: var(--sw-straw-wash);
  color: var(--sw-wine-ink);
}

/* Screen-reader-only text (skip link, hidden headings). */
.o-schweifer .screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}
.o-schweifer .skip-link:focus {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 1100;
  width: auto;
  height: auto;
  clip: auto;
  clip-path: none;
  padding: 10px 18px;
  border-radius: var(--sw-radius-pill);
  background: var(--sw-wine-deep);
  color: #fff;
  font-weight: 700;
}