/*
 * Consent panel (assets/js/consent.js), modelled on the structure of the Usercentrics dialog the client already uses:
 * tabs (Categories / Services / About), switches, and three buttons of IDENTICAL size and weight.
 * Self-contained tokens so it renders the same on the homepage and inner pages.
 */
.k57c-backdrop { position: fixed; inset: 0; z-index: 10001; background: rgba(17, 17, 17, 0.5); backdrop-filter: blur(2px); animation: k57cFade 0.35s ease both; }
.k57c {
  --c-ink: #111111; --c-or: #F2A33A; --c-line: rgba(17, 17, 17, 0.14); --c-soft: rgba(17, 17, 17, 0.68); --c-on: #1a7f37;
  position: fixed; z-index: 10002; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: min(680px, calc(100vw - 24px)); max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px);
  display: flex; flex-direction: column; box-sizing: border-box; overflow: hidden;
  background: #fff; color: var(--c-ink); border: 1.5px solid var(--c-ink); box-shadow: 8px 8px 0 var(--c-or);
  font: 400 15px/1.5 Georgia, "K57 Serif", "Times New Roman", serif;
  animation: k57cIn 0.5s cubic-bezier(0.2, 0.8, 0.2, 1) both;
}
.k57c * { box-sizing: border-box; }
.k57c:focus { outline: none; }
@keyframes k57cIn { from { opacity: 0; transform: translate(-50%, calc(-50% + 14px)); } }
@keyframes k57cFade { from { opacity: 0; } }
.k57c-head { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px 0; }
.k57c-title { margin: 0; font: 400 26px/1.15 Georgia, "K57 Serif", serif; letter-spacing: -0.02em; max-width: none; }
.k57c-x { width: 38px; height: 38px; margin-right: -8px; background: none; border: 0; font: 400 30px/1 Georgia, serif; cursor: pointer; color: var(--c-ink); }
.k57c-intro { margin: 8px 22px 14px; color: var(--c-soft); font-size: 14px; }
.k57c-intro strong { color: var(--c-ink); }
.k57c-tabs { display: flex; border-bottom: 1px solid var(--c-line); padding: 0 22px; }
.k57c-tab { flex: 1; padding: 12px 6px; background: none; border: 0; border-bottom: 3px solid transparent; font: 700 12px/1 Georgia, serif; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-soft); cursor: pointer; margin-bottom: -1px; }
.k57c-tab[aria-selected="true"] { color: var(--c-ink); border-bottom-color: var(--c-or); }
.k57c-body { flex: 1; overflow-y: auto; padding: 4px 22px 8px; min-height: 120px; overscroll-behavior: contain; }
.k57c-view[hidden] { display: none; }
.k57c-cat { padding: 14px 0; border-bottom: 1px solid var(--c-line); }
.k57c-cat:last-child { border-bottom: 0; }
.k57c-cat-top { display: flex; align-items: center; gap: 12px; }
.k57c-chev { flex: none; width: 24px; height: 24px; padding: 0; background: none; border: 0; cursor: pointer; position: relative; }
.k57c-chev::before { content: ""; position: absolute; left: 7px; top: 6px; width: 8px; height: 8px; border-right: 2px solid var(--c-ink); border-bottom: 2px solid var(--c-ink); transform: rotate(45deg); transition: transform 0.25s; }
.k57c-chev[aria-expanded="true"]::before { transform: translateY(4px) rotate(-135deg); }
.k57c-cat-name { flex: 1; display: flex; align-items: center; gap: 8px; cursor: pointer; }
.k57c-cat-name b { font-size: 17px; }
.k57c-count { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: #e8e8e8; font-size: 12px; font-weight: 700; }
.k57c-cat-desc { margin: 6px 0 0 36px; color: var(--c-soft); font-size: 14px; }
.k57c-more { margin: 8px 0 0 36px; }
.k57c-cat-items { margin: 0; padding-left: 18px; font-size: 14px; }
.k57c-switch { position: relative; flex: none; width: 52px; height: 30px; padding: 0; border: 0; border-radius: 999px; background: #1a1a1a; cursor: pointer; transition: background 0.2s; }
.k57c-switch::after { content: ""; position: absolute; left: 4px; top: 4px; width: 22px; height: 22px; border-radius: 50%; background: #fff; transition: transform 0.2s; }
.k57c-switch[aria-checked="true"] { background: var(--c-on); }
.k57c-switch[aria-checked="true"]::after { transform: translateX(22px); }
.k57c-switch:disabled, .k57c-switch.locked { background: #c9c9c9; cursor: not-allowed; }
.k57c-switch.locked[aria-checked="true"]::after { transform: translateX(22px); }
.k57c-none { color: var(--c-soft); font-style: italic; margin: 2px 0 10px; }
.k57c-h3 { margin: 14px 0 6px; font: 700 12px/1 Georgia, serif; letter-spacing: 0.12em; text-transform: uppercase; }
.k57c-svc { margin: 0 0 10px; padding: 10px 12px; border: 1px solid var(--c-line); }
.k57c-dl { display: grid; grid-template-columns: 78px 1fr; gap: 3px 10px; margin: 6px 0 0; font-size: 13px; }
.k57c-dl dt { color: var(--c-soft); } .k57c-dl dd { margin: 0; overflow-wrap: anywhere; }
.k57c-view p { margin: 10px 0; font-size: 14px; }
.k57c-link { color: inherit; text-decoration: none; border-bottom: 2px solid var(--c-or); }
.k57c-del { display: block; margin: 12px 0 6px; padding: 0; background: none; border: 0; font: 400 14px/1.3 Georgia, serif; color: var(--c-soft); text-align: left; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.k57c-del:disabled { cursor: default; text-decoration: none; }
.k57c-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 14px 22px 20px; border-top: 1px solid var(--c-line); background: #fff; }
.k57c-btn { min-height: 46px; padding: 12px 8px; background: #fff; color: var(--c-ink); border: 1.5px solid var(--c-ink); font: 700 12.5px/1.1 Georgia, serif; letter-spacing: 0.08em; text-transform: uppercase; cursor: pointer; transition: transform 0.25s, box-shadow 0.25s; }
.k57c-btn:hover { transform: translate(-2px, -2px); box-shadow: 3px 3px 0 var(--c-ink); }
.k57c button:focus-visible, .k57c a:focus-visible { outline: 2px solid var(--c-or); outline-offset: 3px; }
/* First-visit ribbon */
.k57c.k57c-bar {
  top: auto; bottom: 0; left: 0; right: 0; transform: none; width: auto; max-height: none;
  flex-direction: row; align-items: center; justify-content: space-between; gap: 18px;
  padding: 14px clamp(16px, 4vw, 40px) calc(14px + env(safe-area-inset-bottom));
  border-width: 1.5px 0 0; box-shadow: 0 -8px 24px rgba(17, 17, 17, 0.18);
  animation: k57cBar 0.5s cubic-bezier(0.2, 0.8, 0.2, 1) both;
}
@keyframes k57cBar { from { transform: translateY(100%); } }
.k57c-bar-text { margin: 0; flex: 1; max-width: 880px; font-size: 14px; color: var(--c-soft); }
.k57c-bar-text strong { color: var(--c-ink); }
.k57c-bar-actions { flex: none; display: flex; gap: 10px; }
.k57c-bar .k57c-btn { min-height: 42px; padding: 11px 18px; }
@media (max-width: 760px) {
  .k57c.k57c-bar { flex-direction: column; align-items: stretch; gap: 10px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); animation: k57cBar 0.5s cubic-bezier(0.2, 0.8, 0.2, 1) both; }
  .k57c-bar-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .k57c-bar .k57c-btn { padding: 11px 6px; font-size: 11.5px; letter-spacing: 0.04em; }
}
@media (max-width: 650px) {
  .k57c { top: auto; bottom: 0; left: 0; right: 0; transform: none; width: auto; max-height: 88vh; max-height: 88dvh; border-width: 1.5px 0 0; box-shadow: 0 -10px 30px rgba(17, 17, 17, 0.25); animation-name: k57cUp; }
  @keyframes k57cUp { from { transform: translateY(24px); opacity: 0; } }
  .k57c-head, .k57c-actions { padding-left: 16px; padding-right: 16px; } .k57c-intro { margin-left: 16px; margin-right: 16px; } .k57c-tabs, .k57c-body { padding-left: 16px; padding-right: 16px; }
  .k57c-title { font-size: 22px; } .k57c-actions { padding-bottom: calc(18px + env(safe-area-inset-bottom)); gap: 8px; }
  .k57c-btn { font-size: 11.5px; letter-spacing: 0.04em; }
}
@media (prefers-reduced-motion: reduce) { .k57c, .k57c-backdrop { animation: none; } .k57c-btn, .k57c-switch, .k57c-switch::after, .k57c-chev::before { transition: none; } }
