/* HORYZON Systems */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/ibm-plex-mono-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/ibm-plex-mono-400-latin.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: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/ibm-plex-sans-300-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/ibm-plex-sans-300-latin.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: 'IBM Plex Sans Condensed';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/ibm-plex-sans-condensed-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Sans Condensed';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/ibm-plex-sans-condensed-400-latin.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;
}
:root{
  /* Base palette — achromatic, warm-neutral */
  --bg:    #FFFFFF;   /* Page background — white */
  --white: #FFFFFF;   /* Alias of the page value */
  --tint:  #F2F1EE;   /* Warm grey — highlight surface, used to pick blocks out */
  --ink:   #111110;   /* All headings and body text */
  --muted: #6B6A67;   /* Secondary text, labels, captions — 4.6:1 on white */
  --rule:  #DDDBD7;   /* Borders, dividers, hairlines */

  /* Semantic aliases */
  --surface-page:      var(--bg);
  --surface-card:      var(--white);
  --surface-highlight: var(--tint);
  --surface-inverse:  var(--ink);
  --text-primary:     var(--ink);
  --text-secondary:   var(--muted);
  --text-on-inverse:  var(--white);
  --border-hairline:  var(--rule);
  --border-strong:    var(--ink);

  /* Derived states (no new hues — opacity only) */
  --state-hover-ink:    #2B2A28;
  --state-press-ink:    #000000;
  --state-hover-tint:   rgba(17,17,16,.05);
  --state-disabled-opacity: .38; /* @kind other */
  --focus-ring: 1px solid var(--ink);
}

:root{
  /* Families */
  --f-display: 'IBM Plex Sans Condensed', 'Arial Narrow', sans-serif; /* @kind font */
  --f-body:    'IBM Plex Sans', sans-serif; /* @kind font */
  --f-mono:    'IBM Plex Mono', monospace; /* @kind font */

  /* Sizes */
  --text-display-xl:  80px;   /* Hero headlines */
  --text-display-lg:  52px;   /* Section headlines */
  --text-display-md:  32px;   /* Card headlines */
  --text-display-sm:  22px;   /* Sub-headlines */
  --text-body:        15px;   /* Body copy */
  --text-label:       10px;   /* Mono labels, tags, nav */

  /* Weights */
  --weight-display: 400;
  --weight-body:    300;
  --weight-label:   400;

  /* Line heights */
  --lh-display: 0.95; /* @kind other */
  --lh-body:    1.7; /* @kind other */
  --lh-label:   1.2; /* @kind other */

  /* Tracking */
  --track-display: 0.01em;
  --track-label:    0.16em;
  --track-mono:     0.14em;
  --track-tag:      0.10em;
}

:root{
  --space-xs:   8px;
  --space-sm:  16px;
  --space-md:  24px;
  --space-lg:  40px;
  --space-xl:  64px;
  --space-2xl: 80px;

  /* Semantic */
  --gutter:         var(--space-md);
  --section-pad-y:  var(--space-2xl);
  --page-pad-x:     var(--space-lg);
  --stack-tight:    var(--space-xs);
  --stack-default:  var(--space-sm);
  --stack-loose:    var(--space-lg);
  --max-width:      1240px;
}

:root{
  --radius: 0px;               /* Zero border-radius everywhere */
  --border: 1px solid #DDDBD7; /* @kind other */
  --border-ink: 1px solid #111110; /* @kind other */
  --frame-padding: 0px;        /* Image frame removed — images sit flush */
  --hairline-width: 1px;
  --shadow-none: none;         /* The system uses rules, not shadows */
}

:root{
  --img-filter:  saturate(.90) brightness(.82); /* @kind other */
  --img-overlay: rgba(10,10,8,.45);
}

/* Type utilities — verbatim from the source kit */
.display{font-family:var(--f-display);font-weight:var(--weight-display);text-transform:uppercase;line-height:0.95;color:var(--ink);letter-spacing:0.01em}
.label{font-family:var(--f-mono);font-size:var(--text-label);font-weight:var(--weight-label);letter-spacing:0.16em;text-transform:uppercase;color:var(--muted)}
.body-copy{font-family:var(--f-body);font-size:var(--text-body);font-weight:var(--weight-body);line-height:1.7;color:var(--ink)}

/* Image frame */
.img-frame{display:block;line-height:0}
.img-wrap{position:relative;display:block;overflow:hidden;line-height:0}
.img-wrap img{display:block;width:100%;filter:var(--img-filter)}
.img-wrap::after{content:'';position:absolute;inset:0;background:var(--img-overlay);pointer-events:none}

/* Buttons */
.btn{font-family:var(--f-mono);font-size:var(--text-label);letter-spacing:0.14em;text-transform:uppercase;padding:10px 20px;border-radius:var(--radius);border:1px solid var(--ink);color:var(--ink);background:transparent;cursor:pointer}
.btn-primary{background:var(--ink);color:var(--white);border-color:var(--ink)}

/* Tag */
.tag{font-family:var(--f-mono);font-size:var(--text-label);letter-spacing:0.10em;text-transform:uppercase;padding:3px 9px;border:1px solid var(--rule);color:var(--muted);background:transparent;border-radius:var(--radius)}

/* Links */
a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule);transition:border-color .15s linear}
a:hover{border-bottom-color:var(--ink)}

html { scroll-behavior: smooth; }
body { margin: 0; background: #FFFFFF; color: #111110; -webkit-font-smoothing: antialiased; }
a { color: #111110; text-decoration: underline; text-decoration-color: #DDDBD7; text-underline-offset: 3px; transition: text-decoration-color 150ms linear; }
a:hover { text-decoration-color: #111110; }
.nav-btn:hover { background: #FFFFFF !important; color: #111110 !important; }
.lang a:hover { color: #FFFFFF !important; }
@media (max-width: 640px) { :root { --page-pad-x: 20px; --space-2xl: 64px; } }