
:root {
  --bx-tip: var(--stroke, #D6232B);         
  --bx-lbl-bg: #D6232B;                     
  --bx-lbl-fg: #FFFFFF;
  --bx-hl: var(--stroke, #D6232B);          
  --bx-ease: cubic-bezier(.2, .7, .1, 1);
  --bx-paint-ease: cubic-bezier(.32, .6, .16, 1);     
  --bx-leave-ease: cubic-bezier(.55, 0, .25, 1);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not([data-theme="red"]) { --bx-hl: #E0343B; }     
}
:root[data-theme="dark"] { --bx-hl: #E0343B; }
:root[data-theme="red"] { --bx-lbl-bg: #FFFFFF; --bx-lbl-fg: #C01F27; --bx-hl: #FFFFFF; }
@media (hover: hover) and (pointer: fine) {
  body.bx-nocursor, body.bx-nocursor :where(a, button, [role="button"], label, select, summary, input[type="range"], .compare, .bx-replay) { cursor: none !important; }
  body.bx-nocursor :is(textarea, [contenteditable=""], [contenteditable="true"], input:not([type]), input[type="text"], input[type="email"],
    input[type="search"], input[type="url"], input[type="tel"], input[type="password"], input[type="number"]) { cursor: text !important; }
}
.bx-cursor, .bx-painter, .bx-peek {
  position: fixed; left: 0; top: 0; width: 0; height: 0; z-index: 2147483600;
  pointer-events: none; contain: layout style;
}
.bx-cursor { opacity: 0; transition: opacity .2s linear; }
.bx-cursor.is-on { opacity: 1; }
.bx-painter { z-index: 2147483590; }
.bx-painter:not(.is-on) { visibility: hidden; }
.bx-cursor__rot, .bx-painter__rot { position: absolute; left: 0; top: 0; }
.bx-cv { position: absolute; display: block; max-width: none; pointer-events: none; }
.bx-cursor.is-invert { --bx-tip: #FFFFFF; }
:root[data-theme="red"] .bx-cursor.is-invert { --bx-tip: #D6232B; }
.bx-cursor__lbl {
  position: absolute; left: 12px; top: 13px;
  display: inline-flex; align-items: center; gap: 7px; padding: 7px 11px 7px;
  border-radius: 999px; background: var(--bx-lbl-bg); color: var(--bx-lbl-fg);
  font: 600 12px/1 var(--sans, ui-sans-serif, system-ui, sans-serif); letter-spacing: .01em; white-space: nowrap;
  box-shadow: 0 8px 18px -10px rgba(0, 0, 0, .55);
  transform: translate3d(-4px, -4px, 0) scale(.35); transform-origin: 0 0; opacity: 0;
  transition: transform .34s var(--bx-ease), opacity .18s linear;
}
.bx-cursor.has-lbl .bx-cursor__lbl { transform: none; opacity: 1; }
.bx-cursor.is-up .bx-cursor__lbl { top: -40px; transform-origin: 0 100%; }      
.bx-cursor__arr { display: none; width: 17px; height: 9px; flex: none; }
.bx-cursor.is-drag .bx-cursor__arr { display: block; }
.bx-cursor.is-invert .bx-cursor__lbl { background: #FFFFFF; color: #C01F27; }
:root[data-theme="red"] .bx-cursor.is-invert .bx-cursor__lbl { background: #D6232B; color: #FFFFFF; }
.bx-dab {
  position: fixed; z-index: 2147483500; width: 36px; height: 34px; margin: -18px 0 0 -18px;
  pointer-events: none; color: var(--bx-tip); opacity: 0;
  animation: bx-dab 1.15s var(--bx-ease) forwards;
}
.bx-dab svg { display: block; width: 100%; height: 100%; fill: currentColor; overflow: visible; }
.bx-dab.is-invert { color: #FFFFFF; }
:root[data-theme="red"] .bx-dab.is-invert { color: #D6232B; }
@keyframes bx-dab {
  0% { opacity: .95; transform: rotate(var(--r, 0deg)) scale(.2); }
  12% { opacity: .92; transform: rotate(var(--r, 0deg)) scale(1); }
  45% { opacity: .7; }
  100% { opacity: 0; transform: rotate(var(--r, 0deg)) scale(1.1); }
}
.stroke.bx-live .stroke__paint { animation: none !important; clip-path: none !important; background: transparent !important; }
.bx-sv { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: visible; max-width: none; }
.bx-sv path { fill: none; stroke: var(--stroke, #D6232B); stroke-dasharray: 1 1; stroke-dashoffset: 1; }
.bx-sv__body { stroke-width: 150; stroke-linecap: butt; }
.bx-sv__hair { stroke-linecap: round; }
.bx-sv .bx-sv__grain { stroke: rgba(255, 255, 255, .15); stroke-width: 3.2; stroke-linecap: round; stroke-dashoffset: 0; transition: none; }
.bx-sv.is-done .bx-sv__grain { transition: opacity .8s linear; }     
:root[data-theme="red"] .bx-sv .bx-sv__grain { stroke: rgba(214, 35, 43, .13); }
.bx-trail { pointer-events: none; }
.bx-rel { position: relative; }
.bx-ulh { --bx-z: 16px; --bx-uy: -5px; --bx-uh: 6px; }
.bx-ul {
  position: absolute; z-index: 0; left: calc(-3px - var(--bx-z)); right: calc(-3px - var(--bx-z));
  bottom: var(--bx-uy); height: var(--bx-uh);
  overflow: hidden; pointer-events: none; transform: translate3d(-100%, 0, 0);
  -webkit-mask: linear-gradient(90deg, transparent, #000 var(--bx-z), #000 calc(100% - var(--bx-z)), transparent);
  mask: linear-gradient(90deg, transparent, #000 var(--bx-z), #000 calc(100% - var(--bx-z)), transparent);
}
.bx-ul__in {
  position: absolute; top: 0; bottom: 0; left: var(--bx-z); right: var(--bx-z);
  background: var(--bx-ul, var(--stroke, #D6232B));
  -webkit-mask: url("../img/brand/brush-underline.png") center / 100% 100% no-repeat;
  mask: url("../img/brand/brush-underline.png") center / 100% 100% no-repeat;
  transform: translate3d(calc(100% + 2 * var(--bx-z)), 0, 0);
}
.bx-in > .bx-ul, .bx-in > .bx-ul > .bx-ul__in,
:focus-visible > .bx-ul, :focus-visible > .bx-ul > .bx-ul__in, :focus-visible > .bx-ulh > .bx-ul, :focus-visible > .bx-ulh > .bx-ul > .bx-ul__in {
  transform: none; transition: transform .62s var(--bx-paint-ease);
}
.bx-out > .bx-ul { transform: translate3d(100%, 0, 0); transition: transform .48s var(--bx-leave-ease); }
.bx-out > .bx-ul > .bx-ul__in { transform: translate3d(calc(-100% - 2 * var(--bx-z)), 0, 0); transition: transform .48s var(--bx-leave-ease); }
html.bx-fx .entry-title a { background-size: 0 1px !important; }
html.bx-fx .foot__col a:hover { text-decoration: none; }
.nav__links a.bx-ulh { --bx-uy: 6px; --bx-uh: 5px; --bx-z: 12px; }
.link-arrow.bx-ulh, .work-head__jump.bx-ulh, .card__aside .mail.bx-ulh { --bx-uy: -4px; --bx-uh: 7px; }
.foot__col a.bx-ulh, .foot__bot a.bx-ulh, .soc a.bx-ulh, .menu__soc a.bx-ulh, .crumb.bx-ulh { --bx-uy: 7px; --bx-uh: 5px; --bx-z: 12px; }
.entry-title a.bx-ulh, .pn b.bx-ulh, .ix__tt.bx-ulh { --bx-uy: -.07em; --bx-uh: .12em; --bx-z: .5em; }
.ix__tt { display: inline-block; }                
.band .bx-ulh { --bx-ul: #D6232B; }
:root[data-theme="red"] .band .bx-ulh { --bx-ul: #FFFFFF; }
.bx-btn { overflow: hidden; isolation: isolate; --bx-z: 28px; --bx-paint: #D6232B; --bx-paint-fg: #FFFFFF; }
.bx-fill {
  position: absolute; z-index: 1; top: -2px; bottom: -2px; left: calc(-2px - var(--bx-z)); right: calc(-2px - var(--bx-z));
  pointer-events: none; background: var(--bx-paint); transform: translate3d(-100%, 0, 0);
  -webkit-mask: url("../img/brush/edge-l.svg") 0 0 / var(--bx-z) 100% no-repeat, linear-gradient(#000, #000) var(--bx-z) 0 / calc(100% - 2 * var(--bx-z) + 1px) 100% no-repeat, url("../img/brush/edge-r.svg") 100% 0 / var(--bx-z) 100% no-repeat;
  mask: url("../img/brush/edge-l.svg") 0 0 / var(--bx-z) 100% no-repeat, linear-gradient(#000, #000) var(--bx-z) 0 / calc(100% - 2 * var(--bx-z) + 1px) 100% no-repeat, url("../img/brush/edge-r.svg") 100% 0 / var(--bx-z) 100% no-repeat;
}
.bx-fill__in {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  padding: 0 calc(var(--bx-z) + 2px); color: var(--bx-paint-fg); white-space: nowrap;
  transform: translate3d(100%, 0, 0);
}
.bx-btn.bx-in > .bx-fill, .bx-btn.bx-in > .bx-fill > .bx-fill__in,
.bx-btn:focus-visible > .bx-fill, .bx-btn:focus-visible > .bx-fill > .bx-fill__in { transform: none; transition: transform .6s var(--bx-paint-ease); }
.bx-btn.bx-out > .bx-fill { transform: translate3d(100%, 0, 0); transition: transform .5s var(--bx-leave-ease); }
.bx-btn.bx-out > .bx-fill > .bx-fill__in { transform: translate3d(-100%, 0, 0); transition: transform .5s var(--bx-leave-ease); }
.pill.bx-btn .bx-fill__in::after { content: "\2192"; font-size: 13px; opacity: .8; }
.btn.bx-btn.bx-in:not(.btn--ghost):not(.btn--ghost-light) { border-color: var(--bx-paint); transition: background-color .25s, color .25s, border-color .15s linear .3s; }
.btn--ghost-light.bx-btn { --bx-paint: #F4F3F0; --bx-paint-fg: #111112; }
.btn--ghost.bx-btn, .pill.bx-btn { --bx-paint: var(--ink); --bx-paint-fg: var(--bg); }
:root[data-theme="red"] .bx-btn { --bx-paint: #1A0708; --bx-paint-fg: #FFFFFF; }
:root[data-theme="red"] .btn--ghost.bx-btn, :root[data-theme="red"] .pill.bx-btn, :root[data-theme="red"] .btn--ghost-light.bx-btn { --bx-paint: #FFFFFF; --bx-paint-fg: #C01F27; }
.bx-sheen { position: absolute; inset: 0; z-index: 3; overflow: hidden; pointer-events: none; border-radius: inherit; opacity: 0; transition: opacity .8s var(--bx-ease); }
.bx-sheen i {
  position: absolute; left: 0; top: 0; width: 95%; aspect-ratio: 1; margin: -47.5% 0 0 -47.5%; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(255, 248, 236, .5), rgba(255, 248, 236, .16) 48%, rgba(255, 248, 236, 0) 100%);
  mix-blend-mode: soft-light; will-change: transform;
}
.bx-sheen--soft i { background: radial-gradient(closest-side, rgba(255, 255, 255, .26), rgba(255, 255, 255, 0) 100%); mix-blend-mode: overlay; }
.bx-lit > .bx-sheen { opacity: 1; }
.bx-tilting { z-index: 2; }
html.bx-fx .rtile::before { translate: calc(var(--bx-mx, 0) * -22px) calc(var(--bx-my, 0) * -16px); }
html.bx-fx .rtile__svc { translate: calc(var(--bx-mx, 0) * 6px) calc(var(--bx-my, 0) * 5px); }
html.bx-fx .rtile__top, html.bx-fx .rtile__bot { translate: calc(var(--bx-mx, 0) * 2.5px) calc(var(--bx-my, 0) * 2px); }
.bx-peek { z-index: 2147483400; }
.bx-peek__frame {
  position: absolute; left: 30px; bottom: 18px; width: 180px; aspect-ratio: 4 / 5;
  border-radius: 8px; overflow: hidden; background: var(--bg-2, #EAE8E3);
  box-shadow: 0 34px 60px -30px rgba(0, 0, 0, .6), 0 0 0 1px rgba(0, 0, 0, .06);
  opacity: 0; transform: translate3d(-10px, 10px, 0) scale(.7) rotate(-4deg); transform-origin: 0 100%;
  transition: transform .5s var(--bx-ease), opacity .25s linear;
}
.bx-peek.is-below .bx-peek__frame { bottom: auto; top: 34px; transform-origin: 0 0; }
.bx-peek.is-on .bx-peek__frame { opacity: 1; transform: none; }
.bx-peek__frame img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; opacity: 0; transition: opacity .35s linear; }
.bx-peek__frame img.is-on { opacity: 1; }
.bx-hl { position: relative; isolation: isolate; white-space: nowrap; --bx-z: .45em; }
.bx-hl__win {
  position: absolute; z-index: -1; left: calc(-.06em - var(--bx-z)); right: calc(-.08em - var(--bx-z)); bottom: .1em; height: .15em;
  overflow: hidden; pointer-events: none; transform: translate3d(-100%, 0, 0);
  -webkit-mask: linear-gradient(90deg, transparent, #000 var(--bx-z), #000 calc(100% - var(--bx-z)), transparent);
  mask: linear-gradient(90deg, transparent, #000 var(--bx-z), #000 calc(100% - var(--bx-z)), transparent);
}
.bx-hl__paint {
  position: absolute; top: 0; bottom: 0; left: var(--bx-z); right: var(--bx-z); background: var(--bx-hl);
  -webkit-mask: url("../img/brand/brush-underline.png") center / 100% 100% no-repeat; mask: url("../img/brand/brush-underline.png") center / 100% 100% no-repeat;
  transform: translate3d(calc(100% + 2 * var(--bx-z)), 0, 0);
}
.bx-hl.is-painted > .bx-hl__win, .bx-hl.is-painted > .bx-hl__win > .bx-hl__paint { transform: none; transition: transform .9s var(--bx-paint-ease); }
.bx-hl.is-still > .bx-hl__win, .bx-hl.is-still > .bx-hl__win > .bx-hl__paint, .snap .bx-hl > .bx-hl__win, .snap .bx-hl > .bx-hl__win > .bx-hl__paint { transform: none !important; transition: none !important; }
.finale__title .bx-hl__win { height: .12em; bottom: .12em; }
html.bx-fx .bx-rl { border-top-color: transparent !important; }
.bx-rl__line { position: absolute; left: 0; right: 0; top: -1px; height: 1px; background: var(--rule-2); transform: scaleX(0); transform-origin: 0 50%; pointer-events: none; }
.bx-rl__run { position: absolute; left: 0; right: 0; top: -4px; height: 7px; transform: translate3d(-100%, 0, 0); pointer-events: none; opacity: 0; }
.bx-rl__run i {
  position: absolute; right: -6px; top: 0; width: clamp(48px, 6vw, 84px); height: 100%; background: var(--stroke);
  -webkit-mask: url("../img/brand/brush-underline.png") center / 100% 100% no-repeat; mask: url("../img/brand/brush-underline.png") center / 100% 100% no-repeat;
}
.bx-rl-in > .bx-rl__line { transform: none; transition: transform 1.15s var(--bx-paint-ease); }
.bx-rl-in > .bx-rl__run { transform: none; animation: bx-run 1.15s var(--bx-paint-ease) both; transition: transform 1.15s var(--bx-paint-ease); }
@keyframes bx-run { 0% { opacity: 0; } 10% { opacity: 1; } 78% { opacity: 1; } 100% { opacity: 0; } }
.bx-rl.is-still > .bx-rl__line { transform: none !important; transition: none !important; }
.bx-rl.is-still > .bx-rl__run { display: none; }
@media (max-width: 600px) {
  .bx-pill-arm::before { clip-path: inset(0 100% 0 0); }
  .bx-pill-in::before { clip-path: inset(0 0 0 0); transition: clip-path .8s var(--bx-paint-ease); }
}
.bx-wipe { position: absolute; inset: 0; z-index: 6; overflow: hidden; pointer-events: none; border-radius: inherit; }
.bx-wipe i {
  position: absolute; top: -2px; bottom: -2px; left: -96px; width: calc(100% + 96px);
  background: linear-gradient(90deg, var(--stroke) 0, var(--stroke) 62px, var(--bg) 84px);
  -webkit-mask: url("../img/brush/edge-l.svg") 0 0 / 30px 100% no-repeat, linear-gradient(#000, #000) 29px 0 / calc(100% - 29px) 100% no-repeat;
  mask: url("../img/brush/edge-l.svg") 0 0 / 30px 100% no-repeat, linear-gradient(#000, #000) 29px 0 / calc(100% - 29px) 100% no-repeat;
}
.bx-wipe-go > .bx-wipe i { transform: translate3d(100%, 0, 0); transition: transform 1.3s var(--bx-paint-ease); }
.bx-swp { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.bx-swp i {
  position: absolute; top: -20%; bottom: -20%; left: 0; width: 46%; background: rgba(255, 255, 255, .2);
  -webkit-mask: url("../img/brush/edge-l.svg") 0 0 / 26px 100% no-repeat, linear-gradient(#000, #000) 25px 0 / calc(100% - 50px) 100% no-repeat, url("../img/brush/edge-r.svg") 100% 0 / 26px 100% no-repeat;
  mask: url("../img/brush/edge-l.svg") 0 0 / 26px 100% no-repeat, linear-gradient(#000, #000) 25px 0 / calc(100% - 50px) 100% no-repeat, url("../img/brush/edge-r.svg") 100% 0 / 26px 100% no-repeat;
  transform: translate3d(-120%, 0, 0) skewX(-14deg); opacity: 0;
}
.vtile .bx-swp, .ctile .bx-swp { z-index: 1; }
:root[data-theme="red"] .rtile .bx-swp i { background: rgba(214, 35, 43, .12); }
.bx-swp-go .bx-swp i { animation: bx-swp 1.05s var(--bx-paint-ease) var(--d, 0ms) both; }
@keyframes bx-swp {
  0% { transform: translate3d(-120%, 0, 0) skewX(-14deg); opacity: 0; }
  15% { opacity: 1; }
  100% { transform: translate3d(260%, 0, 0) skewX(-14deg); opacity: 0; }
}
.bx-swp-still .bx-swp { display: none; }
@media not all and (hover: hover) and (pointer: fine) {
  .bx-cursor, .bx-peek, .bx-trail { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  .bx-cursor, .bx-painter, .bx-peek, .bx-trail, .bx-dab, .bx-sheen, .bx-wipe, .bx-swp, .bx-rl__run { display: none !important; }
  .bx-rl__line { transform: none !important; }
  .bx-ul, .bx-ul__in, .bx-fill, .bx-fill__in, .bx-hl__win, .bx-hl__paint { transition: none !important; }
  .bx-hl > .bx-hl__win, .bx-hl > .bx-hl__win > .bx-hl__paint { transform: none !important; }
}
@media print { .bx-cursor, .bx-painter, .bx-peek, .bx-trail, .bx-dab, .bx-wipe, .bx-swp { display: none !important; } }
.snap .bx-wipe, .snap .bx-swp, .snap .bx-rl__run { display: none !important; }
.snap .bx-rl__line { transform: none !important; }
