/* Shared public-site layer: ink, concrete, acid and hard edges. */
.public-site { --public-ink: #0a0a0a; --public-acid: #ccff00; }
.public-site [id] { scroll-margin-top: 2rem; }
.public-site :is(a, button, input, select):focus-visible { outline: 3px solid #ff4400; outline-offset: 5px; }
.public-site h1, .public-site h2, .public-site h3 { text-wrap: balance; }
.public-site main p { text-wrap: pretty; }
.public-skip { position: fixed; top: 0; left: 1rem; z-index: 100; padding: 1rem; background: #ccff00; color: #0a0a0a; transform: translateY(-150%); }
.public-skip:focus { transform: translateY(0); }
.public-header { position: relative; z-index: 20; background: #e6e6e6; border-bottom: 3px solid #0a0a0a; }
.public-header-inner, .public-container { max-width: 1280px; margin-inline: auto; padding-inline: 32px; }
.public-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 92px; }
.public-brand { flex-shrink: 0; }
.public-brand img { display: block; width: 175px; height: auto; }
.public-desktop-nav, .public-header-actions { display: flex; align-items: center; gap: 24px; }
.public-desktop-nav a, .public-login { font-size: 11px; font-weight: 700; text-transform: uppercase; padding-block: 14px; }
.public-desktop-nav a:hover, .public-desktop-nav a[aria-current] { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 8px; }
.public-button { display: inline-flex; justify-content: center; align-items: center; gap: 20px; min-height: 48px; padding: 14px 22px; border: 2px solid #0a0a0a; font-size: 12px; font-weight: 700; line-height: 1.5; text-transform: uppercase; transition: background-color .15s, transform .15s; }
.public-button-acid { background: #ccff00; color: #0a0a0a; box-shadow: 4px 4px 0 #0a0a0a; }
.public-button-acid:hover { background: #fff; transform: translateY(-2px); }
.public-button-outline { border-color: #777; color: #fff; }
.public-button-outline:hover { border-color: #ccff00; color: #ccff00; }
.public-hero { background: #0a0a0a; color: #fff; padding-top: 26px; }
.hero-kicker { display: flex; justify-content: space-between; gap: 16px; border-bottom: 1px solid #383838; padding-bottom: 20px; color: #b5b5b5; font-size: 10px; text-transform: uppercase; letter-spacing: .13em; }
.hero-kicker span:last-child { color: #ccff00; }
.hero-layout { display: grid; grid-template-columns: 1.1fr 1fr; align-items: center; gap: 56px; padding-block: 56px; }
.hero-copy { min-width: 0; }
.hero-eyebrow { font-size: 11px; text-transform: uppercase; letter-spacing: .1em; color: #ccff00; margin-bottom: 24px; }
.hero-copy h1 { font-family: 'Archivo Black', sans-serif; font-size: clamp(2.5rem, 4.7vw, 4rem); line-height: .99; letter-spacing: -.045em; text-transform: uppercase; max-width: 15ch; }
.hero-description { color: #bdbdbd; font-size: 14px; line-height: 1.9; max-width: 57ch; margin-top: 24px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; }
.hero-features { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; margin-top: 28px; color: #c6c6c6; font-size: 10px; text-transform: uppercase; line-height: 1.7; }
.hero-features b { color: #ccff00; margin-right: 5px; }
.hero-panel { min-width: 0; border: 2px solid #999; background: #151515; box-shadow: 8px 8px 0 #ccff00; }
.hero-panel-bar { display: flex; justify-content: space-between; gap: 8px; padding: 12px 18px; background: #e6e6e6; color: #0a0a0a; font-size: 9px; text-transform: uppercase; font-weight: 700; letter-spacing: .08em; }
.hero-panel-body { padding: 24px; }
.hero-panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding-bottom: 24px; }
.hero-panel-heading p { font-size: 14px; text-transform: uppercase; font-weight: 700; }
.hero-panel-heading div > span { display: block; margin-top: 5px; font-size: 11px; color: #aaa; }
.hero-status { color: #ccff00; border: 1px solid #ccff00; padding: 5px 8px; font-size: 9px; text-transform: uppercase; }
.hero-row { display: grid; grid-template-columns: 22px minmax(0,1fr) auto; align-items: center; gap: 12px; border-top: 1px solid #3c3c3c; padding-block: 18px; }
.hero-row-number { color: #909090; font-size: 10px; }
.hero-row p { font-size: 11px; font-weight: 700; text-transform: uppercase; }
.hero-row div > span { display: block; font-size: 10px; line-height: 1.7; color: #aaa; margin-top: 4px; }
.hero-row-status { color: #ccff00; font-size: 9px; text-transform: uppercase; }
.hero-row-status.is-hazard { color: #ff8b61; }
.hero-stats { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); border-top: 1px solid #666; padding-top: 20px; gap: 12px; }
.hero-stats > div { display: flex; flex-direction: column; justify-content: space-between; gap: 12px; min-width: 0; }
.hero-stats span { font-size: 9px; line-height: 1.6; color: #aaa; text-transform: uppercase; }
.hero-stats strong { font-family: 'Archivo Black',sans-serif; font-size: clamp(13px,1.5vw,19px); color: #ccff00; overflow-wrap: anywhere; }
.hero-panel-caption { margin-top: 22px; font-size: 9px; color: #999; line-height: 1.6; }
.hero-tabs { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-top: 1px solid #555; }
.hero-tabs button { display: flex; align-items: center; gap: 12px; min-height: 76px; padding: 18px 16px; border-right: 1px solid #383838; text-align: left; font-size: 10px; line-height: 1.6; text-transform: uppercase; color: #aaa; }
.hero-tabs button:last-child { border-right: 0; }
.hero-tabs button > span:first-child { color: #777; }
.hero-tabs button > span:last-child { margin-left: auto; }
.hero-tabs button:hover { color: #fff; background: #222; }
.hero-tabs button.is-active { background: #ccff00; color: #0a0a0a; }
.hero-tabs button.is-active > span:first-child { color: #0a0a0a; }
.public-capabilities, .public-pricing, .public-site #demo { padding-block: 80px; }
.public-capabilities article { border-width: 2px; padding: 28px; }
.public-capabilities h3 { font-size: 21px; line-height: 1.2; }
.public-capabilities article p { line-height: 1.85; }
.public-pricing > div > .grid > article { display: flex; flex-direction: column; border-width: 2px; }
.public-pricing > div > .grid > article > ul { flex: 1; }
.public-site > nav { padding-bottom: env(safe-area-inset-bottom); }
/* Reserve the fixed navigation space inside the dark footer, not below it. */
@media (max-width: 1023px) {
  body.public-site { padding-bottom: 0; }
  .public-site > footer { padding-bottom: calc(40px + 74px + env(safe-area-inset-bottom)); }
}
@media (max-width: 1100px) {
  .public-desktop-nav, .public-login { display: none; }
  .hero-layout { gap: 32px; }
  .hero-panel-body { padding: 18px; }
}
@media (max-width: 767px) {
  .public-header-inner, .public-container { padding-inline: 20px; }
  .public-header-inner { min-height: 76px; gap: 12px; }
  .public-brand img { width: 145px; }
  .public-header-actions { flex: 0 0 auto; gap: 8px; }
  .public-header-actions .public-language { display: grid; grid-template-columns: repeat(2, 36px); flex: 0 0 76px; width: 76px; height: 36px; box-sizing: border-box; }
  .public-language button { width: 36px; height: 32px; padding: 8px 2px; font-size: 10px; line-height: 16px; white-space: nowrap; box-sizing: border-box; }
  .public-header-actions .public-button { width: 92px; flex: 0 0 92px; height: 52px; padding: 8px; font-size: 10px; gap: 6px; }
  .hero-kicker { font-size: 9px; }
  .hero-kicker span:last-child { display: none; }
  .hero-layout { grid-template-columns: 1fr; padding-block: 36px; gap: 36px; }
  .hero-copy h1 { font-size: clamp(2.4rem,8.7vw,3.6rem); max-width: 16ch; }
  .hero-description { font-size: 13px; }
  .hero-eyebrow { font-size: 10px; margin-bottom: 20px; }
  .hero-actions { gap: 12px; }
  .hero-actions .public-button { flex: 1 1 145px; font-size: 11px; padding-inline: 12px; }
  .hero-panel { box-shadow: 5px 5px 0 #ccff00; }
  .hero-tabs { grid-template-columns: 1fr 1fr; }
  .hero-tabs button { min-height: 68px; border-bottom: 1px solid #383838; padding: 12px; font-size: 9px; gap: 8px; }
  .hero-row { column-gap: 8px; }
  .hero-stats strong { font-size: 16px; }
  .public-capabilities, .public-pricing, .public-site #demo { padding-block: 48px; }
  .public-site h2.text-4xl { font-size: 1.85rem; line-height: 1.1; }
}
@media (max-width: 400px) {
  .public-header-inner { padding-inline: 12px; gap: 8px; }
  .public-header .public-brand { flex: 1 1 auto; min-width: 0; }
  .public-header .public-brand img { max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .public-site *, .public-site *::before, .public-site *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
/* Let grid children shrink; long labels must not widen the viewport. */
.public-site main .grid > * { min-width: 0; }
.public-site main :is(h2, h3, h4, li) { overflow-wrap: anywhere; }
@media (min-width: 1024px) and (max-width: 1100px) {
  .public-desktop-nav { display: flex; gap: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .public-site .reveal { opacity: 1; transform: none; }
}
