/* death.css · Carryline · XIII, Death · "Threshold"
   Extends arcana.css: overrides its --arc-* tokens on [data-brand="death"], adds the --brand-*
   extras arcana-brand.css reads, then the signature: an open doorway warming with dawn light, one
   oxblood line carried slowly across the page, and a head that swings open like a door. Fonts are SIL OFL. */
/* fonts:begin Spectral, Mulish */
@font-face { font-family:"Spectral"; font-style:italic; font-weight:300; font-display:swap; src:url("../../fonts/brands/spectral-italic-300.woff2") format("woff2"); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:"Spectral"; font-style:italic; font-weight:400; font-display:swap; src:url("../../fonts/brands/spectral-italic-400.woff2") format("woff2"); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:"Spectral"; font-style:normal; font-weight:300; font-display:swap; src:url("../../fonts/brands/spectral-normal-300.woff2") format("woff2"); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:"Spectral"; font-style:normal; font-weight:400; font-display:swap; src:url("../../fonts/brands/spectral-normal-400.woff2") format("woff2"); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:"Spectral"; font-style:normal; font-weight:500; font-display:swap; src:url("../../fonts/brands/spectral-normal-500.woff2") format("woff2"); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:"Mulish"; font-style:normal; font-weight:300 700; font-display:swap; src:url("../../fonts/brands/mulish-normal-300-700.woff2") format("woff2"); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
/* fonts:end */

[data-brand="death"] {
  --arc-paper: #f3f0e9;
  --arc-surface: #e2e4df;
  --arc-wash: #efe6da;
  --arc-ink: #16181a;
  --arc-muted: #4b5256;
  --arc-line: #c4c9c7;
  --arc-accent: #6b1c23;
  --arc-on-accent: #f3f0e9;
  --arc-focus: #26314a;
  --arc-display: "Spectral", Constantia, "Iowan Old Style", Georgia, serif;
  --arc-body: "Mulish", Corbel, "Avenir Next", "Segoe UI", sans-serif;
  --arc-radius: 2px;
  --brand-mono: "Mulish", Corbel, "Segoe UI", sans-serif;
  --brand-accent-2: #8a2a32;
  --brand-display-weight: 300;
  --brand-track: -.02em;
  --brand-title-lh: 1;
  --brand-button-radius: 2px;
  --brand-enter: dth-open;
  --brand-ease: cubic-bezier(.22, .7, .18, 1);
  --brand-texture: linear-gradient(180deg, rgba(234, 216, 196, .45), transparent 42rem);
  --brand-bezel: #16181a;
  --brand-bezel-edge: #4b5256;
  --brand-bezel-ink: #ead8c4;
  --brand-glow: rgba(107, 28, 35, .35);
  --brand-wallpaper:
    linear-gradient(to top, #fbf6ee, #ead8c4 70%, rgba(234, 216, 196, 0)) 50% 70% / 84px 160px no-repeat,
    linear-gradient(to top, #6b1c23 0 1px, transparent 1px) 0 70% / 100% 160px no-repeat,
    radial-gradient(40% 30% at 50% 70%, rgba(234, 216, 196, .9), transparent 75%),
    linear-gradient(#e2e4df 0 62%, #efe6da 70%, #f3f0e9 70.2%);
}

/* Signature: the doorway, the carried line, a slow door swing, an arched numeral. */
[data-brand="death"] .abr-head > .abr-shell { position: relative; z-index: 1; }
[data-brand="death"] .abr-head > .abr-shell > * { transform-origin: 0 50%; }
[data-brand="death"] .abr-head::before {
  content: ""; position: absolute; z-index: 0; inset-block-start: clamp(2.5rem, 6vw, 4.5rem);
  inset-inline-end: max(1.25rem, calc((100% - 76rem) / 2)); inline-size: clamp(5rem, 9vw, 8rem); aspect-ratio: 3 / 5;
  border: 1px solid rgba(107, 28, 35, .45); border-block-end: 0;
  background: linear-gradient(to top, #ead8c4, rgba(234, 216, 196, 0) 90%);
  animation: dth-dawn 10s ease-in-out infinite alternate;
}
[data-brand="death"] .abr-head::after {
  content: ""; position: absolute; inset: auto 0 0; block-size: 1px; background: var(--arc-accent);
  transform-origin: 0 0; animation: dth-carry 2.8s var(--brand-ease) .4s both;
}
[data-brand="death"] .abr-tagline { font-style: italic; font-weight: 300; }
[data-brand="death"] .abr-card__num { border-radius: 999px 999px 0 0; border-block-end: 0; min-inline-size: 2em; block-size: 2.5em; }
[data-brand="death"] .abr-button { letter-spacing: .03em; font-weight: 700; }
[data-brand="death"] .abr-tier { border-block-start: 2px solid var(--arc-accent); }
[data-brand="death"] .abr-tier__label { letter-spacing: .22em; }
[data-brand="death"].abr-tile::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; transform: translateY(30%);
  background: linear-gradient(to top, rgba(234, 216, 196, .95), transparent 65%);
  transition: opacity .9s var(--brand-ease), transform .9s var(--brand-ease);
}
[data-brand="death"].abr-tile > :not(.abr-tile__bar) { position: relative; z-index: 1; }
@media (hover: hover) {
  [data-brand="death"].abr-tile:hover { transform: translateY(-2px); }
  [data-brand="death"].abr-tile:hover::after { opacity: 1; transform: none; }
}
@media (max-width: 48em) { [data-brand="death"] .abr-head::before { opacity: .35; inline-size: 4rem; } }

@keyframes dth-open { from { opacity: 0; transform: perspective(900px) rotateY(22deg); } to { opacity: 1; transform: none; } }
@keyframes dth-carry { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes dth-dawn { from { box-shadow: 0 0 0 rgba(234, 216, 196, 0); } to { box-shadow: 0 -10px 60px 10px rgba(234, 216, 196, .95); } }
