/* ============================================================
   BRAND — Studio Present
   "Stop Buying Software. Build what fits."

   Colours supplied by the client, not sampled from the site:

     #DE0632   red
     #747474   grey, for secondary text
     #0D0D0D   black
     white     the ground everything sits on

   This is the light brand. The unbranded design is dark-on-light-card, so it
   redeclares --ground / --on-ground to put a white page under a white card,
   and sets the two greys explicitly rather than letting them be mixed.

   Loaded after styles.css. Tokens first, then the handful of places where
   Studio Present wants a different shape.
   ============================================================ */

:root {
  /* --malt is the dark end of the palette, --foam the light end. On a light
     brand they are still the pair every derived token is mixed from; what
     changes is which one the page uses. */
  --malt:      #0D0D0D;
  --stout:     #E4E4E4;   /* raised surface on a white ground, not a dark one */

  --amber:     #DE0632;   /* the red. The beer path and every accent. */
  --amber-hi:  #FF4D6B;

  --foam:      #FFFFFF;

  /* Child path. Their link-info blue: cool against the red, and it holds up
     on white the way a pale tint would not. */
  --water:     #1F6FC4;
  --water-hi:  #5CA0E8;

  /* White page, black type. This is the line that makes it a light brand,
     and the entrance screen is the same white rather than a field of red. */
  --ground:    var(--paper);
  --on-ground: var(--ink);
  --idle:      var(--paper);
  --on-idle:   var(--ink);

  /* White on the red, not black: #DE0632 is dark enough that black type on it
     drops to about 4.2:1, where white sits above 5:1. */
  --on-accent: var(--paper);

  /* RUN solid in the brand red, SMART. in black. No outline. */
  --wordmark-run:        var(--accent);
  --wordmark-run-weight: 0;
  --wordmark-smart:      var(--ink);

  /* The supplied grey, used on both surfaces — they are both white here. */
  --muted:      #747474;
  --muted-card: #747474;
  --muted-idle: #747474;

  --display: "Source Sans 3", "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  /* Source Sans 3 is not width-variable — font-stretch must stay neutral.
     The punch comes from tight tracking and square corners, not extra weight. */
  --display-weight: 700;
  --display-weight-light: 400;
  --display-stretch: 100%;
  --display-tracking: -0.03em;

  /* Their --radius-2xs. Studio Present is the sharp one. */
  --radius: 4px;
  --btn-radius: 8px;
}

/* Faint grey hatching rather than the bottle-cap ridging — visible on white
   without turning into a pattern you have to look at. */
[data-brand="studiopresent"] .screen--idle::before {
  background: repeating-linear-gradient(
    -45deg,
    var(--ink-a05) 0 2px,
    transparent 2px 16px
  );
}

[data-brand="studiopresent"] .btn--start {
  background: var(--ink);
  color: var(--accent);
}

/* Hard-edged, high contrast. Where PIERRE rounds off, this squares up. */
[data-brand="studiopresent"] .bib {
  clip-path: none;
  border-radius: var(--radius);
  /* A white card on a white page needs an edge to exist at all. */
  border: 2px solid var(--rule);
}

/* The verdict stamp is the loudest thing on the card. Give it the boxed,
   stamped-on treatment their headings have. */
[data-brand="studiopresent"] .verdict__stamp {
  border: 4px solid currentColor;
  border-radius: var(--radius);
  padding: 6px clamp(10px, 3vw, 26px);
}