/* emperor.css · Gatehouse Architects · IV, The Emperor · "Blueprint authority"
   Extends arcana.css: overrides its --arc-* tokens on [data-brand="the-emperor"], adds the --brand-*
   extras arcana-brand.css reads, then the signature: a cyanotype drafting grid, a title block stamped in the
   head corner, a dimension line set out from the centre, and every line raised like a wall from the ground. */
/* fonts:begin Barlow Condensed, Barlow */
@font-face { font-family:"Barlow Condensed"; font-style:normal; font-weight:500; font-display:swap; src:url("../../fonts/brands/barlow-condensed-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:"Barlow Condensed"; font-style:normal; font-weight:600; font-display:swap; src:url("../../fonts/brands/barlow-condensed-normal-600.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:"Barlow Condensed"; font-style:normal; font-weight:700; font-display:swap; src:url("../../fonts/brands/barlow-condensed-normal-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; }
@font-face { font-family:"Barlow"; font-style:normal; font-weight:400; font-display:swap; src:url("../../fonts/brands/barlow-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:"Barlow"; font-style:normal; font-weight:500; font-display:swap; src:url("../../fonts/brands/barlow-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:"Barlow"; font-style:normal; font-weight:600; font-display:swap; src:url("../../fonts/brands/barlow-normal-600.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="the-emperor"] {
  --arc-paper: #0f2a48;
  --arc-surface: #133257;
  --arc-wash: #0c2340;
  --arc-ink: #eef2f6;
  --arc-muted: #93a9c1;
  --arc-line: #2c4d74;
  --arc-accent: #f0613f;
  --arc-on-accent: #0b1e34;
  --arc-focus: #eef2f6;
  --arc-display: "Barlow Condensed", Bahnschrift, "DIN Condensed", "Arial Narrow", sans-serif;
  --arc-body: "Barlow", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --arc-radius: 0;
  --brand-mono: "Barlow Condensed", Bahnschrift, "Arial Narrow", sans-serif;
  --brand-accent-2: #93a9c1;
  --brand-display-weight: 600;
  --brand-track: .01em;
  --brand-case: uppercase;
  --brand-title-lh: .9;
  --brand-button-radius: 0;
  --brand-enter: gh-raise;
  --brand-ease: cubic-bezier(.16, 1, .3, 1);
  --brand-texture:
    linear-gradient(rgba(238, 242, 246, .05) 1px, transparent 1px) 0 0 / 16px 16px,
    linear-gradient(90deg, rgba(238, 242, 246, .05) 1px, transparent 1px) 0 0 / 16px 16px,
    linear-gradient(rgba(147, 169, 193, .12) 1px, transparent 1px) 0 0 / 80px 80px,
    linear-gradient(90deg, rgba(147, 169, 193, .12) 1px, transparent 1px) 0 0 / 80px 80px;
  --brand-bezel: #172231;
  --brand-bezel-edge: #34465c;
  --brand-bezel-ink: #93a9c1;
  --brand-glow: rgba(240, 97, 63, .4);
  --brand-wallpaper:
    radial-gradient(circle, transparent 0 17%, rgba(238, 242, 246, .5) 17% calc(17% + 1px), transparent calc(17% + 2px)),
    linear-gradient(transparent calc(50% - 1px), rgba(216, 58, 31, .85) calc(50% - 1px) calc(50% + 1px), transparent 0),
    linear-gradient(90deg, transparent calc(50% - 1px), rgba(216, 58, 31, .85) calc(50% - 1px) calc(50% + 1px), transparent 0),
    linear-gradient(rgba(238, 242, 246, .08) 1px, transparent 1px) 0 0 / 20px 20px,
    linear-gradient(90deg, rgba(238, 242, 246, .08) 1px, transparent 1px) 0 0 / 20px 20px,
    linear-gradient(rgba(238, 242, 246, .16) 1px, transparent 1px) 0 0 / 100px 100px,
    linear-gradient(90deg, rgba(238, 242, 246, .16) 1px, transparent 1px) 0 0 / 100px 100px,
    #0f2a48;
}

/* Signature: a title block, a dimension line with end ticks, drafting-sheet buttons and tiers. */
[data-brand="the-emperor"] .abr-head { border-block-end: 2px solid var(--arc-ink); }
[data-brand="the-emperor"] .abr-head::after {
  content: "GATEHOUSE \2014  DWG A-101\A SCALE 1:100 \00B7  REV C"; white-space: pre; position: absolute;
  inset-block-start: clamp(2rem, 5vw, 4rem); inset-inline-end: 1.25rem; padding: .45rem .7rem; border: 1.5px solid var(--arc-muted);
  font: 600 .7rem/1.45 var(--brand-mono); letter-spacing: .16em; color: var(--arc-muted);
  animation: gh-stamp .5s 1.1s var(--brand-ease) both;
}
@media (max-width: 52em) { [data-brand="the-emperor"] .abr-head::after { display: none; } }
[data-brand="the-emperor"] .abr-title__word { position: relative; display: inline-block; padding-block-end: .22em; }
[data-brand="the-emperor"] .abr-title__word::after {
  content: ""; position: absolute; inset: auto 0 0; block-size: 12px;
  background: linear-gradient(var(--arc-accent), var(--arc-accent)) 0 50% / 100% 1.5px no-repeat,
    linear-gradient(var(--arc-accent), var(--arc-accent)) 0 0 / 1.5px 100% no-repeat,
    linear-gradient(var(--arc-accent), var(--arc-accent)) 100% 0 / 1.5px 100% no-repeat;
  animation: gh-dimension 1.1s .6s var(--brand-ease) both;
}
[data-brand="the-emperor"] .abr-tagline { font-weight: 500; letter-spacing: .08em; }
[data-brand="the-emperor"] .abr-card__num { background: var(--arc-accent); color: var(--arc-on-accent); border-color: var(--arc-accent); }
[data-brand="the-emperor"] .abr-button { font: 600 1rem/1 var(--brand-mono); text-transform: uppercase; letter-spacing: .14em; }
[data-brand="the-emperor"] .abr-button[data-kind="ghost"] { border-color: var(--arc-muted); border-style: dashed; }
[data-brand="the-emperor"] .abr-tier { border: 1.5px solid var(--arc-muted); border-block-end-width: 6px; background: var(--brand-texture), var(--arc-paper); }
[data-brand="the-emperor"] .abr-tier[data-kind="custom"] { border-color: var(--arc-accent); }
[data-brand="the-emperor"].abr-tile { box-shadow: inset 0 0 0 1px var(--arc-line); }
@media (hover: hover) { [data-brand="the-emperor"].abr-tile:hover { animation: gh-slide 1.4s var(--brand-ease); box-shadow: inset 0 0 0 1.5px var(--arc-accent), 0 24px 50px -24px var(--brand-glow); } }

@keyframes gh-raise { from { opacity: 0; transform-origin: 50% 100%; transform: perspective(700px) rotateX(-75deg); } 70% { opacity: 1; } to { opacity: 1; transform-origin: 50% 100%; transform: none; } }
@keyframes gh-dimension { from { clip-path: inset(0 50% 0 50%); } to { clip-path: inset(0 0 0 0); } }
@keyframes gh-stamp { from { opacity: 0; transform: scale(1.4); } 70% { opacity: 1; transform: scale(.97); } to { opacity: 1; transform: none; } }
@keyframes gh-slide { from { background-position: 0 0, 0 0, 0 0, 0 0; } to { background-position: 0 16px, 16px 0, 0 80px, 80px 0; } }
