.contacts-page {
  display: grid;
  gap: 20px;
  padding-bottom: 42px
}

.contacts-hero-copy {
  position: relative;
  z-index: 1;
  max-width: 650px
}

.contacts-card-heading {
  display: flex;
  align-items: flex-start;
  gap: 13px
}

.contacts-card-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border: 1px solid #5a83e6aa;
  border-radius: 12px;
  background: #24437b66;
  color: #8dc7ff;
  font-size: 21px;
  font-weight: 800
}

.contacts-card-icon-soft {
  border-color: #4e9f9a88;
  background: #1f5e6055;
  color: #79e4d2
}

.contacts-card-lead {
  max-width: 570px;
  margin: 22px 0 16px;
  color: #b1c1da;
  font-size: 13px;
  line-height: 1.65
}

.contacts-email-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  width: 100%;
  box-sizing: border-box;
  font-family: inherit;
  text-align: left;
  cursor: copy;
  padding: 15px 17px;
  border: 1px solid #4d75c5;
  border-radius: 11px;
  background: #172d51cc;
  color: #9bdcff;
  font-size: clamp(16px, 2vw, 20px);
  font-weight: 800;
  text-decoration: none;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
  appearance: none
}

.contacts-email-link:hover,
.contacts-email-link:focus-visible {
  border-color: #77bfff;
  background: #1d3b68;
  color: #fff;
  transform: translateY(-2px);
  outline: 0
}

.contacts-email-link b {
  color: #c8eaff;
  font-size: 22px
}

.contacts-card-note {
  margin: 11px 0 0;
  color: #7288a8;
  font-size: 11px
}

.contacts-checklist {
  display: grid;
  gap: 12px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none
}

.contacts-checklist li {
  position: relative;
  padding-left: 25px;
  color: #b1c1da;
  font-size: 12px;
  line-height: 1.5
}

.contacts-checklist li::before {
  position: absolute;
  left: 0;
  top: 1px;
  display: grid;
  place-items: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #2e806f66;
  color: #7ee5c6;
  content: "✓";
  font-size: 10px;
  font-weight: 900
}

.contacts-note-icon {
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  border-radius: 50%;
  background: #2b846a;
  color: #d8fff0;
  font-size: 13px;
  font-weight: 900
}

.memory-page {
  position: relative;
  max-width: 900px;
  margin: 0 auto;
  padding-bottom: 20px
}

.memory-glow {
  position: absolute;
  top: -120px;
  left: 50%;
  width: 420px;
  height: 420px;
  transform: translateX(-50%);
  border-radius: 50%;
  background: radial-gradient(circle,#ffca6740,transparent 68%);
  pointer-events: none
}

.memory-candle {
  position: relative;
  margin-bottom: 26px
}

.memory-candle svg {
  display: block;
  width: 58px;
  height: 98px
}

.memory-wick {
  fill: #3b3325
}

.memory-plate {
  fill: #263352
}

.memory-eyebrow {
  position: relative;
  color: #c3a86e;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .34em;
  text-transform: uppercase
}

.memory-role {
  position: relative;
  margin: 15px 0 0;
  color: #9dabc6;
  font-size: 13px
}

.memory-letter-note {
  margin: 26px 0 0;
  padding-top: 18px;
  border-top: 1px solid #212c42;
  color: #77869f;
  font-size: 11px;
  line-height: 1.6;
  font-style: italic
}

.memory-profiles-grid {
  display: grid;
  gap: 10px
}

.memory-profile-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 13px;
  border: 1px solid #22304a;
  border-radius: 13px;
  background: #101725;
  transition: border-color .2s ease,background .2s ease,transform .2s ease
}

.memory-profile-card:hover {
  border-color: #4e638f;
  background: #151f31;
  transform: translateY(-2px)
}

.memory-profile-card img {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  border: 1px solid #3a4a6c;
  border-radius: 50%;
  object-fit: cover
}

.memory-profile-card span {
  display: grid;
  gap: 3px;
  min-width: 0
}

.memory-profile-card b {
  overflow: hidden;
  color: #e6ecf8;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap
}

.memory-profile-card small {
  color: #7d8ca6;
  font-size: 10px
}

.memory-final {
  margin-top: 36px;
  text-align: center
}

.memory-final-line {
  width: 76px;
  height: 1px;
  margin: 0 auto 22px;
  background: linear-gradient(90deg,transparent,#4a5c80,transparent)
}

.memory-final p {
  margin: 0;
  color: #8d9bb4;
  font-size: 13px;
  line-height: 1.7
}

.contacts-page,
.memory-page { --cyan: var(--accent); --blue: var(--accent); }
.contacts-card-icon,
.contacts-note-icon {
  border: 1px solid var(--line-strong);
  border-radius: var(--r-md);
  background: var(--surface-raised);
  color: var(--accent);
}
.contacts-card-icon-soft { color: var(--online); }
.contacts-card-lead,
.contacts-checklist li { color: var(--muted); }
.contacts-email-link {
  border-color: var(--line-strong);
  border-radius: var(--r-md);
  background: var(--surface-raised);
  color: var(--text);
  box-shadow: none;
}
.contacts-email-link:hover,
.contacts-email-link:focus-visible { border-color: var(--accent); background: var(--surface-hover); color: var(--text); }
.contacts-email-link b { color: var(--accent); }
.contacts-checklist li::before { background: var(--surface-raised); color: var(--online); }
.contacts-note-icon { color: var(--online); }
.memory-glow { display: none; }
.memory-eyebrow { color: var(--accent); letter-spacing: .08em; }
.memory-role,
.memory-letter-note,
.memory-final p { color: var(--muted); }
.memory-letter-note { border-top-color: var(--line); }
.memory-profile-card {
  border-color: var(--line);
  border-radius: var(--r-md);
  background: var(--surface);
}
.memory-profile-card:hover { border-color: var(--line-strong); background: var(--surface-raised); transform: none; }
.memory-profile-card img { border-color: var(--line-strong); }
.memory-profile-card b { color: var(--text); }
.memory-profile-card small { color: var(--muted); }

@media (prefers-reduced-motion: reduce) {
  .contacts-email-link,
  .memory-profile-card { transition: none; }
}