html { overflow-x: clip; }
.social-room { padding: 110px 8.4% 100px; background: var(--bone); color: var(--ink); border-bottom: 1px solid #b9a88f; }
.social-room-heading { display: grid; grid-template-columns: 1fr 1fr; align-items: end; gap: 50px; margin-bottom: 48px; }
.social-room-heading h2 { margin: 0; }
.social-room-heading p { max-width: 37ch; font: 400 18px/1.65 var(--sans); }
.social-gallery { display: grid; grid-template-columns: 1.15fr 1fr .9fr; gap: 28px; align-items: start; }
.social-gallery a { color: inherit; text-decoration: none; }
.social-gallery a:nth-child(2) { margin-top: 64px; }
.social-gallery a:nth-child(3) { margin-top: 24px; }
.social-gallery figure { margin: 0; }
.social-gallery img { display: block; width: 100%; height: auto; aspect-ratio: 4/5; object-fit: cover; }
.social-gallery a:first-child img { aspect-ratio: auto; }
.social-gallery a:nth-child(3) img { aspect-ratio: 9/16; object-fit: contain; }
.social-gallery figcaption { padding-top: 14px; font: 600 15px/1.45 var(--sans); border-top: 2px solid var(--brass); margin-top: 12px; }
.social-gallery a:hover figcaption { color: var(--purple); }
.footer-social { display: flex; flex-direction: column; gap: 14px; min-width: 170px; }
.footer-social a { color: var(--bone); text-decoration: none; font: 600 14px/1.4 var(--sans); }
.footer-social a span { display: block; color: var(--lav); font-size: 12px; font-weight: 400; }
.footer-social a:hover { color: var(--brass); }
.social-context { display: block; width: fit-content; color: inherit; font: 600 14px/1.5 var(--sans); text-underline-offset: 5px; margin-top: 22px; }
.weekly-action { gap: 26px; flex-wrap: wrap; align-items: center; }
.weekly-action .social-context { margin-top: 0; }
.visit-review { color: var(--purple); font-weight: 600; text-underline-offset: 5px; }
.promo-reopen { color: var(--lav); background: transparent; border: 1px solid currentColor; padding: 10px 14px; font: 600 13px var(--sans); cursor: pointer; }
.promo-reopen[hidden] { display: none; }
.promo-dialog { box-sizing: border-box; padding: 0; border: 1px solid #c49754; background: #191117; color: #f1e5d2; width: min(960px, 94vw); max-height: 94svh; overflow: auto; }
.promo-dialog::backdrop { background: rgba(14, 8, 14, .88); }
.promo-toolbar, .promo-controls { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 16px 22px; }
.promo-toolbar { position: sticky; top: 0; z-index: 1; background: #191117; border-bottom: 1px solid #57404e; }
.promo-toolbar strong { font: 600 18px/1.4 var(--sans); }
.promo-dialog button { min-height: 44px; padding: 10px 16px; border: 1px solid #b49bb4; color: #f1e5d2; background: transparent; font: 600 14px var(--sans); cursor: pointer; }
.promo-dialog button:hover { background: #453044; }
.promo-dialog button:disabled { opacity: .45; cursor: default; }
.promo-stage { display: grid; grid-template-columns: 1.2fr 1fr; gap: 24px; padding: 24px; }
.promo-stage img { width: 100%; height: auto; max-height: 65svh; object-fit: contain; background: #100a10; }
.promo-description { align-self: center; }
.promo-description h2 { font: 500 clamp(30px, 4vw, 44px)/1.1 var(--serif); letter-spacing: -.025em; margin-top: 0; overflow-wrap: anywhere; }
.promo-description p { white-space: pre-line; font: 400 16px/1.65 var(--sans); }
.promo-description a { display: inline-block; margin-top: 16px; padding: 13px 20px; background: #d8c1dd; color: #301831; font: 600 15px var(--sans); text-decoration: none; }
.promo-controls { position: sticky; bottom: 0; background: #191117; border-top: 1px solid #57404e; }
.promo-controls .promo-enter { color: #191117; background: #c49754; border-color: #c49754; }
.promo-controls .promo-enter:hover { background: #e2b36e; }
.promo-controls small { color: #d8c1dd; font: 500 13px var(--sans); }
body.promo-open { overflow: hidden; }
.social-room a:focus-visible, .footer-social a:focus-visible, .social-context:focus-visible, .promo-dialog :focus-visible, .promo-reopen:focus-visible { outline: 3px solid #c49754; outline-offset: 5px; }
@media (max-width: 800px) {
  .social-room { padding: 75px 8%; }
  .social-room-heading { grid-template-columns: 1fr; gap: 24px; }
  .social-gallery { grid-template-columns: 1fr; gap: 32px; }
  .social-gallery a:nth-child(n) { margin-top: 0; }
  .social-gallery img { aspect-ratio: 4/3; }
  .footer-social { margin-top: 30px; gap: 18px; }
  .promo-stage { grid-template-columns: 1fr; padding: 16px; }
  .promo-stage img { max-height: 56svh; }
  .promo-toolbar, .promo-controls { padding: 12px; flex-wrap: wrap; }
  .promo-toolbar strong { font-size: 16px; }
  .promo-controls small { flex: 1; text-align: center; }
  .promo-controls .promo-enter { width: 100%; }
}