/* 애플페어 app site: one leaflet system, a flat product band per app. */

@font-face {
  font-family: "Applepair Text";
  src: url("/assets/fonts/applepair-text.woff2") format("woff2-variations"),
       url("/assets/fonts/applepair-text.woff2") format("woff2");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: light dark;
  --paper: #f7f8fa;
  --ink: #161a24;
  --ink-2: #4c5364;
  --rule: rgb(22 26 36 / 0.14);
  --rule-strong: #161a24;
  --crease-dark: rgb(22 26 36 / 0.07);
  --crease-light: rgb(255 255 255 / 0.9);

  --band: #171b26;
  --band-ink: #f7f8fa;
  --band-ink-2: #aab1c2;
  --accent-text: #2446a8;
  --swatch: var(--band);

  --u: 0.5rem; /* the 8px module */
  --pad: max(1.25rem, env(safe-area-inset-left));
  --pad-r: max(1.25rem, env(safe-area-inset-right));
  --panel-w: 18.5rem;
  --gap: 4.5rem;
  --font: "Applepair Text", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", system-ui, sans-serif;
}

@media (prefers-color-scheme: dark) {
  :root {
    --paper: #14171e;
    --ink: #e9ebf1;
    --ink-2: #a7aebd;
    --rule: rgb(233 235 241 / 0.14);
    --rule-strong: rgb(233 235 241 / 0.72);
    --crease-dark: rgb(0 0 0 / 0.2);
    --crease-light: rgb(255 255 255 / 0.035);
    --band: #222838;
    --band-ink: #f2f4f8;
    --band-ink-2: #aeb6c8;
    --accent-text: #9db5ff;
  }
}

body[data-app="smart-todo"] {
  --band: #5646c4;
  --band-ink: #ffffff;
  --band-ink-2: #e4e0ff;
  --accent-text: #4a3bb5;
}
body[data-app="cat-arena"] {
  --band: #2d2838;
  --band-ink: #ff9d45;
  --band-ink-2: #fff3e6;
  --accent-text: #a1450a;
}
body[data-app="cat-world"] {
  --band: #ffc53d;
  --band-ink: #1f1a0e;
  --band-ink-2: #7a2a12;
  --accent-text: #9c3412;
}
body[data-app="ai-law-counsel"] {
  --band: #1d2d52;
  --band-ink: #e8c36a;
  --band-ink-2: #c9d3ea;
  --accent-text: #7a5610;
}
body[data-app="yeobaek"] {
  --band: #2b231b;
  --band-ink: #f3e4c3;
  --band-ink-2: #cdb792;
  --accent-text: #8a4a1c;
}
body[data-app="ieodam"] {
  --band: #2f4a40;
  --band-ink: #fbf3e3;
  --band-ink-2: #cfe3da;
  --accent-text: #1f5b50;
}
body[data-app="one-sentence"] {
  --band: #8cc5b2;
  --band-ink: #132b24;
  --band-ink-2: #1f4136;
  --accent-text: #1f6b56;
}
body[data-app="pet-mochi"] {
  --band: #6a4bd0;
  --band-ink: #ffffff;
  --band-ink-2: #ece6ff;
  --accent-text: #5a3cc0;
}
body[data-app="beatglass"] {
  --band: #14163a;
  --band-ink: #ffffff;
  --band-ink-2: #d9d2ff;
  --accent-text: #4f3bc4;
}
body[data-app="sip-log"] {
  --band: #1268ad;
  --band-ink: #ffffff;
  --band-ink-2: #e3f1ff;
  --accent-text: #0a5f9e;
}
@media (prefers-color-scheme: dark) {
  body[data-app="smart-todo"] { --band: #4a3bb0; --accent-text: #bcb3ff; }
  body[data-app="cat-arena"] { --band: #2a2535; --accent-text: #ffab5c; }
  body[data-app="cat-world"] { --band: #e8b02c; --accent-text: #ffcf5c; }
  body[data-app="ai-law-counsel"] { --band: #18264a; --accent-text: #e8c36a; }
  body[data-app="yeobaek"] { --band: #2a221b; --accent-text: #e7bb8c; }
  body[data-app="ieodam"] { --band: #2b453b; --accent-text: #90d1c2; }
  body[data-app="one-sentence"] { --band: #7bb4a1; --accent-text: #9fd8c5; }
  body[data-app="pet-mochi"] { --band: #5a40c0; --accent-text: #c4b5ff; }
  body[data-app="beatglass"] { --band: #121433; --accent-text: #b3a6ff; }
  body[data-app="sip-log"] { --band: #115f9e; --accent-text: #7cbdf2; }
}
[data-app="smart-todo"] { --swatch: #5646c4; }
[data-app="cat-arena"] { --swatch: #2d2838; }
[data-app="cat-world"] { --swatch: #ffc53d; }
[data-app="ai-law-counsel"] { --swatch: #1d2d52; }
[data-app="yeobaek"] { --swatch: #2b231b; }
[data-app="ieodam"] { --swatch: #2f4a40; }
[data-app="one-sentence"] { --swatch: #8cc5b2; }
[data-app="pet-mochi"] { --swatch: #6a4bd0; }
[data-app="beatglass"] { --swatch: #14163a; }
[data-app="sip-log"] { --swatch: #1268ad; }

/* Base */
*, *::before, *::after { box-sizing: border-box; }
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scrollbar-color: var(--rule-strong) transparent;
}
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font);
  font-size: 1.0625rem;
  line-height: 1.75;
  font-weight: 400;
  word-break: keep-all;
  overflow-wrap: break-word;
  font-feature-settings: "ss06" 0;
  -webkit-font-smoothing: antialiased;
  caret-color: var(--accent-text);
}
:lang(en) { line-height: 1.6; }
html[lang="en"] body { line-height: 1.6; }
::selection { background: color-mix(in srgb, var(--accent-text) 24%, transparent); color: inherit; }
img { display: block; max-width: 100%; height: auto; }
p { margin: calc(var(--u) * 1.5) 0; }
h1, h2, h3 { text-wrap: balance; }
p, li, dd { text-wrap: pretty; }

a {
  color: var(--accent-text);
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.22em;
  text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);
}
a:hover { text-decoration-thickness: 2px; text-decoration-color: currentColor; }
:focus-visible {
  outline: 3px solid var(--accent-text);
  outline-offset: 3px;
  border-radius: 3px;
}

.wrap {
  width: 100%;
  max-width: 76rem;
  margin-inline: auto;
  padding-inline: var(--pad) var(--pad-r);
}

.skip {
  position: absolute;
  left: var(--pad);
  top: -4rem;
  z-index: 10;
  padding: var(--u) calc(var(--u) * 2);
  background: var(--ink);
  color: var(--paper);
  font-weight: 700;
}
.skip:focus { top: var(--u); }

/* Top rule: publisher and language */
.topbar { border-bottom: 1px solid var(--rule); background: var(--paper); }
.topbar__in {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(var(--u) * 2);
  min-height: 3.5rem;
  padding-top: env(safe-area-inset-top);
}
.brand {
  color: var(--ink);
  font-weight: 800;
  font-size: 1.0625rem;
  letter-spacing: -0.02em;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}
.brand::before {
  content: "";
  width: 1.125rem;
  height: 1.375rem;
  margin-right: calc(var(--u) * 1.25);
  background: var(--ink);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 22'%3E%3Cpath fill-rule='evenodd' d='M0 0h11l7 7v15H0zM11 1.5V7h5.5z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 22'%3E%3Cpath fill-rule='evenodd' d='M0 0h11l7 7v15H0zM11 1.5V7h5.5z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
}
.lang { display: flex; gap: 0; }
.lang a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding-inline: calc(var(--u) * 1.5);
  color: var(--ink-2);
  font-size: 0.9375rem;
  font-weight: 600;
  text-decoration: none;
  position: relative;
}
.lang a:last-child { padding-right: 0; }
.lang a + a { border-left: 1px solid var(--rule); }
.lang a[aria-current="page"] { color: var(--ink); font-weight: 750; }
.lang a[aria-current="page"]::after {
  content: "";
  position: absolute;
  left: calc(var(--u) * 1.5);
  right: calc(var(--u) * 1.5);
  bottom: 8px;
  height: 2px;
  background: var(--ink);
}
.lang a:last-child[aria-current="page"]::after { right: 0; }
.lang a:hover { color: var(--ink); }

/* The product band */
.band { background: var(--band); color: var(--band-ink); }
.band__in {
  display: flex;
  align-items: flex-end;
  gap: calc(var(--u) * 2.5);
  padding-block: calc(var(--u) * 5) calc(var(--u) * 4);
  min-height: 11.5rem;
}
.band__icon {
  flex: none;
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 22.5%;
  box-shadow: 0 2px 10px rgb(0 0 0 / 0.22), 0 1px 2px rgb(0 0 0 / 0.18);
}
.band__title { margin: 0; line-height: 1; font-size: clamp(2.25rem, 1.35rem + 4.4vw, 4.5rem); }
.band__app {
  display: block;
  font-size: clamp(2.25rem, 1.35rem + 4.4vw, 4.5rem);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.02;
}
.band__doc {
  display: block;
  margin-top: calc(var(--u) * 1.25);
  color: var(--band-ink-2);
  font-size: clamp(1.125rem, 0.98rem + 0.75vw, 1.5rem);
  font-weight: 650;
  letter-spacing: -0.015em;
  line-height: 1.3;
}
body[data-app="cat-arena"] .band__app { color: var(--band-ink); }

/* The sheet: lead, facts panel, document */
.sheet { position: relative; padding-bottom: calc(var(--u) * 4); }
.lead {
  margin: calc(var(--u) * 4) 0 calc(var(--u) * 3);
  max-width: 34em;
  font-size: clamp(1.25rem, 1.08rem + 0.8vw, 1.625rem);
  font-weight: 650;
  line-height: 1.5;
  letter-spacing: -0.018em;
}
:lang(en) .lead, .lead:lang(en) { line-height: 1.4; }

.panel { position: relative; padding-bottom: calc(var(--u) * 4); }
/* the fold between the summary panel and the text */
.panel::after {
  content: "";
  position: absolute;
  left: calc(var(--pad) * -1);
  right: calc(var(--pad-r) * -1);
  bottom: 0;
  height: 14px;
  background: linear-gradient(180deg, transparent 0, var(--crease-dark) 48%, var(--crease-light) 55%, transparent 100%);
  pointer-events: none;
}

.facts { margin: 0; }
.facts > div {
  display: grid;
  grid-template-columns: minmax(5.5rem, 32%) 1fr;
  gap: calc(var(--u) * 2);
  padding-block: calc(var(--u) * 1.5);
  border-top: 1px solid var(--rule);
}
.facts > div:first-child { border-top: 2px solid var(--rule-strong); }
.facts > div:last-child { border-bottom: 1px solid var(--rule); }
.facts dt { color: var(--ink-2); font-size: 0.9375rem; font-weight: 550; line-height: 1.5; }
.facts dd { margin: 0; font-weight: 650; line-height: 1.5; }
.facts dd a { overflow-wrap: anywhere; font-size: 0.9375rem; }
.facts--contact > div { grid-template-columns: 1fr; gap: calc(var(--u) * 0.5); }
.facts dd ul { margin: 0; padding-left: 1.1em; font-weight: 450; }
.facts dd li + li { margin-top: calc(var(--u) * 0.5); }

/* the "none" mark: drawn, not coloured */
.is-none::before, .nots li::before {
  content: "";
  display: inline-block;
  width: 1.05em;
  height: 1.05em;
  margin-right: 0.45em;
  vertical-align: -0.17em;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='8.2' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='M4.4 15.6 15.6 4.4' stroke='black' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='8.2' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='M4.4 15.6 15.6 4.4' stroke='black' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
}

.panel__links { display: flex; flex-wrap: wrap; column-gap: calc(var(--u) * 3); margin: calc(var(--u) * 1.5) 0 0; }
.panel__links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-weight: 650;
}
.panel__links a::after {
  content: "";
  width: 0.8em;
  height: 0.8em;
  margin-left: 0.4em;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 8h11M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 8h11M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* contents */
.toc ol { list-style: none; margin: 0; padding: 0; }
.toc a {
  display: flex;
  gap: calc(var(--u) * 1.25);
  align-items: baseline;
  padding-block: calc(var(--u) * 0.75);
  color: var(--ink-2);
  text-decoration: none;
  font-size: 0.9375rem;
  line-height: 1.45;
}
.toc a:hover { color: var(--ink); }
.toc .num { color: var(--ink); }
.toc--panel { display: none; }

.toc-mobile {
  margin: calc(var(--u) * 3) 0 0;
  border-bottom: 1px solid var(--rule);
}
.toc-mobile summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 48px;
  font-weight: 650;
  cursor: pointer;
  list-style: none;
}
.toc-mobile summary::-webkit-details-marker { display: none; }
.toc-mobile summary::after {
  content: "";
  width: 0.9rem;
  height: 0.9rem;
  background: currentColor;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 6l5 5 5-5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 6l5 5 5-5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.toc-mobile[open] summary::after { transform: rotate(180deg); }
.toc-mobile .toc { padding-bottom: calc(var(--u) * 1.5); }

.num {
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  min-width: 1.4em;
  flex: none;
}

/* the document */
.doc { max-width: 42rem; }
.sec {
  margin-top: calc(var(--u) * 5);
  padding-top: calc(var(--u) * 2);
  border-top: 2px solid var(--rule-strong);
  scroll-margin-top: calc(var(--u) * 3);
}
.sec h2 {
  display: flex;
  align-items: baseline;
  gap: calc(var(--u) * 1.25);
  margin: 0 0 calc(var(--u) * 1.5);
  font-size: 1.4375rem;
  font-weight: 750;
  letter-spacing: -0.018em;
  line-height: 1.35;
}
.sec h2 .num { color: var(--accent-text); }
.sec h3 {
  margin: calc(var(--u) * 3) 0 calc(var(--u) * 0.5);
  font-size: 1.1875rem;
  font-weight: 700;
  line-height: 1.45;
}
.sec ul { margin: calc(var(--u) * 1.5) 0; padding-left: 1.2em; }
.sec li { margin-block: calc(var(--u) * 1); padding-left: 0.2em; }
.sec li::marker { color: var(--ink-2); }
.sec ul.nots { list-style: none; padding-left: 0; }
.sec .nots li { display: flex; align-items: baseline; padding-left: 0; }
.sec .nots li::before { flex: none; margin-right: 0.7em; transform: translateY(0.12em); }
.facts--inline { margin: calc(var(--u) * 2) 0; }

.qa { padding-top: calc(var(--u) * 0.5); scroll-margin-top: calc(var(--u) * 3); }
.qa + .qa { border-top: 1px solid var(--rule); margin-top: calc(var(--u) * 2.5); padding-top: calc(var(--u) * 1); }
.qa h3 { font-size: 1.1875rem; margin-top: calc(var(--u) * 2); }

.contact__email {
  margin: calc(var(--u) * 1) 0 calc(var(--u) * 2.5);
  font-size: clamp(1.375rem, 1.05rem + 1.6vw, 2rem);
  font-weight: 750;
  letter-spacing: -0.02em;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.contact__email a { text-decoration-thickness: 2px; }

/* index: the closed set of apps */
.apps { list-style: none; margin: 0 0 calc(var(--u) * 2); padding: 0; border-top: 2px solid var(--rule-strong); }
.app {
  display: grid;
  grid-template-columns: 6.5rem 1fr;
  gap: calc(var(--u) * 2.5);
  padding-block: calc(var(--u) * 3);
  border-bottom: 1px solid var(--rule);
}
.app__field {
  background: var(--swatch);
  display: grid;
  place-items: center;
  align-self: start;
  aspect-ratio: 1 / 1.15;
}
.app__field img {
  width: 4rem;
  height: 4rem;
  border-radius: 22.5%;
  box-shadow: 0 2px 8px rgb(0 0 0 / 0.25);
}
.app__name { margin: 0; font-size: 1.625rem; font-weight: 800; letter-spacing: -0.03em; line-height: 1.15; }
.app__desc { margin: calc(var(--u) * 1) 0 calc(var(--u) * 0.5); line-height: 1.55; text-wrap: balance; }
.nw { white-space: nowrap; }
.app__meta { margin: 0; color: var(--ink-2); font-size: 0.9375rem; }
.app__links { display: flex; flex-wrap: wrap; column-gap: calc(var(--u) * 3); margin: calc(var(--u) * 1) 0 0; }
.app__links a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 650; }

/* footer */
.foot {
  margin-top: calc(var(--u) * 6);
  border-top: 1px solid var(--rule);
  padding-block: calc(var(--u) * 4) calc(var(--u) * 4 + env(safe-area-inset-bottom));
  color: var(--ink-2);
  font-size: 0.9375rem;
  line-height: 1.6;
}
.foot__h { margin: 0 0 calc(var(--u) * 1); color: var(--ink); font-size: 0.9375rem; font-weight: 750; }
.applist { list-style: none; margin: 0 0 calc(var(--u) * 3); padding: 0; }
.applist__item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: calc(var(--u) * 2);
  border-bottom: 1px solid var(--rule);
}
.applist__name {
  display: inline-flex;
  align-items: center;
  gap: calc(var(--u) * 1);
  min-width: 8.5rem;
  color: var(--ink);
  font-weight: 700;
}
.applist__name::before {
  content: "";
  width: 0.75rem;
  height: 0.75rem;
  background: var(--swatch);
  box-shadow: inset 0 0 0 1px rgb(0 0 0 / 0.12);
}
.applist__item a { display: inline-flex; align-items: center; min-height: 44px; color: var(--ink-2); }
.applist__item a:hover { color: var(--ink); }
.foot__note { max-width: 40em; margin: 0 0 calc(var(--u) * 1); }
.foot__copy { margin: 0; }
.foot__copy a { color: var(--ink-2); }

/* wide screens: the leaflet opens flat */
@media (min-width: 60rem) {
  .band__in { min-height: 16rem; padding-block: calc(var(--u) * 7) calc(var(--u) * 5); gap: calc(var(--u) * 3.5); }
  .band__icon { width: 6rem; height: 6rem; }
  .sheet {
    display: grid;
    grid-template-columns: var(--panel-w) minmax(0, 1fr);
    grid-template-areas: "panel lead" "panel doc";
    grid-template-rows: auto 1fr;
    column-gap: var(--gap);
    align-items: start;
  }
  .sheet::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: calc(var(--pad) + var(--panel-w) + var(--gap) / 2 - 9px);
    width: 18px;
    background: linear-gradient(90deg, transparent 0, var(--crease-dark) 47%, var(--crease-light) 56%, transparent 100%);
    pointer-events: none;
  }
  .lead { grid-area: lead; margin-top: calc(var(--u) * 6); }
  .panel {
    grid-area: panel;
    position: sticky;
    top: calc(var(--u) * 3);
    margin-top: calc(var(--u) * 6);
    padding-bottom: 0;
    max-height: calc(100vh - var(--u) * 6);
    overflow-y: auto;
    scrollbar-width: thin;
  }
  .panel::after { display: none; }
  .facts > div { grid-template-columns: 1fr; gap: calc(var(--u) * 0.25); }
  .facts--inline > div, .facts--contact > div { grid-template-columns: minmax(9rem, 30%) 1fr; gap: calc(var(--u) * 2); }
  .toc--panel { display: block; margin-top: calc(var(--u) * 3); padding-top: calc(var(--u) * 1.5); border-top: 1px solid var(--rule); }
  .toc-mobile { display: none; }
  .doc { grid-area: doc; }
  .doc > .sec:first-of-type { margin-top: calc(var(--u) * 2); }

  .sheet--index { display: block; }
  .sheet--index::before { display: none; }
  .app { grid-template-columns: 11rem minmax(0, 1fr); gap: calc(var(--u) * 4); padding-block: calc(var(--u) * 4); }
  .app__field img { width: 5.5rem; height: 5.5rem; }
  .app__name { font-size: 2.25rem; }
  .app__desc { font-size: 1.125rem; }

  .foot .wrap { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); column-gap: var(--gap); align-items: end; }
  .foot__apps { grid-row: span 2; }
  .foot .wrap:not(:has(.foot__apps)) { display: block; }
  .applist { margin-bottom: 0; }
}

/* one authored moment: the fold settles into the paper */
@media (prefers-reduced-motion: no-preference) {
  .sheet::before, .panel::after { animation: settle 0.9s cubic-bezier(0.16, 1, 0.3, 1) both; }
  @keyframes settle {
    from { opacity: 0; transform: scaleY(0.4); }
    to { opacity: 1; transform: none; }
  }
}

@media print {
  .topbar, .toc-mobile, .foot__apps, .skip { display: none; }
  .band { background: none; color: #000; border-bottom: 2px solid #000; }
  .band__doc { color: #000; }
  a { color: #000; }
}