/* Campaign-only dialog; the existing homepage remains the entry for ordinary visits. */
.ss-campaign {
  width: min(920px, calc(100% - 48px));
  max-width: none;
  max-height: calc(100vh - 48px);
  max-height: calc(100dvh - 48px);
  margin: auto;
  padding: 0;
  overflow: auto;
  overscroll-behavior: contain;
  border: 1px solid rgba(245, 241, 231, .25);
  border-radius: 8px;
  background: var(--ss-black);
  color: var(--ss-ivory);
}

.ss-campaign:not([open]) { display: none; }
.ss-campaign::backdrop { background: rgba(3, 8, 9, .82); }
html:has(.ss-campaign[open]) { overflow: hidden; }

.ss-campaign-panel { position: relative; isolation: isolate; }

.ss-campaign-photo,
.ss-campaign-photo::after,
.ss-campaign-photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.ss-campaign-photo { z-index: -1; pointer-events: none; }
.ss-campaign-photo img { object-fit: cover; object-position: center 38%; }
.ss-campaign-photo::after {
  content: "";
  background: linear-gradient(180deg, rgba(7, 11, 12, .3) 0%, rgba(7, 11, 12, .08) 21%, rgba(7, 11, 12, .88) 48%, #070b0c 77%);
}

.ss-campaign-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 24px;
  background: linear-gradient(rgba(7, 11, 12, .6), transparent);
}

.ss-campaign-brand { display: flex; align-items: center; gap: 10px; }
.ss-campaign-brand img { border-radius: 8px; }
.ss-campaign-brand span { font-family: "Bodoni Moda", Georgia, serif; font-size: 21px; }

.ss-campaign-close {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-width: 90px;
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid rgba(245, 241, 231, .55);
  border-radius: 4px;
  background: #070b0c;
  color: var(--ss-ivory);
  font: 600 14px/1.4 "Manrope", sans-serif;
  cursor: pointer;
}

.ss-campaign-close span { font-size: 24px; line-height: 1; }
.ss-campaign-close:hover { background: #213133; }
.ss-campaign :is(a, button):focus-visible { outline: 3px solid var(--ss-teal); outline-offset: 4px; }

.ss-campaign-copy { padding: 150px 48px 32px; }
.ss-campaign .ss-campaign-copy h2 { font-size: clamp(36px, 5.4vw, 56px); line-height: 1.06; }
#campaign-description { max-width: 440px; margin-top: 18px; font-size: 16px; line-height: 1.6; }
.ss-campaign-price { margin-top: 22px; font-size: 13px; line-height: 1.6; color: #cbd4d0; }
.ss-campaign-price strong { color: var(--ss-ivory); font-weight: 700; }

.ss-campaign-stores { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; margin-top: 18px; }
.ss-campaign-stores a { display: block; flex: 0 0 auto; height: 48px; }
.ss-campaign-stores img { width: auto; height: 100%; }
.ss-campaign-stores a:nth-child(2) { width: 157px; overflow: hidden; }
.ss-campaign-stores a:nth-child(2) img { width: 100%; object-fit: cover; object-position: center; }
.ss-campaign-learn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  margin-top: 14px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 4px;
}
.ss-campaign-learn:hover { color: var(--ss-teal); }
#manifesto-title { scroll-margin-top: 110px; }

@media (max-width: 600px) {
  .ss-campaign { width: calc(100% - 24px); max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); }
  .ss-campaign-bar { padding: 12px; }
  .ss-campaign-brand { gap: 8px; }
  .ss-campaign-brand span { font-size: 18px; }
  .ss-campaign-brand img { width: 30px; height: 30px; }
  .ss-campaign-close { min-width: 78px; gap: 6px; }
  .ss-campaign-copy { padding: 124px 22px 22px; }
  .ss-campaign .ss-campaign-copy h2 { font-size: clamp(32px, 8.9vw, 44px); }
  #campaign-description { margin-top: 14px; font-size: 14px; }
  .ss-campaign-price { margin-top: 18px; font-size: 12px; }
  .ss-campaign-stores { gap: 10px; margin-top: 16px; }
  .ss-campaign-stores a { height: 44px; }
  .ss-campaign-stores a:nth-child(2) { width: 144px; }
  .ss-campaign-learn { font-size: 12px; gap: 7px; }
}

@media (max-width: 359px) {
  .ss-campaign-copy { padding-inline: 16px; }
  .ss-campaign-stores { gap: 8px; }
  .ss-campaign-stores a { height: 44px; display: flex; align-items: center; }
  .ss-campaign-stores img { height: 39px; }
  .ss-campaign-stores a:nth-child(2) { width: 128px; }
}

@media (max-height: 650px) {
  .ss-campaign-copy { padding-top: 48px; }
}

/* A separate, surf-only treatment. Ordinary and Aurora sessions keep their existing art. */
.ss-campaign-surf .ss-campaign-photo { display: none; }
.ss-campaign-surf .ss-campaign-panel {
  background:
    radial-gradient(ellipse at 75% 0%, rgba(232, 164, 91, .28), transparent 55%),
    linear-gradient(151deg, #15383e 0%, #12262a 42%, #070b0c 84%);
}
.ss-campaign-surf .ss-campaign-copy { padding-top: 70px; }
@media (max-width: 600px) {
  .ss-campaign-surf .ss-campaign-copy { padding-top: 34px; }
}