/* Manrope Font - Site-wide Application */
body,
html,
* {
  font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
}

/* Ensure headings also use Manrope */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
}

/* Buttons and form elements */
button, input, select, textarea {
  font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
}

/* Navigation elements */
nav, .navbar, .nav-link, .menu {
  font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
}

/* --- Giant brand band (bottom banner) --- */
/*
  Uses container query units (cqw) so the text grows to fill the
  Bootstrap/Tailwind container width edge-to-edge.
*/
.zbgk-brand-container {
  /* Enable container queries on this element */
  container-type: inline-size;
}

.zbgk-brand-fit {
  overflow: hidden; /* avoid accidental overflow at extreme sizes */
}

.zbgk-brand-text {
  /* Number of characters in ZABUGORSHIKI (update if text changes) */
  --zbgk-chars: 12;

  /* Fallback based on viewport width (for browsers without cqw) */
  font-size: clamp(2.5rem, 12vw, 18rem);
  line-height: 0.85;
  letter-spacing: -0.02em;
  text-transform: uppercase;
}

/* Override with container-query sizing when supported */
@supports (font-size: 1cqw) {
  .zbgk-brand-text {
    /*
      Fit text to container width:
      - lower bound keeps it readable on small screens
      - middle term scales to container width using cqw
      - upper bound prevents absurdly large text on ultra-wide screens
    */
    font-size: clamp(2.5rem, calc(100cqw / (var(--zbgk-chars) * 0.62)), 18rem);
  }
}