.section.detail {
  width: min(calc(100% - 48px), 850px);
  max-width: none;
  margin-inline: auto;
  padding: clamp(48px, 7vw, 84px) 0;
  overflow-wrap: anywhere;
}

.section.detail > h1 {
  font-size: clamp(38px, 7vw, 56px);
  line-height: 1.02;
  letter-spacing: -2.5px;
  max-width: 100%;
}

.section.detail > p {
  max-width: 680px;
  font-size: clamp(16px, 2.3vw, 19px);
  line-height: 1.45;
}

.section.detail .panel {
  width: 100%;
  min-width: 0;
  margin-top: 24px;
}

.section.detail .panel h2 {
  font-size: clamp(25px, 4.5vw, 34px);
  line-height: 1.1;
}

.section.detail input,
.section.detail select,
.section.detail textarea,
.section.detail button {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.section.detail input,
.section.detail select,
.section.detail textarea {
  min-height: 48px;
}

@media (max-width: 700px) {
  .section.detail {
    width: min(calc(100% - 32px), 850px);
    padding: 40px 0 56px;
  }

  .section.detail > h1 {
    font-size: clamp(36px, 12vw, 48px);
    letter-spacing: -2px;
  }

  .section.detail .panel {
    padding: 20px;
    border-radius: 14px;
  }
}

@media (max-width: 380px) {
  .section.detail {
    width: min(calc(100% - 24px), 850px);
  }

  .section.detail .panel {
    padding: 16px;
  }
}
