.lay-about {
  container-type: inline-size;
  padding-block: clamp(40px, 5vw, 88px) clamp(48px, 6vw, 96px);
  font-size: 20px;
  line-height: 1.6;
  & * { box-sizing: border-box; }
  & h1, & h2, & h3, & p { margin: 0; }
  & h1 { max-width: 900px; font-size: clamp(40px, 5vw, 76px); line-height: 1.08; letter-spacing: -0.025em; }
  & h2 { font-size: clamp(28px, 3vw, 38px); line-height: 1.16; margin-bottom: 24px; }
  & h3 { font-size: 24px; line-height: 1.25; margin-bottom: 12px; }
  & p + p { margin-top: 18px; }
  & a { overflow-wrap: anywhere; text-underline-offset: 4px; }
  & a:focus-visible { outline: 3px solid #1638cb; outline-offset: 5px; }
  & .lay-aboutWidth { width: min(1240px, calc(100% - 48px)); margin-inline: auto; }
  & .obj-aboutIntro { max-width: 960px; padding-bottom: 36px; }
  & .obj-kicker { font-size: 14px; line-height: 1.5; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 16px; color: #1638cb; }
  & .obj-standfirst { max-width: 820px; font-size: clamp(22px, 2.2vw, 28px); line-height: 1.45; margin-top: 26px; }
  & .obj-date { font-size: 16px; margin-top: 24px; }
  & .obj-topicNav { display: flex; flex-wrap: wrap; gap: 8px 28px; padding-block: 18px; border-block: 1px solid #bcc9de; margin-bottom: 52px; }
  & .obj-topicNav a { display: flex; align-items: center; min-height: 44px; max-width: 100%; font-size: 18px; }
  & .lay-aboutGrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 25em), 1fr)); gap: 48px; margin-block: 48px; }
  & .obj-topic { min-width: 0; scroll-margin-top: 24px; }
  & .obj-method { padding: clamp(24px, 4vw, 48px); border-radius: 20px; }
  & .obj-methodIntro { max-width: 900px; }
  & .lay-criteria { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16em), 1fr)); gap: 32px 36px; list-style: decimal-leading-zero; padding: 0; margin: 36px 0; counter-reset: criterion; }
  & .lay-criteria li { list-style: none; min-width: 0; padding-top: 20px; border-top: 1px solid #a9bad3; counter-increment: criterion; }
  & .lay-criteria h3::before { content: counter(criterion, decimal-leading-zero) " / "; color: #1638cb; }
  & .obj-methodNote { border-top: 1px solid #a9bad3; padding-top: 24px; max-width: 900px; }
  & .obj-contact { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22em), 1fr)); gap: 36px; padding: clamp(24px, 4vw, 48px); border-radius: 20px; }
  & .obj-contact > div { min-width: 0; }
  & .obj-contactCard { display: grid; align-content: start; gap: 16px; min-width: 0; font-style: normal; padding: 28px; border: 1px solid #b7c7dd; border-radius: 12px; background: #fff; }
  & .obj-contactCard strong { font-size: 26px; }
  & .obj-contactCard a { display: block; min-height: 32px; }
  & .skin-tint { background: #f0f4fb; }
}
.skin-paper { background: #fff; color: #1a3665; }
@container (max-width: 64rem) {
  .lay-about .lay-aboutGrid { gap: 36px; }
}
@container (max-width: 40rem) {
  .lay-about .lay-aboutWidth { width: calc(100% - 32px); }
  .lay-about .obj-topicNav { margin-bottom: 32px; gap: 8px 20px; }
  .lay-about .lay-aboutGrid { margin-block: 36px; }
  .lay-about .obj-contactCard { padding: 20px; }
}
