/*
The panel: the page-wide plate three blocks are drawn on — About's "Why Choose Us?", the service
pages' "What is …?" and their "Why Choose Us?".

It is a component rather than a rule each of them keeps because all three had written the same
five values down: an even --surface-tint, a hairline of ink at 7% all the way round, a radius of
34, and 121 over 81 of padding that becomes 21 on a phone. Identical, at both breakpoints, in two
places already — and the third was what made it worth saying once.

It is a plate rather than a ramp, unlike About-01's card and the service hero's, and it carries no
shadow: checked under its bottom edge on the render, where a shadow would show against the page.

WHAT A BLOCK STILL OWNS is everything inside it, and how the box behaves — About's card is a flex
column because of what stands in it. The panel is the plate and nothing else.
*/

.panel {
  width: min(var(--page-max), 100% - var(--page-inset) * 2);
  margin-inline: auto;
  padding: var(--panel-pad-y) var(--panel-pad-x);
  border: var(--rule-w) solid var(--panel-border);
  border-radius: var(--panel-radius);
  background: var(--panel-fill);
}