/* KOGSY Ready lockup: metallic swirl + KOGSY (gradient caps) | Ready (never all caps) */
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/ibm-plex-sans-latin-700-normal.woff2') format('woff2')}

.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;white-space:nowrap;line-height:1}
.brand-mark{display:block;flex:none;width:50px;height:auto}
.brand-kogsy{font-family:'IBM Plex Sans',Arial,sans-serif;font-weight:700;font-size:27px;line-height:1.1;letter-spacing:.04em;background:linear-gradient(180deg,#7FD0CC 0%,#3F8C88 48%,#163F3F 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand-divider{display:block;flex:none;width:2px;height:26px;border-radius:1px;background:#B9CBCC}
.brand-ready{font-family:'IBM Plex Sans',Arial,sans-serif;font-weight:500;font-size:27px;line-height:1.1;letter-spacing:.01em;color:#0E5E5A}

/* On dark backgrounds (#0A3D3B) */
.brand-on-dark .brand-kogsy{background-image:linear-gradient(180deg,#E4FAF8 0%,#9FDFDB 50%,#4E9C97 100%)}
.brand-on-dark .brand-divider{background:#3F6E6B}
.brand-on-dark .brand-ready{color:#BFE6E1}

/* Phones */
@media (max-width:640px){
  .brand{gap:9px}
  .brand-mark{width:40px}
  .brand-kogsy,.brand-ready{font-size:21px}
  .brand-divider{height:20px}
}