header {
  box-shadow: 0 20px 60px 60px rgba(49,79,79,1);
}

.header-center {
  flex: 1 1 0; 
  /* display: inline-block; */
  min-width: 0;
  text-align: center;
  margin: 0;
  flex-basis: 0;
}

.header-center h1 {
  font-size: 3.5rem;
  font-size: clamp(0.438rem, 7vw + 0rem, 3.5rem);
}


main {
  padding-top: 35px; 
}

/*

https://spirokovac.com/css-clamp-calculator/
max_width = 800px; 
min_width = 200px; 
max_font = 3.5rem; 
min_font = 1.75rem;


In [15]: fmin = 0.01; fmax = 2; vmin = 4; vmax = 60;

In [16]: slope = (fmax - fmin)/(vmax - vmin); yint = - vmin * slope + fmin; (yint, 10
    ...: 0 * slope)
Out[16]: (-0.13214285714285715, 3.553571428571429)



viewport width max = 600px = 40rem,   font size max = 1.5, 2rem 
viewport width min = 60px = 4rem,    font size min = 0.1  rem 

1rem=16px

slope = (maxFontSize - minFontSize) / (maxWidth - minWidth)
yAxisIntersection = minFontSize - minWidth * slope


preferredValue = yAxisIntersection[rem] + (slope * 100)[vw]

max_width = 560; min_width = 320; max_font = 3.5*16; min_font = 1*16;
slope = (max_font - min_font) / (max_width - min_width)
y_int = min_font - min_width * slope
(y_int, slope * 100)

*/