/* ------------------------------------------------------------------ 42ITS
 * Flat black page, one strong red, thin blue line-art as the only decoration.
 * Inter at weight 200 for display, Montserrat for everything else.
 * Values taken from the 42ITS house style; the red #b01818 is shared with
 * 42Live and must never be substituted.
 * ------------------------------------------------------------------ */

[data-brand='42its'] {
  --bg: #000000;          /* flat black, not off-black */
  --panel: #0e172d;       /* navy panels on the black, not grey */
  --panel-2: #141d33;
  --line: rgba(255, 255, 255, 0.12);
  --heading: #ffffff;
  /* Body copy. The 42ITS brand palette specifies #7a7a7a, which measures
     4.89:1 on black -- it passes AA but reads as strained on a page a client
     has to act on. #c4c4c4 is 12.04:1 and sits clearly above --label
     (8.83:1), so the heading > body > label hierarchy still reads. A
     deliberate divergence from 42its.co.uk in favour of legibility. */
  --text: #c4c4c4;
  --muted: #5e6782;       /* 3.7:1 -- large text and decoration only */
  /* Secondary text that must stay READABLE at small sizes. --muted is 3.7:1
     and the house style limits it to large text and decoration, so it cannot
     carry 12-13px labels; this is 7.0:1 on black. */
  --label: #a8a8a8;
  --accent: #b01818;      /* the brand red */
  --accent-hover: #d92a2a;
  --accent-fg: #ffffff;   /* white on red (7.0:1), not the live site's black */
  --decor: #2957cb;       /* blue: line-art only. Never a button or a link. */
  --decor-faint: rgba(41, 87, 203, 0.19);

  --font-display: 'Inter', 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-ui: 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --display-weight: 200;  /* the airy technical feel; never bold */
  --heading-weight: 400;
  --radius: 30px;         /* pill buttons */
  --radius-panel: 4px;
  --container: 1500px;
}

/* Display headings are light and large. A 700-weight heading looks wrong here. */
[data-brand='42its'] .dl-title {
  font-family: var(--font-display);
  font-weight: 200;
  letter-spacing: -0.01em;
}

/* Faint concentric ring behind the card -- the house line-art motif. */
[data-brand='42its'] .dl-main::before {
  content: '';
  position: absolute;
  inset: auto;
  top: -160px;
  left: 50%;
  width: 520px;
  height: 520px;
  margin-left: -260px;
  border: 1px solid var(--decor-faint);
  border-radius: 50%;
  box-shadow: 0 0 0 60px transparent, inset 0 0 0 60px transparent;
  pointer-events: none;
  z-index: 0;
}