/* Barter Mail. One serif, putty ground, ink structure, ultramarine for what you can touch. */

:root {
  --ground: #DDD3BF;
  --raised: #EAE3D4;
  --deep: #C9BEA7;
  --ink: #15161C;
  --muted: #575146;
  --line: #9A8F7B;
  --accent: #2136B4;

  --serif: Charter, 'Bitstream Charter', 'Sitka Text', Cambria, Georgia, serif;

  --fs-xs: 0.75rem;
  --fs-s: 0.875rem;
  --fs-b: 1.0625rem;
  --fs-m: 1.3125rem;
  --fs-l: 1.75rem;
  --fs-xl: 2.25rem;
  --fs-xxl: 3rem;

  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --gutter: clamp(1rem, 4vw, 3rem);
  --max: 82rem;
  --bar: 6px;
}

*,
*::before,
*::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--ground);
  color: var(--ink);
  font-family: var(--serif);
  font-size: var(--fs-b);
  line-height: 1.65;
  font-weight: 400;
  font-kerning: normal;
  font-variant-numeric: oldstyle-nums proportional-nums;
  text-rendering: optimizeLegibility;
  overflow-x: clip;
}

h1, h2, h3, h4 {
  margin: 0;
  font-weight: 400;
  line-height: 1.2;
  text-wrap: balance;
  overflow-wrap: anywhere;
}

p, ul, ol, dl, dd, figure { margin: 0; }

svg { display: block; }

.bm-art {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
}

a {
  color: var(--accent);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
  overflow-wrap: anywhere;
}

a:hover { text-decoration-thickness: 2px; }

:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
}

b { font-weight: 700; }

.bm-sr {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.bm-skip {
  position: absolute;
  left: 1rem;
  top: -4rem;
  z-index: 20;
  background: var(--ink);
  color: var(--raised);
  padding: 0.6rem 1rem;
  text-decoration: none;
}

.bm-skip:focus { top: 1.25rem; }

.bm-wrap {
  width: min(calc(100% - 2 * var(--gutter)), var(--max));
  margin-inline: auto;
}

.bm-label {
  font-size: var(--fs-s);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.08em;
  font-variant-caps: all-small-caps;
  color: var(--muted);
}

/* ---------- Header ---------- */

.bm-topbar {
  height: 14px;
  background: var(--ink);
}

.bm-head__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 2rem;
  padding-block: 1.15rem;
}

.bm-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.85rem;
  color: var(--ink);
  text-decoration: none;
  min-width: 0;
}

.bm-mark {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex: none;
}

.bm-mark__circle {
  width: 1.1rem;
  height: 1.1rem;
  border-radius: 50%;
  background: var(--accent);
}

.bm-mark__square {
  width: 1.1rem;
  height: 1.1rem;
  background: var(--ink);
}

.bm-mark__bar {
  width: 1.6rem;
  height: 0.42rem;
  background: var(--ink);
}

.bm-brand__name {
  font-size: var(--fs-m);
  font-weight: 400;
  letter-spacing: -0.005em;
  line-height: 1;
}

.bm-nav__list {
  display: flex;
  gap: clamp(1rem, 2.4vw, 2.25rem);
  list-style: none;
  margin: 0;
  padding: 0;
}

.bm-nav__list a {
  position: relative;
  display: inline-block;
  padding-block: 0.35rem;
  color: var(--ink);
  text-decoration: none;
  white-space: nowrap;
  transition: color 180ms var(--ease);
}

.bm-nav__list a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: var(--ink);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 240ms var(--ease);
}

.bm-nav__list a:hover::after { transform: scaleX(1); }

.bm-nav__list a[aria-current="page"] { color: var(--accent); }

.bm-nav__list a[aria-current="page"]::after {
  background: var(--accent);
  transform: scaleX(1);
}

/* Phone menu: details and summary, so it opens with JavaScript off. */
.bm-menu { display: none; }

.bm-menu__toggle {
  list-style: none;
}

.bm-menu__toggle::-webkit-details-marker { display: none; }
.bm-menu__toggle::marker { content: ""; }

@keyframes bm-menu-open {
  from { clip-path: inset(0 0 100% 0); }
  to { clip-path: inset(0 0 0 0); }
}

@keyframes bm-menu-close {
  from { clip-path: inset(0 0 0 0); }
  to { clip-path: inset(0 0 100% 0); }
}

@media (max-width: 759px) {
  .bm-head {
    position: relative;
    z-index: 10;
  }

  .bm-nav__list { display: none; }

  .bm-menu { display: block; }

  .bm-menu__toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 2.75rem;
    padding: 0.5rem 0.85rem;
    background: none;
    border: 2px solid var(--ink);
    color: var(--ink);
    font-size: var(--fs-s);
    white-space: nowrap;
    cursor: pointer;
    user-select: none;
  }

  .bm-menu__icon {
    position: relative;
    width: 1.1rem;
    height: 2px;
    background: currentColor;
    transition: background-color 180ms var(--ease);
  }

  .bm-menu__icon::before,
  .bm-menu__icon::after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background: currentColor;
    transition: transform 280ms var(--ease);
  }

  .bm-menu__icon::before { transform: translateY(-6px); }
  .bm-menu__icon::after { transform: translateY(6px); }

  .bm-menu[open]:not(.is-closing) .bm-menu__icon { background: transparent; }
  .bm-menu[open]:not(.is-closing) .bm-menu__icon::before { transform: rotate(45deg); }
  .bm-menu[open]:not(.is-closing) .bm-menu__icon::after { transform: rotate(-45deg); }

  .bm-menu__panel {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    padding: 0 var(--gutter) 0.5rem;
    background: var(--ground);
    border-bottom: var(--bar) solid var(--ink);
  }

  .bm-menu[open] .bm-menu__panel { animation: bm-menu-open 280ms var(--ease) both; }
  .bm-menu.is-closing .bm-menu__panel { animation: bm-menu-close 280ms var(--ease) both; }

  .bm-menu__list {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .bm-menu__list li { border-top: 1px solid var(--line); }
  .bm-menu__list li:first-child { margin-top: 0.75rem; border-top: 3px solid var(--ink); }

  .bm-menu__list a {
    display: block;
    padding: 0.85rem 0;
    color: var(--ink);
    text-decoration: none;
    transition: color 180ms var(--ease);
  }

  .bm-menu__list a:hover { color: var(--accent); }
  .bm-menu__list a[aria-current="page"] { color: var(--accent); }
}

/* ---------- Shared pieces ---------- */

.bm-arrow {
  position: relative;
  display: inline-block;
  flex: none;
  width: 1.05rem;
  height: 2px;
  background: currentColor;
  transition: transform 240ms var(--ease);
}

.bm-arrow::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  width: 0.45rem;
  height: 0.45rem;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: translateY(-50%) rotate(45deg);
}

.bm-button {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  align-self: flex-start;
  padding: 0.8rem 1.2rem 0.85rem;
  background: var(--accent);
  color: var(--raised);
  border: 0;
  font: inherit;
  font-weight: 500;
  line-height: 1.2;
  text-decoration: none;
  transition: background-color 180ms var(--ease);
  overflow-wrap: normal;
}

.bm-button:hover { background: var(--ink); }
.bm-button:hover .bm-arrow { transform: translateX(4px); }

.bm-textlink {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  padding-bottom: 0.25rem;
  color: var(--ink);
  border-bottom: 2px solid var(--ink);
  text-decoration: none;
  transition: color 180ms var(--ease), border-color 180ms var(--ease);
}

.bm-textlink:hover { color: var(--accent); border-color: var(--accent); }
.bm-textlink:hover .bm-arrow { transform: translateX(4px); }

.bm-key {
  display: block;
  flex: none;
}

.bm-key--circle {
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 50%;
  background: currentColor;
}

.bm-key--square {
  width: 0.7rem;
  height: 0.7rem;
  border: 2px solid currentColor;
}

.bm-key--bar {
  width: 1.3rem;
  height: 0.36rem;
  background: currentColor;
}

.bm-figure {
  font-size: var(--fs-xxl);
  line-height: 1;
  letter-spacing: -0.01em;
  font-variant-numeric: oldstyle-nums;
  overflow-wrap: anywhere;
}

.bm-figure__sep {
  display: inline-block;
  margin-inline: 0.3em;
  font-size: var(--fs-m);
  color: var(--muted);
  letter-spacing: 0;
}

.bm-figure__unit {
  display: inline-block;
  margin-left: 0.2em;
  font-size: var(--fs-m);
  color: var(--muted);
}

.bm-section { padding-block: clamp(3rem, 6vw, 5rem); }
.bm-section--roomy { padding-block: clamp(4rem, 8vw, 7rem) clamp(3.5rem, 7vw, 6rem); }
.bm-section--tight { padding-block: clamp(2.5rem, 5vw, 4rem); }

.bm-section-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem 2rem;
  margin-bottom: clamp(1.5rem, 3vw, 2.25rem);
}

.bm-section-head > * { min-width: 0; }

.bm-section-head h2 {
  margin-top: 0.45rem;
  font-size: var(--fs-l);
}

.bm-section-head__aside {
  max-width: 36ch;
  color: var(--muted);
  font-size: var(--fs-s);
}

.bm-split {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 2rem clamp(1.5rem, 3vw, 3rem);
}

.bm-split__head { grid-column: 1 / span 4; min-width: 0; }
.bm-split__body { grid-column: 6 / -1; min-width: 0; }

.bm-split__head h2 {
  margin-top: 0.45rem;
  font-size: var(--fs-l);
}

.bm-split__text {
  margin-top: 1rem;
  color: var(--muted);
  max-width: 40ch;
}

@media (max-width: 899px) {
  .bm-split__head,
  .bm-split__body { grid-column: 1 / -1; }
}

/* ---------- Page heads ---------- */

.bm-pagehead {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 1rem clamp(1.5rem, 3vw, 3rem);
  align-items: end;
  padding-block: clamp(2.25rem, 5vw, 3.75rem) clamp(2rem, 4vw, 3rem);
  border-top: 1px solid var(--line);
}

.bm-pagehead__label { grid-column: 1 / -1; }

.bm-pagehead h1 {
  grid-column: 1 / span 6;
  font-size: var(--fs-l);
  line-height: 1.12;
  letter-spacing: -0.01em;
  max-width: 20ch;
}

.bm-pagehead__lede {
  grid-column: 8 / -1;
  max-width: 44ch;
  font-size: var(--fs-m);
  line-height: 1.45;
  color: var(--muted);
}

@media (max-width: 899px) {
  .bm-pagehead h1,
  .bm-pagehead__lede { grid-column: 1 / -1; }
}

/* ---------- Home intro and calendar strip ---------- */

.bm-intro {
  padding-block: clamp(1.75rem, 4vw, 2.75rem) clamp(1.25rem, 2.5vw, 1.75rem);
  border-top: 1px solid var(--line);
}

.bm-intro__lead {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 0.75rem clamp(1.5rem, 3vw, 3rem);
  min-width: 0;
}

.bm-intro__line {
  grid-column: 1 / span 8;
  min-width: 0;
  max-width: 19ch;
  font-size: clamp(2rem, 1.05rem + 3.1vw, 3.75rem);
  font-weight: 400;
  line-height: 1.06;
  letter-spacing: -0.02em;
  text-wrap: balance;
}

.bm-intro__offer {
  grid-column: 1 / span 7;
  min-width: 0;
  max-width: 52ch;
  margin-top: clamp(0.5rem, 1.2vw, 1rem);
  font-size: var(--fs-m);
  line-height: 1.4;
}

/* The brand's circle, square and bar, set large beside the statement: the sorting
   room's keys (in stock, taking in, booking open) and the folded corner that marks
   the month. Drawn, not decorative filler: every shape is one the calendar uses. */
.bm-intro__art {
  grid-column: 9 / -1;
  grid-row: 1 / span 2;
  align-self: center;
  min-width: 0;
}
.bm-intro__art svg { display: block; width: 100%; height: auto; max-width: 25rem; margin-left: auto; }
.bm-art__ground { fill: transparent; }
.bm-art__square { fill: var(--ink); }
.bm-art__circle { fill: var(--accent); }
.bm-art__ring { fill: none; stroke: var(--ground); stroke-width: 3; }
.bm-art__bar { fill: var(--ink); }
.bm-art__tick { fill: var(--ink); }
.bm-art__tick--open { fill: none; stroke: var(--ink); stroke-width: 3; }
.bm-art__fold { fill: var(--ground); }

@media (max-width: 899px) {
  .bm-intro__line,
  .bm-intro__offer { grid-column: 1 / -1; }
  .bm-intro__art { display: none; }
}

/* The strip runs edge to edge; its caption lines up with the content column. */
.bm-strip__caption {
  width: min(calc(100% - 2 * var(--gutter)), var(--max));
  margin-inline: auto;
  padding: 0 0 0.55rem;
}

.bm-strip {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--bar);
  padding: var(--bar);
  background: var(--ink);
}

.bm-strip__month {
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 0.35rem;
  min-width: 0;
  min-height: clamp(7.5rem, 10vw, 10rem);
  padding: 0.75rem 0.8rem 0.85rem;
  overflow: hidden;
  background: var(--ground);
  color: var(--ink);
  text-decoration: none;
  transition: background-color 180ms var(--ease), color 180ms var(--ease);
}

.bm-strip__label {
  font-size: var(--fs-s);
  letter-spacing: 0.08em;
  font-variant-caps: all-small-caps;
  color: var(--ink);
  transition: color 180ms var(--ease);
}

.bm-strip__initial {
  align-self: center;
  font-size: var(--fs-xl);
  line-height: 1;
  transition: transform 240ms var(--ease);
}

.bm-strip__keys {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 0.75rem;
}

.bm-strip__month:hover .bm-strip__initial { transform: translateX(4px); }
.bm-strip__month:hover .bm-strip__label { color: var(--ink); }

.bm-strip__month[aria-selected="true"] {
  background: var(--accent);
  color: var(--raised);
}

.bm-strip__month[aria-selected="true"] .bm-strip__label { color: var(--raised); }

.bm-strip__month:focus-visible {
  outline: 3px solid var(--ink);
  outline-offset: -9px;
}

.bm-strip__month[aria-selected="true"]:focus-visible { outline-color: var(--raised); }

.bm-fold {
  position: absolute;
  top: 0;
  right: 0;
  width: 1.5rem;
  height: 1.5rem;
  background: var(--ink);
  border-bottom-left-radius: 100%;
}

@media (max-width: 1099px) {
  .bm-strip__month { padding-inline: 0.5rem; }
  .bm-strip__keys { gap: 0.22rem; }
  .bm-strip__month .bm-key--circle,
  .bm-strip__month .bm-key--square { width: 0.5rem; height: 0.5rem; }
  .bm-strip__month .bm-key--square { border-width: 1.5px; }
  .bm-strip__month .bm-key--bar { width: 0.85rem; height: 0.3rem; }
}

@media (max-width: 759px) {
  .bm-strip { grid-template-columns: repeat(6, minmax(0, 1fr)); }

  .bm-strip__month {
    min-height: 6.5rem;
    padding: 0.55rem 0.5rem 0.65rem;
  }

  .bm-strip__label { letter-spacing: 0.06em; }
  .bm-strip__keys { gap: 0.22rem; }
  .bm-strip__month .bm-key--circle,
  .bm-strip__month .bm-key--square { width: 0.5rem; height: 0.5rem; }
  .bm-strip__month .bm-key--square { border-width: 1.5px; }
  .bm-strip__month .bm-key--bar { width: 0.85rem; height: 0.3rem; }
  .bm-fold { width: 1.1rem; height: 1.1rem; }
}

.bm-drawer {
  background: var(--deep);
  border-bottom: var(--bar) solid var(--ink);
}

.bm-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.75rem;
  padding: 1rem 0;
  margin: 0;
  list-style: none;
  border-bottom: 1px solid var(--line);
  font-size: var(--fs-s);
}

.bm-legend li {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}

.bm-legend__now { display: none !important; }
.bm-js .bm-legend__now { display: flex !important; }

.bm-legend__fold {
  width: 0.85rem;
  height: 0.85rem;
  background: var(--ink);
  border-bottom-left-radius: 100%;
}

.bm-panel + .bm-panel { border-top: 1px solid var(--line); }

.bm-panel__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) repeat(3, minmax(0, 1fr));
  gap: 1.75rem clamp(1.5rem, 3vw, 2.75rem);
  padding-block: 2.25rem 2.75rem;
}

.bm-panel__inner > * { min-width: 0; }

.bm-panel__head .bm-label { color: var(--ink); }

.bm-panel__month {
  margin-top: 0.35rem;
  font-size: var(--fs-l);
}

.bm-panel__line {
  margin-top: 0.6rem;
  max-width: 26ch;
  font-size: var(--fs-m);
  line-height: 1.4;
}

.bm-panel__key {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  min-height: 1.6rem;
  padding-bottom: 0.6rem;
  margin-bottom: 0.6rem;
  border-bottom: 2px solid var(--ink);
  font-size: var(--fs-s);
  font-weight: 400;
  letter-spacing: 0.08em;
  font-variant-caps: all-small-caps;
}

.bm-panel__col p {
  font-size: var(--fs-b);
  line-height: 1.55;
  max-width: 34ch;
}

.bm-panel__more { display: none; }

.bm-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.bm-list li {
  position: relative;
  padding: 0.42rem 0 0.42rem 1.1rem;
  border-bottom: 1px solid var(--line);
  line-height: 1.45;
}

.bm-list li:last-child { border-bottom: 0; }

.bm-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1.02em;
  width: 0.4rem;
  height: 0.4rem;
  background: var(--ink);
  transition: background-color 180ms var(--ease);
}

.bm-list li:hover::before { background: var(--accent); }

.bm-js .bm-panels:not(.bm-panels--live) .bm-panel { display: none; }

.bm-panels--live { display: grid; }

.bm-panels--live .bm-panel {
  grid-area: 1 / 1;
  display: grid;
  grid-template-rows: 0fr;
  border-top: 0;
  background: var(--deep);
  visibility: hidden;
  transition: grid-template-rows 280ms var(--ease), visibility 0s linear 280ms;
}

.bm-panels--live .bm-panel.is-open {
  z-index: 1;
  grid-template-rows: 1fr;
  visibility: visible;
  transition: grid-template-rows 280ms var(--ease), visibility 0s;
}

.bm-panel__clip {
  min-height: 0;
  overflow: hidden;
}

.bm-panel:focus-visible {
  outline: 3px solid var(--ink);
  outline-offset: -3px;
}

@media (max-width: 999px) {
  .bm-panel__inner { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bm-panel__head { grid-column: 1 / -1; }
  .bm-panel__line { max-width: 40ch; }
}

@media (max-width: 639px) {
  .bm-panel__inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
    padding-block: 1.75rem 2rem;
  }

  .bm-panels--trim .bm-panel:not(.is-more) .bm-panel__col ~ .bm-panel__col { display: none; }

  .bm-panel__more {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    justify-self: start;
    padding: 0.55rem 0.9rem;
    background: none;
    border: 2px solid var(--ink);
    color: var(--ink);
    font: inherit;
    font-size: var(--fs-s);
    cursor: pointer;
  }

  .bm-panel__more::after {
    content: "";
    flex: none;
    width: 0.6rem;
    height: 0.6rem;
    background: var(--ink);
    transition: transform 280ms var(--ease);
  }

  .bm-panel__more[aria-expanded="true"]::after { transform: rotate(45deg); }
}

/* ---------- Bento ---------- */

.bm-facts { padding-block: clamp(3.5rem, 7vw, 6rem) clamp(3rem, 6vw, 5rem); }

.bm-bento {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 10px;
  grid-auto-flow: dense;
}

.bm-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  min-width: 0;
  padding: 1.5rem 1.6rem 1.7rem;
  overflow: hidden;
  background: var(--raised);
  border: 1px solid var(--line);
}

.bm-tile > .bm-label { padding-right: 3.25rem; }

.bm-tile .bm-figure { margin-top: 0.85rem; }

.bm-tile__title {
  font-size: var(--fs-m);
  line-height: 1.25;
}

.bm-tile__title--lead {
  margin-top: 0.85rem;
  font-size: var(--fs-l);
}

.bm-tile__text {
  max-width: 44ch;
  font-size: var(--fs-s);
  line-height: 1.6;
  color: var(--muted);
}

.bm-tile__corner {
  position: absolute;
  top: 0;
  right: 0;
  width: 3rem;
  height: 3rem;
  background: var(--ink);
  border-bottom-left-radius: 100%;
}

.bm-tile__edge {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 10px;
  background: var(--ink);
}

.bm-tile__edge--top {
  right: 0;
  bottom: auto;
  width: auto;
  height: 10px;
}

.bm-tile--edged { padding-left: 2.4rem; }
.bm-tile--topped { padding-top: 2.1rem; }

.bm-tile__key {
  position: absolute;
  top: 1.5rem;
  right: 1.6rem;
  color: var(--ink);
}

.bm-tile__key.bm-key--circle,
.bm-tile__key.bm-key--square {
  width: 1.35rem;
  height: 1.35rem;
}

.bm-tile__key.bm-key--square { border-width: 3px; }

.bm-tile--a { grid-column: 1 / span 5; grid-row: 1 / span 2; padding: 1.75rem 1.9rem 1.9rem; }
.bm-tile--a .bm-tile__corner { width: 7rem; height: 7rem; }
.bm-tile--a > .bm-label { padding-right: 7.5rem; }
.bm-tile--a .bm-figure { margin-top: 2.5rem; }
.bm-tile--a .bm-tile__text { font-size: var(--fs-b); max-width: 40ch; }
.bm-tile--a .bm-button { margin-top: auto; }
.bm-tile--b { grid-column: 6 / span 4; grid-row: 1; }
.bm-tile--c { grid-column: 10 / span 3; grid-row: 1; }
.bm-tile--f { grid-column: 6 / span 3; grid-row: 2; }
.bm-tile--h { grid-column: 9 / span 4; grid-row: 2; }
.bm-tile--d { grid-column: 1 / span 7; grid-row: 3 / span 2; }
.bm-tile--d .bm-mini { margin-top: auto; max-width: 36rem; }
.bm-tile--e { grid-column: 8 / span 5; grid-row: 3; }
.bm-tile--g { grid-column: 8 / span 5; grid-row: 4; }

.bm-sum {
  margin: 1.25rem 0 1.75rem;
  border-top: 2px solid var(--ink);
}

.bm-sum > div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  padding: 0.6rem 0;
  border-bottom: 1px solid var(--line);
}

.bm-sum dt {
  min-width: 0;
  font-size: var(--fs-s);
  color: var(--muted);
}

.bm-sum dd {
  flex: none;
  font-variant-numeric: oldstyle-nums tabular-nums;
}

.bm-sum__total { border-bottom: 2px solid var(--ink) !important; }
.bm-sum__total dt { color: var(--ink); }

.bm-mini {
  display: flex;
  align-items: flex-end;
  gap: 5px;
  max-width: 26rem;
  margin: 0;
  padding-top: 1.25rem;
}

.bm-mini span {
  flex: var(--cm) 1 0;
  min-width: 0;
  aspect-ratio: 1;
  border: 2px solid var(--ink);
}

.bm-mini span:last-child { border-top-width: 8px; }

.bm-sack {
  width: 6.5rem;
  max-width: 100%;
  margin-top: 0.5rem;
}

@media (max-width: 999px) {
  .bm-bento { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .bm-tile--a,
  .bm-tile--d { grid-column: span 6; grid-row: auto; }
  .bm-tile--b,
  .bm-tile--c,
  .bm-tile--e,
  .bm-tile--f,
  .bm-tile--g,
  .bm-tile--h { grid-column: span 3; grid-row: auto; }
  .bm-tile--a .bm-figure { margin-top: 1.5rem; }
  .bm-tile--d .bm-figure { margin-top: 0.85rem; }
}

@media (max-width: 599px) {
  .bm-bento { grid-template-columns: minmax(0, 1fr); }
  .bm-tile { grid-column: 1 / -1 !important; }
  .bm-tile--a { padding: 1.5rem 1.4rem 1.6rem; }
  .bm-tile--a .bm-tile__corner { width: 5rem; height: 5rem; }
  .bm-tile--a > .bm-label { padding-right: 5.5rem; }
}

/* ---------- Note from Siobhán ---------- */

.bm-note {
  border-top: var(--bar) solid var(--ink);
  padding-block: clamp(3.5rem, 7vw, 6rem) clamp(4.5rem, 9vw, 7.5rem);
}

.bm-note__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 2rem clamp(1.5rem, 3vw, 3rem);
}

.bm-note__aside { grid-column: 1 / span 4; min-width: 0; }
.bm-note__body { grid-column: 6 / -1; min-width: 0; }

.bm-note__circle {
  display: block;
  width: 1.4rem;
  height: 1.4rem;
  margin-bottom: 1.1rem;
  border-radius: 50%;
  background: var(--ink);
}

.bm-note__aside h2 {
  margin-top: 0.45rem;
  font-size: var(--fs-l);
}

.bm-note__meta {
  margin-top: 1rem;
  max-width: 30ch;
  font-size: var(--fs-s);
  color: var(--muted);
}

.bm-note__body p:first-child {
  max-width: 46ch;
  font-size: var(--fs-m);
  font-style: italic;
  line-height: 1.6;
}

.bm-note__sign {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  margin-top: 1.5rem;
  font-size: var(--fs-m);
  font-style: italic;
}

.bm-note__rule {
  display: block;
  width: 2.5rem;
  height: 4px;
  background: var(--ink);
}

@media (max-width: 899px) {
  .bm-note__aside,
  .bm-note__body { grid-column: 1 / -1; }
}

/* ---------- How it works ---------- */

.bm-steps {
  display: grid;
  grid-template-columns: 1.25fr 1fr 0.9fr 1.15fr;
  gap: var(--bar);
  padding: var(--bar);
  margin: 0;
  list-style: none;
  background: var(--ink);
}

.bm-step {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-width: 0;
  padding: 1.75rem clamp(1.1rem, 2vw, 1.75rem) 2rem;
  background: var(--ground);
}

.bm-step--raised { background: var(--raised); }

.bm-step__holder {
  display: flex;
  align-items: flex-end;
  height: 3.5rem;
  margin-bottom: 0.5rem;
}

.bm-num {
  display: grid;
  place-items: center;
  flex: none;
  width: 3.5rem;
  height: 3.5rem;
  font-size: var(--fs-l);
  line-height: 1;
}

.bm-num--circle {
  border-radius: 50%;
  background: var(--ink);
  color: var(--raised);
}

.bm-num--square { border: 3px solid var(--ink); }

.bm-num--half {
  width: 4rem;
  height: 2rem;
  padding-bottom: 0.15rem;
  border-radius: 4rem 4rem 0 0;
  background: var(--ink);
  color: var(--raised);
  place-items: end center;
  font-size: var(--fs-m);
}

.bm-num--bar {
  width: 5.5rem;
  height: 1.6rem;
  padding-left: 0.65rem;
  background: var(--ink);
  color: var(--raised);
  justify-items: start;
  font-size: var(--fs-m);
}

.bm-step__title { font-size: var(--fs-m); }

.bm-step__text {
  font-size: var(--fs-s);
  line-height: 1.6;
  color: var(--muted);
  max-width: 42ch;
}

.bm-step__meta {
  margin-top: auto;
  padding-top: 0.85rem;
  border-top: 1px solid var(--line);
  font-size: var(--fs-s);
  letter-spacing: 0.08em;
  font-variant-caps: all-small-caps;
}

@media (max-width: 899px) {
  .bm-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 539px) {
  .bm-steps { grid-template-columns: minmax(0, 1fr); }
}

.bm-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}

.bm-prices {
  width: 100%;
  min-width: 34rem;
  border-collapse: collapse;
  border-top: 4px solid var(--ink);
  border-bottom: 4px solid var(--ink);
}

.bm-prices thead th {
  padding: 0.85rem 0.75rem 0.7rem 0;
  border-bottom: 1px solid var(--ink);
  font-size: var(--fs-xs);
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: left;
  color: var(--muted);
}

.bm-prices thead .bm-prices__right { text-align: right; padding-right: 0; }

.bm-prices tbody th,
.bm-prices tbody td {
  padding: 1.05rem 0.75rem 1.05rem 0;
  vertical-align: baseline;
}

.bm-prices tbody tr + tr > * { border-top: 1px solid var(--line); }

.bm-prices tbody th {
  width: 32%;
  font-weight: 400;
  text-align: left;
}

.bm-prices tbody td {
  font-size: var(--fs-s);
  line-height: 1.55;
  color: var(--muted);
}

.bm-prices tbody tr th,
.bm-prices tbody tr td { transition: transform 220ms var(--ease); }

.bm-prices .bm-price {
  padding-right: 0;
  text-align: right;
  white-space: nowrap;
  font-size: var(--fs-m);
  color: var(--ink);
  font-variant-numeric: oldstyle-nums tabular-nums;
}

.bm-price__inner {
  display: inline-block;
  font-weight: 700;
  font-variant-numeric: oldstyle-nums tabular-nums;
}

@media (max-width: 599px) {
  .bm-prices { display: block; min-width: 0; }
  .bm-prices tbody { display: block; }
  .bm-prices thead { display: none; }

  .bm-prices tbody tr {
    display: grid;
    grid-template-columns: 1fr auto;
    column-gap: 1rem;
    row-gap: 0.3rem;
    padding-block: 0.9rem;
  }

  .bm-prices tbody tr + tr { border-top: 1px solid var(--line); }
  .bm-prices tbody tr + tr > * { border-top: 0; }

  .bm-prices tbody th,
  .bm-prices tbody td {
    width: auto;
    padding: 0;
    border: 0;
  }

  .bm-prices tbody td:not(.bm-price) {
    grid-column: 1 / -1;
    grid-row: 2;
  }
}

.bm-fn {
  margin-left: 0.15em;
  font-size: 0.7em;
  font-weight: 400;
  color: var(--accent);
}

.bm-footnote {
  display: flex;
  gap: 0.6rem;
  margin-top: 1rem;
  max-width: 62ch;
  font-size: var(--fs-s);
  color: var(--muted);
}

.bm-footnote__mark { color: var(--accent); flex: none; }

.bm-turn {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 14px minmax(0, 1fr);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.bm-turn__half {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  min-width: 0;
  padding: 2rem clamp(1.25rem, 3vw, 2.75rem) 2.25rem 0;
}

.bm-turn__half + .bm-turn__bar + .bm-turn__half,
.bm-turn__bar + .bm-turn__half { padding-left: clamp(1.25rem, 3vw, 2.75rem); padding-right: 0; }

.bm-turn__bar { background: var(--ink); }

.bm-turn .bm-figure { margin-top: 0.75rem; }

.bm-turn__title { font-size: var(--fs-m); }

.bm-turn__text {
  max-width: 44ch;
  color: var(--muted);
}

.bm-turn__where {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 1.75rem;
  padding-top: 1.35rem;
}

.bm-turn__where .bm-label {
  flex: none;
  color: var(--ink);
}

.bm-turn__post {
  flex: 1 1 24rem;
  min-width: 0;
  max-width: 62ch;
}

@media (max-width: 699px) {
  .bm-turn { grid-template-columns: minmax(0, 1fr); }
  .bm-turn__bar { height: 14px; }
  .bm-turn__half,
  .bm-turn__bar + .bm-turn__half { padding: 1.75rem 0; }
}

/* ---------- Next block ---------- */

.bm-next { border-bottom: 0; }

.bm-next__title {
  margin-top: 0.3rem;
  max-width: 32ch;
  font-size: var(--fs-l);
  line-height: 1.25;
}

.bm-next__links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 1.75rem;
  min-width: 0;
}

.bm-next__links .bm-button { align-self: center; }

/* ---------- Accordions ---------- */

.bm-acc {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 4px solid var(--ink);
  border-bottom: 1px solid var(--line);
}

.bm-acc__item + .bm-acc__item { border-top: 1px solid var(--line); }

.bm-acc__q {
  font-size: var(--fs-b);
  line-height: 1.4;
}

.bm-acc__btn {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  width: 100%;
  padding: 1.15rem 0;
  background: none;
  border: 0;
  color: var(--ink);
  font: inherit;
  font-weight: 400;
  text-align: left;
  cursor: pointer;
}

.bm-acc__text {
  min-width: 0;
  overflow-wrap: anywhere;
  transition: color 180ms var(--ease);
}

.bm-acc__mark {
  display: none;
  flex: none;
  width: 0.8rem;
  height: 0.8rem;
  margin-right: 0.3rem;
  background: var(--ink);
  transition: transform 280ms var(--ease), background-color 180ms var(--ease);
}

.bm-acc--live .bm-acc__mark { display: block; }

.bm-acc__btn:hover .bm-acc__mark { background: var(--accent); }
.bm-acc__btn[aria-expanded="true"] .bm-acc__mark { transform: rotate(45deg); }
.bm-acc__btn[aria-expanded="true"] .bm-acc__text { color: var(--accent); }

.bm-acc__a {
  display: grid;
  grid-template-rows: 1fr;
}

.bm-acc__clip {
  min-height: 0;
  overflow: hidden;
}

.bm-acc__body {
  max-width: 62ch;
  padding-bottom: 1.35rem;
  color: var(--muted);
}

.bm-acc--live .bm-acc__a {
  grid-template-rows: 0fr;
  visibility: hidden;
  transition: grid-template-rows 280ms var(--ease), visibility 0s linear 280ms;
}

.bm-acc--live .bm-acc__item.is-open .bm-acc__a {
  grid-template-rows: 1fr;
  visibility: visible;
  transition: grid-template-rows 280ms var(--ease), visibility 0s;
}

/* ---------- What we take ---------- */

.bm-band {
  background: var(--raised);
  border-top: var(--bar) solid var(--ink);
  border-bottom: var(--bar) solid var(--ink);
  padding-block: 2.25rem 2.75rem;
}

.bm-band__head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.5rem 2rem;
  margin-bottom: 1.75rem;
}

.bm-band__head .bm-label { color: var(--ink); }

.bm-band__note {
  font-size: var(--fs-s);
  color: var(--muted);
}

.bm-sizes {
  display: grid;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  gap: 1.25rem 0.75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.bm-size { min-width: 0; }

.bm-size__plot {
  display: flex;
  align-items: flex-end;
  aspect-ratio: 1;
  margin-bottom: 0.85rem;
  border-bottom: 3px solid var(--ink);
}

.bm-size__square {
  position: relative;
  display: block;
  width: calc(var(--cm) / 152 * 100%);
  aspect-ratio: 1;
  border: 2px solid var(--ink);
  border-bottom: 0;
  background: var(--ground);
}

.bm-size:last-child .bm-size__square {
  background: var(--ink);
  color: var(--raised);
}

.bm-size__cm {
  position: absolute;
  left: 0.4rem;
  bottom: 0.3rem;
  font-size: var(--fs-s);
  line-height: 1;
}

.bm-size__band {
  font-size: var(--fs-s);
  font-weight: 400;
  letter-spacing: 0.08em;
  font-variant-caps: all-small-caps;
  line-height: 1.35;
}

.bm-size__want {
  margin-top: 0.35rem;
  font-size: var(--fs-s);
  line-height: 1.45;
  color: var(--muted);
}

@media (max-width: 999px) {
  .bm-sizes {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    border-top: 2px solid var(--ink);
  }

  .bm-size {
    display: grid;
    grid-template-columns: minmax(0, 11rem) minmax(0, 1fr);
    grid-template-areas: "band want" "plot plot";
    gap: 0.25rem 1.25rem;
    padding: 0.85rem 0 0.9rem;
    border-bottom: 1px solid var(--line);
  }

  .bm-size__band { grid-area: band; }
  .bm-size__want { grid-area: want; margin-top: 0; }

  .bm-size__plot {
    grid-area: plot;
    aspect-ratio: auto;
    margin: 0.4rem 0 0;
    border-bottom: 0;
  }

  .bm-size__square {
    height: 1.6rem;
    aspect-ratio: auto;
    border-bottom: 2px solid var(--ink);
  }

  .bm-size__cm { bottom: 0.3rem; }
}

@media (max-width: 479px) {
  .bm-size {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "band" "want" "plot";
  }
}

.bm-piles {
  display: grid;
  grid-template-columns: 5fr 4fr 3fr;
  border-top: 4px solid var(--ink);
  border-bottom: 1px solid var(--line);
}

.bm-pile {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  min-width: 0;
  padding: 2rem clamp(1.25rem, 2.5vw, 2.25rem) 2.25rem 0;
}

.bm-pile + .bm-pile {
  border-left: var(--bar) solid var(--ink);
  padding-left: clamp(1.25rem, 2.5vw, 2.25rem);
}

.bm-pile:last-child { padding-right: 0; }

.bm-pile__holder {
  display: flex;
  align-items: flex-end;
  height: 2.75rem;
  margin-bottom: 0.6rem;
}

.bm-pile__shape { display: block; flex: none; }

.bm-pile__shape--circle {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 50%;
  background: var(--ink);
}

.bm-pile__shape--square {
  width: 2.75rem;
  height: 2.75rem;
  border: 3px solid var(--ink);
}

.bm-pile__shape--bar {
  width: 4.5rem;
  height: 1rem;
  background: var(--ink);
}

.bm-pile__title { font-size: var(--fs-l); }

.bm-pile__text {
  max-width: 40ch;
  color: var(--muted);
}

@media (max-width: 799px) {
  .bm-piles { grid-template-columns: minmax(0, 1fr); }
  .bm-pile,
  .bm-pile + .bm-pile { padding: 1.75rem 0; border-left: 0; }
  .bm-pile + .bm-pile { border-top: var(--bar) solid var(--ink); }
}

.bm-knits {
  border-top: var(--bar) solid var(--ink);
  border-bottom: var(--bar) solid var(--ink);
  background: var(--raised);
  padding-block: clamp(3.5rem, 7vw, 6.5rem) clamp(4rem, 8vw, 7rem);
}

.bm-knits__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 2.25rem clamp(1.5rem, 3vw, 3rem);
}

.bm-knits__head { grid-column: 1 / -1; }

.bm-knits__head h2 {
  margin-top: 0.5rem;
  max-width: 24ch;
  font-size: var(--fs-xl);
  line-height: 1.12;
}

.bm-knits__text {
  grid-column: 1 / span 7;
  min-width: 0;
  max-width: 62ch;
  font-style: italic;
  line-height: 1.72;
}

.bm-knits__text p + p { margin-top: 1.15em; }

.bm-knits__text p:first-child { font-size: var(--fs-m); line-height: 1.55; }

.bm-knits__sign {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  margin-top: 1.75rem !important;
  font-size: var(--fs-m);
}

.bm-knits__fig {
  grid-column: 9 / -1;
  align-self: start;
  position: sticky;
  top: 2rem;
  min-width: 0;
  padding-top: 0.5rem;
}

.bm-knits__fig figcaption {
  margin-top: 0.85rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--line);
  font-size: var(--fs-s);
  color: var(--muted);
}

@media (max-width: 899px) {
  .bm-knits__text,
  .bm-knits__fig { grid-column: 1 / -1; }
  .bm-knits__fig { position: static; max-width: 26rem; }
}

.bm-check {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--bar);
  padding: var(--bar);
  margin: 0;
  list-style: none;
  background: var(--ink);
}

.bm-check__item {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 0;
  padding: 1.35rem 1.25rem 1.5rem;
  background: var(--raised);
}

.bm-check__box {
  position: relative;
  display: block;
  width: 1.6rem;
  height: 1.6rem;
  margin-bottom: 0.6rem;
  border: 2px solid var(--ink);
}

.bm-check__box::after {
  content: "";
  position: absolute;
  left: 0.42rem;
  top: 0.12rem;
  width: 0.45rem;
  height: 0.85rem;
  border-right: 3px solid var(--ink);
  border-bottom: 3px solid var(--ink);
  transform: rotate(45deg);
}

.bm-check__title { font-size: var(--fs-m); }

.bm-check__text {
  font-size: var(--fs-s);
  line-height: 1.55;
  color: var(--muted);
}

@media (max-width: 899px) {
  .bm-check { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bm-check__item:last-child { grid-column: 1 / -1; }
}

@media (max-width: 479px) {
  .bm-check { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Contact ---------- */

.bm-mailband {
  background: var(--raised);
  border-top: var(--bar) solid var(--ink);
  border-bottom: var(--bar) solid var(--ink);
}

.bm-mailband.bm-next { border-bottom: 0; }

.bm-mailband__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.25rem clamp(1.25rem, 3vw, 2.5rem);
  padding-block: clamp(2rem, 4vw, 2.75rem);
}

.bm-mailband__circle {
  flex: none;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  background: var(--ink);
}

.bm-mailband__text {
  flex: 1 1 18rem;
  min-width: 0;
}

.bm-mailband__text .bm-label { font-weight: 500; }

.bm-mailband__addr {
  display: inline-block;
  margin-top: 0.3rem;
  font-size: var(--fs-l);
  line-height: 1.25;
  color: var(--accent);
  text-decoration-thickness: 2px;
  text-underline-offset: 0.18em;
  overflow-wrap: anywhere;
}

.bm-mailband__help {
  margin-top: 0.4rem;
  font-size: var(--fs-s);
  color: var(--muted);
}

.bm-mailband__button { align-self: center; }

.bm-notecard {
  max-width: 40rem;
  padding: clamp(1.4rem, 3vw, 2.25rem);
  background: var(--raised);
  border: 1px solid var(--line);
  border-top: 10px solid var(--ink);
}

.bm-notecard__top {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 2rem;
  padding-bottom: 1rem;
  border-bottom: 2px solid var(--ink);
  font-size: var(--fs-s);
}

.bm-notecard__top p { min-width: 0; overflow-wrap: anywhere; }

.bm-notecard__key {
  display: inline-block;
  min-width: 3.75rem;
  margin-right: 0.5rem;
  font-size: var(--fs-s);
  letter-spacing: 0.08em;
  font-variant-caps: all-small-caps;
  color: var(--muted);
}

.bm-notecard__rows > div {
  display: grid;
  grid-template-columns: minmax(0, 14rem) minmax(0, 1fr);
  gap: 0.25rem 1.5rem;
  padding: 0.9rem 0;
  border-bottom: 1px solid var(--line);
}

.bm-notecard__rows dt {
  font-size: var(--fs-s);
  color: var(--muted);
}

.bm-notecard__rows dd { min-width: 0; }

.bm-notecard__foot {
  margin-top: 1rem;
  font-size: var(--fs-s);
  letter-spacing: 0.08em;
  font-variant-caps: all-small-caps;
  color: var(--muted);
}

@media (max-width: 559px) {
  .bm-notecard__rows > div { grid-template-columns: minmax(0, 1fr); }
}

.bm-days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: var(--bar);
  padding: var(--bar);
  margin: 0;
  list-style: none;
  background: var(--ink);
}

.bm-day {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  min-width: 0;
  min-height: 9.5rem;
  padding: 1rem 0.9rem 1.2rem;
  background: var(--ground);
  overflow: hidden;
}

.bm-day--half { background: var(--raised); }
.bm-day--closed { background: var(--deep); }

.bm-day__name {
  font-size: var(--fs-s);
  letter-spacing: 0.08em;
  font-variant-caps: all-small-caps;
  color: var(--muted);
}

.bm-day--closed .bm-day__name { color: var(--ink); }

.bm-day__time {
  font-size: var(--fs-m);
  line-height: 1.2;
}

.bm-day__what {
  margin-top: auto;
  font-size: var(--fs-s);
  line-height: 1.4;
  color: var(--muted);
}

.bm-day--closed .bm-day__what { color: var(--ink); }

.bm-day--today { background: var(--accent); color: var(--raised); }
.bm-day--today .bm-day__name,
.bm-day--today .bm-day__what { color: var(--raised); }

.bm-day__badge {
  font-size: var(--fs-xs);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

@media (max-width: 959px) {
  .bm-days { grid-template-columns: minmax(0, 1fr); }

  .bm-day {
    display: grid;
    grid-template-columns: minmax(0, 7rem) minmax(0, 1fr);
    gap: 0.15rem 1rem;
    min-height: 0;
    padding: 0.9rem 2.25rem 0.9rem 0.9rem;
  }

  .bm-day__name { grid-column: 1; grid-row: 1 / span 2; align-self: center; }
  .bm-day__time,
  .bm-day__what { grid-column: 2; }
  .bm-day__time { grid-row: 1; }
  .bm-day__what { grid-row: 2; }
  .bm-day__what { margin-top: 0; }
  .bm-day__badge { position: static; grid-column: 2; grid-row: 3; }
}

.bm-dates {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 4px solid var(--ink);
  border-bottom: 1px solid var(--line);
}

.bm-date {
  min-width: 0;
  padding: 1.5rem clamp(1rem, 2.5vw, 2rem) 1.75rem 0;
}

.bm-date + .bm-date {
  border-left: var(--bar) solid var(--ink);
  padding-left: clamp(1rem, 2.5vw, 2rem);
}

.bm-date__day {
  margin-top: 0.6rem;
  font-size: var(--fs-l);
  line-height: 1.2;
}

.bm-date__note {
  margin-top: 0.6rem;
  max-width: 32ch;
  font-size: var(--fs-s);
  color: var(--muted);
}

@media (max-width: 759px) {
  .bm-dates { grid-template-columns: minmax(0, 1fr); }
  .bm-date,
  .bm-date + .bm-date { padding: 1.4rem 0; border-left: 0; }
  .bm-date + .bm-date { border-top: 1px solid var(--line); }
}

.bm-where { border-top: var(--bar) solid var(--ink); }

.bm-where__circle {
  display: block;
  width: 2.25rem;
  height: 2.25rem;
  margin-bottom: 1.1rem;
  border-radius: 50%;
  background: var(--ink);
}

.bm-where__lead {
  max-width: 34ch;
  font-size: var(--fs-l);
  line-height: 1.3;
}

.bm-where__text {
  margin-top: 1.1rem;
  max-width: 58ch;
  color: var(--muted);
}

/* ---------- Footer ---------- */

.bm-foot {
  border-top: 14px solid var(--ink);
  padding-block: 3rem 1.5rem;
}

.bm-foot__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 2rem clamp(1.25rem, 2.5vw, 2.5rem);
}

.bm-foot__inner > * { min-width: 0; }

.bm-foot__brand { grid-column: 1 / span 4; }
.bm-foot__col:nth-of-type(2) { grid-column: 5 / span 3; }
.bm-foot__col:nth-of-type(3) { grid-column: 8 / span 3; }
.bm-foot__nav { grid-column: 11 / -1; }

.bm-foot__brand .bm-mark { margin-bottom: 0.9rem; }

.bm-foot__name {
  font-size: var(--fs-m);
  font-weight: 400;
  line-height: 1.2;
}

.bm-foot__muted {
  font-size: var(--fs-s);
  color: var(--muted);
}

.bm-foot__brand p + p { margin-top: 0.3rem; }

.bm-foot__col .bm-label { margin-bottom: 0.6rem; }

.bm-foot__col p { font-size: var(--fs-s); line-height: 1.6; }

.bm-foot__email {
  display: inline-block;
  margin-bottom: 0.35rem;
  font-size: var(--fs-b);
}

.bm-foot__nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.bm-foot__nav a {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.2rem 0;
  font-size: var(--fs-s);
  color: var(--ink);
  text-decoration: none;
  transition: color 180ms var(--ease);
}

.bm-foot__nav a::before {
  content: "";
  width: 0.4rem;
  height: 0.4rem;
  background: var(--ink);
  transition: background-color 180ms var(--ease);
}

.bm-foot__nav a:hover { color: var(--accent); }
.bm-foot__nav a:hover::before { background: var(--accent); }

.bm-foot__base {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.5rem 2rem;
  margin-top: 2.75rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--line);
  font-size: var(--fs-s);
  color: var(--muted);
}

@media (max-width: 999px) {
  .bm-foot__brand { grid-column: 1 / span 6; }
  .bm-foot__col:nth-of-type(2) { grid-column: 7 / -1; }
  .bm-foot__col:nth-of-type(3) { grid-column: 1 / span 6; }
  .bm-foot__nav { grid-column: 7 / -1; }
}

@media (max-width: 599px) {
  .bm-foot__brand,
  .bm-foot__col:nth-of-type(2),
  .bm-foot__col:nth-of-type(3),
  .bm-foot__nav { grid-column: 1 / -1; }
}

/* ---------- Reduced motion ---------- */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition-duration: 0ms !important;
    transition-delay: 0ms !important;
    animation-duration: 0ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}