/* local fonts (CSP font-src 'self'; no Google Fonts) */
@font-face {
  font-family: "Instrument Sans";
  src: url("assets/fonts/instrument-sans-400.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Sans";
  src: url("assets/fonts/instrument-sans-500.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Sans";
  src: url("assets/fonts/instrument-sans-600.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("assets/fonts/ibm-plex-mono-400.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("assets/fonts/ibm-plex-mono-500.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}


  /* Provision design system on a web canvas: black ground, one accent,
     hairlines instead of gaps, no radii / shadows / gradients / icons. */
  :root{
    --black:     #000000;
    --accent:    #0E00FF;
    --accent-lit:#6E60FF;   /* accent lifted for 1px points on black */
    --paper:     #FFFFFF;
    --hair-dark: #222222;
    --grid-dark: #191919;
    --on-dark:   #9C9C9C;
    --footer:    #7A7A7A;

    --sans: "Instrument Sans", "Helvetica Neue", Arial, sans-serif;
    --mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;

    --gut: clamp(18px, 3.4vw, 56px);
  }

  body{
    background: var(--black);
    color: var(--paper);
    font-family: var(--sans);
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }
  *,*::before,*::after{ box-sizing: border-box; }
  a{ color: inherit; text-decoration: none; }
  :focus-visible{ outline: 2px solid var(--accent-lit); outline-offset: 3px; }

  .mono{
    font-family: var(--mono);
    font-weight: 400;
    font-size: clamp(10px, .72vw, 11.5px);
    letter-spacing: .14em;
    text-transform: uppercase;
  }

  /* ---------------------------------------------------------------- hero -- */
  .hero{
    position: relative;
    min-height: 100svh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    isolation: isolate;
  }
  /* the deck's 120px grid texture, drawn as crisp hairlines */
  .hero::before{
    content: "";
    position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background-image:
      repeating-linear-gradient(to right,  var(--grid-dark) 0 1px, transparent 1px 120px),
      repeating-linear-gradient(to bottom, var(--grid-dark) 0 1px, transparent 1px 120px);
  }
  .hero > .head,
  .hero > .stage,
  .hero > .backers{ position: relative; z-index: 2; }

  /* header strip — bordered cell, per the system */
  .head{
    display: flex; align-items: stretch;
    border-bottom: 1px solid var(--hair-dark);
  }
  .brand{
    display: flex; align-items: center; gap: 10px;
    padding: 16px var(--gut);
    font-size: clamp(17px, 1.5vw, 21px);
    font-weight: 600;
    letter-spacing: -.045em;
    border-right: 1px solid var(--hair-dark);
  }

  .brand-logo{
    display: block;
    height: 28px; width: auto; max-width: 100%;
    flex-shrink: 0;
  }

  /* stage — content centered in the hero */
  .stage{
    flex: 1;
    display: flex; flex-direction: column;
    justify-content: center; align-items: center;
    padding: clamp(40px, 7vh, 76px) var(--gut);
    width: 100%;
    text-align: center;
  }
  h1{
    margin: 0 0 clamp(18px, 2.4vh, 28px);
    font-size: clamp(2.3rem, 5.4vw, 4.5rem);
    font-weight: 500;
    line-height: 1.0;
    letter-spacing: -.042em;
    text-wrap: balance;
    max-width: 22ch;
  }
  .sub{
    margin: 0 0 clamp(28px, 4vh, 44px);
    font-size: clamp(.9688rem, 1.15vw, 1.1875rem);
    font-weight: 400;
    line-height: 1.45;
    letter-spacing: -.016em;
    color: var(--on-dark);
    max-width: 44ch;
  }

  .cta{
    align-self: center;
    display: inline-flex; align-items: center; gap: 12px;
    background: var(--accent);
    color: var(--paper);
    padding: 15px 22px;
    transition: background .15s ease;
  }
  .cta:hover{ background: #0B00CC; }
  .cta .arrow{ font-family: var(--sans); letter-spacing: 0; }

  /* backers strip */
  .backers{
    display: flex; align-items: center;
    gap: 0;
    flex-wrap: wrap;
    border-top: 1px solid var(--hair-dark);
  }
  .backers .label{
    padding: 17px var(--gut);
    color: var(--footer);
    border-right: 1px solid var(--hair-dark);
    white-space: nowrap;
  }
  .backers ul{
    flex: 1;
    display: flex; align-items: stretch; flex-wrap: wrap;
    gap: 0; margin: 0; padding: 0; list-style: none;
  }
  /* Logos are trimmed, recoloured white against their own alpha, and sized
     per-brand so a two-line lockup and a single-line wordmark carry the same
     optical weight. Investors without artwork sit as text wordmarks. */
  .backers li{
    flex: 1 0 auto;                     /* every cell grows equally from its text */
    display: flex; align-items: center; justify-content: center;
    min-height: 58px;
    padding: 14px clamp(18px, 2.2vw, 34px);
    border-right: 1px solid var(--hair-dark);
    font-size: clamp(.875rem, 1.05vw, 1.0625rem);
    font-weight: 500;
    letter-spacing: -.028em;
    color: var(--on-dark);
    text-align: center;
    white-space: nowrap;
  }
  .backers li img{
    display: block;
    height: var(--logo-h, 18px);
    width: auto;
    opacity: .62;
  }
  .backers li:last-child{ border-right: 0; }

  /* ------------------------------------------------------- responsive ---- */
  @media (max-width: 760px){
    h1{ max-width: none; }
    .backers .label{ flex: 1 1 100%; border-right: 0; border-bottom: 1px solid var(--hair-dark); }
    .backers li{ padding-block: 15px; }
  }

  /* per-logo heights (were inline style attributes; CSP style-src 'self' forbids those) */
  .pv2-gc{ --logo-h: 27px; }
  .pv2-bcv{ --logo-h: 12px; }
