.serene-close {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: 720px; scroll-margin-top: 60px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 110px 6vw 100px; background: #173d32; color: #fffcf2;
}
.serene-film, .serene-shade {
  position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none;
}
.serene-film { z-index: -2; object-fit: cover; object-position: center; }
.serene-shade {
  z-index: -1;
  background: linear-gradient(0deg, #0b251d99, #0b251d55 55%, #0b251d33);
}
.serene-close .eyebrow { color: #f1d9a6; }
.serene-close h2 {
  font-size: clamp(42px, 5.8vw, 82px); max-width: 1200px;
  text-shadow: 0 2px 24px #07171080;
}
.serene-close > p:not(.eyebrow) {
  max-width: 760px; font: 21px/1.65 Georgia, serif;
  text-shadow: 0 2px 10px #071710cc;
}
.serene-close .primary { background: #e1c58d; color: #13241c; }
.serene-motion-toggle {
  position: absolute; top: 22px; right: 6vw;
  border: 1px solid #ffffff80; background: #10251fc9; color: white;
  padding: 10px 14px; cursor: pointer; font: 12px Arial, sans-serif;
}
@media(max-width:600px) {
  .serene-close { min-height: 680px; padding: 100px 6vw 75px; }
  .serene-close > p:not(.eyebrow) { font-size: 18px; }
}
@media(prefers-reduced-motion:reduce) {
  .serene-motion-toggle { display: none; }
}
