
/* Set core body defaults */
body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5;

  display: grid;
    align-content: start;
    place-content: center;

  font-family: "Barlow Semi Condensed", sans-serif;
  font-weight: 500;

  background-color: #121212;
  background: #121212;
}



.text-size-big {
  font-size: 1.0rem;
}

.text-size-medium {
  font-size: 0.8125rem;
}

.text-size-small {
  font-size: 0.6875rem;
}

.text-colour-primary, a:link, a:visited, a:hover, a:active {
  color: #FAF9F6;
}

.text-colour-secondary {
  opacity: 0.5;
}

/*.background-colour-primary {
  background: linear-gradient(180deg, #161616 0%, #1d1d1d 100%);
}

.background-colour-red {
  background: linear-gradient(180deg, #240a0a 0%, #161616 100%);
}

.background-colour-orange {
  background: linear-gradient(180deg, #251c0b 0%, #161616 100%);
}
*/

.background-colour-primary {
  background: #161616;
}

.background-colour-red {
  background: #240a0a;
}

.background-colour-orange {
  background: #251c0b;
}

.line-height-extra {
  line-height: 1.2;
}

.line-height-extra-extra {
  line-height: 1.4;
}

.text-weight-extra {
  font-weight: 500;  
}


/* components */
.testimonial-grid {
  display: grid;
  gap: 0.5rem;
  padding: 1rem;
/*  width: 100%;*/
/*  width: min(95%, 80rem);  */
  margin-inline: auto;
}

.testimonial-grid-search {
  display: grid;
  gap: 0.5rem;
  padding: 1rem;
  width: 600px;
/*  width: 100%;*/
/*  width: min(95%, 80rem);  */
/*  margin-inline: auto;*/
}

.testimonial {
  padding: 1rem;
  border-radius: 0.2rem;
  line-height: 1.3;
  box-shadow: 6px 6px 6px -6px black;
}

.testimonial a:link, .testimonial a:visited, .testimonial a:active {
  text-decoration: none;
  border-bottom: 1px dotted dimgray;
}

/*.testimonial a:hover {
  text-decoration: underline;  
}
*/
.testimonial img {
  width: 1.75rem;
/*  aspect-ratio: 1;*/
/*  border-radius: 50%;*/
}

/* utilities */
.flex {
  display: flex;
  flex-direction: row;
  gap: 0.6rem;
}

.flow > *:where(:not(:first-child)) {
  margin-top: var(--flow-spacer, 1em);
}



.testimonial-grid {
  grid-template-columns: repeat(1, 1fr);
  width: 23rem;  
}

.testimonial:first-child {
  grid-column: 1 / span 1;
}

@media (min-width: 45em) {
  .testimonial-grid {
    grid-template-columns: repeat(2, 1fr);
    width: 45rem;  
  }

  .testimonial:first-child {
    grid-column: 1 / span 2;
  }

  .search {
    grid-row: span 2;
  }
}

@media (min-width: 66.5em) {
  .testimonial-grid {
    grid-template-columns: repeat(3, 1fr);
    width: 66.5rem;  
  }

  .testimonial:first-child {
    grid-column: 1 / span 3;
  }

  .search {
    grid-row: span 2;
  }
}

@media (min-width: 85.2em) {
  .testimonial-grid {
    grid-template-columns: repeat(4, 1fr);
    width: 85.2rem;  
  }

  .testimonial:first-child {
    grid-column: 1 / span 4;
  }

  .search {
    grid-row: span 2;
  }
}

@media (min-width: 110em) {
  .testimonial-grid {
    grid-template-columns: repeat(5, 1fr);
    width: 110rem;  
  }

  .testimonial:first-child {
    grid-column: 1 / span 5;
  }

  .search {
    grid-row: span 2;
  }
}

@media (min-width: 131.5em) {
  .testimonial-grid {
    grid-template-columns: repeat(6, 1fr);
    width: 131.5rem;  
  }

  .testimonial:first-child {
    grid-column: 1 / span 6;
  }

  .search {
    grid-row: span 2;
  }
}

@media (min-width: 153em) {
  .testimonial-grid {
    grid-template-columns: repeat(7, 1fr);
    width: 153rem;  
  }

  .testimonial:first-child {
    grid-column: 1 / span 7;
  }

  .search {
    grid-row: span 2;
  }
}

@media (min-width: 175em) {
  .testimonial-grid {
    grid-template-columns: repeat(8, 1fr);
    width: 175rem;  
  }

  .testimonial:first-child {
    grid-column: 1 / span 8;
  }

  .search {
    grid-row: span 2;
  }
}

@media (min-width: 180em) {
  .testimonial-grid {
    grid-template-columns: repeat(9, 1fr);
  }

  .testimonial:first-child {
    grid-column: 1 / span 9;
  }

  .search {
    grid-row: span 2;
  }
}

@media (min-width: 200em) {
  .testimonial-grid {
    grid-template-columns: repeat(10, 1fr);
  }

  .testimonial:first-child {
    grid-column: 1 / span 10;
  }

  .search {
    grid-row: span 2;
  }
}










/*
.testimonial-grid {
  grid-template-columns: repeat(1, 1fr);
  width: 35.2rem;  
}
*/


/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
  margin: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role="list"],
ol[role="list"] {
  list-style: none;
}

/* Set core root defaults */
html:focus-within {
  scroll-behavior: smooth;
}

/* Make images easier to work with */
img,
picture {
/*  max-width: 100%;*/
  display: block;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
  font: inherit;
}



