/* 05: direct contact, in the same mist-blue palette as sections 02–04. */
.ending {
  display: flex;
  flex-direction: column;
  min-height: calc(100svh - 32px);
  padding-bottom: 0;
  background: radial-gradient(ellipse at 3% 95%, #d9e4ed, transparent 58%),
    linear-gradient(125deg, #f8f9fa, #e8edf2);
  color: #35465e;
}

.ending .panel-top { flex: none; }
.contact-layout {
  position: relative;
  z-index: 1;
  flex: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr);
  gap: clamp(38px, 6vw, 100px);
  align-items: center;
  padding: 42px 5vw 40px;
}
.ending .ending-copy {
  width: 100%;
  max-width: 690px;
  margin: 0;
  padding: 0;
}
.ending .ending-copy .kicker { margin: 0 0 22px; color: #8b7758; }
.ending h2 {
  margin: 0;
  font-size: clamp(39px, 4.8vw, 76px);
  line-height: 1.27;
  font-weight: 400;
  letter-spacing: -.065em;
}
.ending h2 span { color: #788ea9; font-weight: 300; }
.ending .contact-lead {
  max-width: 500px;
  margin: 24px 0 25px;
  color: #5c6d82;
  font-size: 13px;
  line-height: 2;
}
.contact-location {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 24px;
}
.contact-location-icon {
  display: grid;
  place-items: center;
  width: 39px;
  height: 39px;
  flex: none;
  border: 1px solid #aebccd;
  border-radius: 50%;
  color: #58708d;
  font-size: 18px;
}
.contact-location small,
.contact-qr-card small {
  display: block;
  margin-bottom: 5px;
  color: #7e8ca0;
  font-size: 9px;
  letter-spacing: .13em;
}
.contact-location strong { font-size: 14px; font-weight: 500; letter-spacing: .05em; }
.contact-address {
  display: block;
  margin: 18px 0 0;
  padding-top: 15px;
  border-top: 1px solid #dbe2ea;
  color: #3f5872;
  font-size: 14px;
  line-height: 1.7;
  letter-spacing: .02em;
}
.contact-qr-card {
  width: min(100%, 540px);
  padding: 18px;
  border: 1px solid #fff;
  border-radius: 23px;
  background: #fff9;
  box-shadow: 0 18px 42px #465b7311;
}
.contact-qr-intro strong {
  display: block;
  color: #35465e;
  font-size: clamp(18px, 1.6vw, 22px);
  font-weight: 400;
  line-height: 1.5;
}
.contact-qr-intro p {
  margin: 5px 0 17px;
  color: #6e7e92;
  font-size: 11px;
  line-height: 1.7;
}
.contact-qr-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.contact-qr-item { min-width: 0; margin: 0; }
.contact-qr-item a {
  display: block;
  width: 180px;
  max-width: 100%;
  border: 0;
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
}
.contact-qr-item img {
  display: block;
  width: 180px;
  max-width: 100%;
  height: auto;
  aspect-ratio: 1;
  object-fit: contain;
  background: #fff;
}
.contact-qr-item figcaption {
  display: flex;
  justify-content: space-between;
  width: 180px;
  max-width: 100%;
  margin-top: 8px;
  color: #526983;
  font-size: 10px;
  letter-spacing: .03em;
}
.contact-photo {
  position: relative;
  align-self: stretch;
  min-height: 520px;
  max-height: 690px;
  margin: 0;
  overflow: hidden;
  border: 1px solid #ffffffad;
  border-radius: 100px 27px 27px 27px;
  background: #a1a9ac;
  box-shadow: 0 24px 60px #41536b20;
}
.contact-photo::after {
  position: absolute;
  inset: 60% 0 0;
  background: linear-gradient(transparent, #19202bb0);
  content: '';
  pointer-events: none;
}
.contact-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 52%;
  filter: saturate(.75);
}
.contact-photo figcaption {
  position: absolute;
  z-index: 1;
  right: 24px;
  bottom: 24px;
  left: 24px;
  color: #fff;
  font-size: 10px;
  letter-spacing: .12em;
}
.ending footer {
  position: relative;
  z-index: 1;
  right: auto;
  bottom: auto;
  left: auto;
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 0 5vw;
  padding: 21px 0 25px;
  border-top: 1px solid #b8c5d3;
  color: #63758a;
  font-size: 10px;
}
.ending footer a { margin-left: auto; color: #465e7b; }
.ending a:focus-visible { outline: 3px solid #607794; outline-offset: 5px; }

@media (max-width: 900px) {
  .contact-layout { gap: 28px; }
  .contact-photo { min-height: 520px; }
  .contact-qr-list { gap: 14px; }
  .contact-qr-item a,
  .contact-qr-item img,
  .contact-qr-item figcaption { width: 130px; }
}
@media (max-width: 680px) {
  .ending { min-height: calc(100svh - 20px); }
  .contact-layout { display: flex; flex-direction: column; align-items: stretch; gap: 28px; padding: 40px 6vw 32px; }
  .ending h2 { font-size: clamp(36px, 9vw, 52px); }
  .ending .contact-lead { font-size: 12px; margin: 20px 0; }
  .contact-qr-card { width: 100%; }
  .contact-qr-item a,
  .contact-qr-item img,
  .contact-qr-item figcaption { width: 170px; }
  .contact-photo { height: 380px; min-height: 0; flex: none; border-radius: 66px 22px 22px 22px; }
  .ending footer { flex-wrap: wrap; margin: 0 6vw; padding: 19px 0 25px; font-size: 9px; }
}
@media (max-width: 460px) {
  .contact-qr-list { grid-template-columns: 1fr; gap: 19px; }
  .contact-qr-item a,
  .contact-qr-item img,
  .contact-qr-item figcaption { width: 190px; }
  .contact-photo { height: 345px; }
  .ending footer a { width: 100%; margin-left: 0; }
}
