/* ============================================================
   r-tec — Base element styles & brand utilities
   Applies the manual's hard rules globally.
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--text-body);
  line-height: var(--leading-normal);
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Headings — H01: house sans, bold, UPPERCASE */
h1, h2, h3 {
  font-family: var(--font-heading);
  font-weight: var(--weight-bold);
  text-transform: uppercase;
  letter-spacing: var(--tracking-heading);
  line-height: var(--leading-snug);
  margin: 0 0 var(--space-4);
  text-wrap: balance;
}
h1 { font-size: var(--text-3xl); line-height: var(--leading-tight); }
h2 { font-size: var(--text-2xl); }
h3 { font-size: var(--text-xl); }

/* H02 subline — mono accent, sentence case */
.rtec-subline {
  font-family: var(--font-subline);
  text-transform: none;
  font-weight: var(--weight-regular);
  letter-spacing: 0;
  font-size: var(--text-md);
  color: var(--color-text);
}

p { margin: 0 0 var(--space-4); text-wrap: pretty; }

a { color: var(--color-link); text-decoration: underline; text-underline-offset: 3px; }
a:hover { text-decoration: none; }

strong, b { font-weight: var(--weight-bold); }

/* Kicker / label — tracked-out uppercase mono */
.rtec-kicker, .rtec-label {
  font-family: var(--font-label);
  text-transform: uppercase;
  letter-spacing: var(--tracking-label);
  font-size: var(--text-kicker);
  color: var(--color-text);
  display: inline-block;
}

/* Mono helper */
.rtec-mono { font-family: var(--font-mono); }

/* Bullet lists use the ► (U+25BA) marker at 75% size, text color.
   Max 2 levels per the manual. */
ul.rtec-list { list-style: none; padding: 0; margin: 0; }
ul.rtec-list > li {
  position: relative;
  padding-left: 1.6em;
  margin-bottom: var(--space-2);
}
ul.rtec-list > li::before {
  content: "\25BA";              /* ► */
  position: absolute;
  left: 0;
  top: 0.12em;
  font-size: 0.75em;             /* 75% of text size */
  color: currentColor;
  line-height: 1.5;
}
ul.rtec-list ul.rtec-list { margin-top: var(--space-2); padding-left: 1.2em; }

/* The keyvisual gradient as a reusable surface */
.rtec-gradient-bar { background: var(--rtec-gradient); }

/* Accent underline used for emphasis on selected words */
.rtec-underline {
  text-decoration: none;
  border-bottom: var(--line) solid currentColor;
  padding-bottom: 1px;
}

/* Sharp box — filled OR outlined, never both, never rounded */
.rtec-box {
  border: var(--border-width) solid var(--color-border-strong);
  border-radius: 0;
  padding: var(--space-5);
}
.rtec-box--fill {
  border: none;
  background: var(--rtec-black);
  color: var(--color-text-inverse);
}

/* Brand icon rule: outline icons must use square caps, never rounded.
   Apply .rtec-icon to any element wrapping/being an outline SVG. */
.rtec-icon svg, svg.rtec-icon {
  stroke-linecap: square;
  stroke-linejoin: miter;
}

::selection { background: var(--rtec-tuerkis); color: var(--rtec-black); }