/* A small invitation over the event photograph, with the group's space kept open. */
.services-experience {
  padding: 0;
  overflow: clip;
  background: var(--mg-blues, #160F3E);
}
.services-experience::before { content: none; }
.services-scene {
  --services-photo-y: 0px;
  position: relative;
  isolation: isolate;
  display: grid;
  align-items: end;
  min-height: 760px;
  height: 90svh;
  max-height: 980px;
  overflow: hidden;
}
.services-scene-image {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: -1;
}
.services-scene-photo {
  position: absolute;
  inset: -40px 0;
  width: 100%;
  height: calc(100% + 80px);
  max-width: none;
  object-fit: cover;
  object-position: 50% 0%;
  transform: translateY(var(--services-photo-y));
}
.services-scene-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 55%, #160F3E26 78%, #160F3EAD);
}
.services-invitation {
  position: relative;
  width: min(580px, 46%);
  margin: 0 var(--gutter) 44px;
  border-radius: 16px 100px 16px 16px;
  background: #FFFFFF;
  color: #160F3E;
  box-shadow: 0 18px 50px #10102026;
}
.services-invitation-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  padding: clamp(30px, 3vw, 44px);
}
.services-kicker { margin-bottom: 18px; font: 12px/1.5 var(--mono); }
.services-invitation-copy h2 { font-size: clamp(42px, 4vw, 58px); line-height: 1.06; letter-spacing: -.055em; }
.services-invitation-copy h2 em { display: inline; line-height: 1.2; }
.services-invitation-copy > p:not(.services-kicker) { margin-top: 20px; max-width: 42ch; font-size: 15px; line-height: 1.65; }
.services-invitation-copy .services-invitation-cta { margin-top: 24px; padding: 15px 22px; gap: 30px; background: #00B1A3; border-color: #00B1A3; color: #160F3E; border-radius: 100px; }
.services-invitation-copy .services-invitation-cta:hover { background: #00A497; border-color: #00A497; }
.services-scene-foot { position: absolute; bottom: 44px; right: var(--gutter); display: flex; flex-direction: column; align-items: flex-end; gap: 14px; color: #FFFFFF; }
.services-scene-foot > span { font: 11px/1.5 var(--mono); }
.services-details {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  align-items: start;
  gap: clamp(45px, 8vw, 140px);
  padding: 110px var(--gutter) 120px;
  background: radial-gradient(ellipse at 95% 85%, #00B7CA18, transparent 55%), #160F3E;
}
.services-keepsake { position: sticky; top: var(--site-header-clearance, 70px); padding-top: 14px; }
.services-keepsake .home-about-image > img:first-child { height: clamp(480px, 68svh, 740px); object-position: center; }
.services-keepsake .home-about-image::after { border-radius: 100px 15px 15px 15px; }
.services-experience .service-chapters { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; scroll-margin-top: 0; }
.services-experience .service-chapters article { display: block; border: 0; padding: 30px 34px; transform: none; background: #FFFFFF; color: #160F3E; border-radius: 14px 70px 14px 14px; }
.services-experience .service-chapters article:nth-child(2) { border-radius: 14px 14px 70px 14px; }
.services-experience .service-chapters article:nth-child(3) { border-radius: 70px 14px 14px 14px; }
.services-experience .service-chapters .service-top { align-items: center; gap: 16px; }
.services-experience .service-chapters .brand-icon { width: 58px; height: 58px; flex-shrink: 0; }
.services-experience .service-chapters .service-word { color: var(--mg-blues); max-width: 25ch; font-size: 11px; }
.services-experience .service-chapters h3 { font-size: clamp(31px, 3.1vw, 46px); margin: 19px 0 17px; line-height: 1.05; }
.services-experience .service-chapters p { min-height: 0; font-size: 14px; max-width: 48ch; }
.services-experience .service-chapters .text-link { margin-top: 24px; color: #160F3E; border-color: #160F3E40; }
.services-experience .service-chapters .text-link:hover { border-color: #00B1A3; }
html[data-motion="paused"] .services-experience :is(.button, .service-chapters article) { transition: none; transform: none; }
@media (max-width: 1100px) {
  .services-details { gap: 50px; }
  .services-keepsake .home-about-image > img:first-child { height: auto; aspect-ratio: 3 / 4; }
  .services-keepsake .home-about-image > span { max-width: 12ch; left: 20px; line-height: 1.5; }
}
@media (max-width: 800px) {
  .services-scene { display: block; min-height: 0; height: auto; max-height: none; }
  .services-scene-image { position: relative; aspect-ratio: 4 / 3; z-index: 0; }
  .services-scene-photo { inset: 0; height: 100%; object-position: center; transform: none; }
  .services-scene-shade { background: linear-gradient(180deg, transparent 75%, #160F3E66); }
  .services-invitation { width: min(580px, calc(100% - 2 * var(--gutter))); margin: -30px var(--gutter) 0; border-top-right-radius: 80px; }
  .services-invitation-copy { padding: 34px; }
  .services-invitation-copy h2 { font-size: clamp(42px, 7vw, 58px); }
  .services-scene-foot { position: relative; bottom: auto; right: auto; margin: 24px var(--gutter) 0; padding-bottom: 28px; align-items: flex-start; }
  .services-scene-foot .motion-toggle { display: none; }
  .services-details { grid-template-columns: minmax(0, 1fr); padding-top: 65px; padding-bottom: 70px; gap: 64px; }
  .services-keepsake { position: relative; top: auto; width: min(100%, 540px); justify-self: center; }
  .services-keepsake .home-about-image > img:first-child { height: 590px; }
  .services-experience .service-chapters article { padding: 30px; }
  .services-experience .service-chapters h3 { font-size: 39px; }
  .services-experience .service-chapters .service-word { max-width: 28ch; }
}
@media (max-width: 480px) {
  .services-invitation-copy { padding: 28px 24px; }
  .services-invitation-copy h2 { font-size: clamp(35px, 10.5vw, 48px); }
  .services-invitation-copy > p:not(.services-kicker) { font-size: 14px; }
  .services-invitation-copy .services-invitation-cta { padding: 14px 18px; gap: 22px; font-size: 12px; }
  .services-scene-foot > span { font-size: 10px; }
  .services-keepsake .home-about-image > img:first-child { height: auto; aspect-ratio: 3 / 4; }
  .services-experience .service-chapters h3 { font-size: clamp(30px, 9vw, 35px); }
  .services-experience .service-chapters article { padding: 25px; }
  .services-experience .service-chapters .service-word { max-width: 21ch; font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  html:not([data-motion="running"]) .services-experience .button { transition: none; transform: none; }
}
@media (forced-colors: active) {
  .services-invitation-copy { background: Canvas; color: CanvasText; }
  .services-invitation-copy h2 em { color: CanvasText; }
}