/* Art Antalya v2.0.6 — Happiness Story adoption stories and chapter-matched popups. */

/* Every work in the four Happiness Story chapters has found a home. */
.story-chapter-page .story-work-grid > button.story-work {
  position: relative;
}

.story-chapter-page .art-adopted-badge {
  position: absolute;
  z-index: 5;
  top: 14px;
  right: 14px;
  display: inline-flex;
  align-items: center;
  min-height: 27px;
  padding: 0 10px;
  border: 1px solid rgba(255,255,255,.46);
  border-radius: 999px;
  background: rgba(16, 45, 42, .78);
  color: #fff8df;
  box-shadow: 0 8px 24px rgba(6, 28, 26, .22);
  backdrop-filter: blur(10px);
  font: 800 7px/1 Arial, sans-serif;
  font-style: normal;
  letter-spacing: .12em;
  text-transform: uppercase;
  pointer-events: none;
}

.story-chapter-page .art-work-has-owner-story .art-adopted-badge {
  background: linear-gradient(135deg, rgba(184,74,54,.94), rgba(225,158,63,.94));
  box-shadow: 0 9px 26px rgba(121,55,35,.28);
}

/* Popup backdrop now follows the emotional palette of each chapter. */
.series-lightbox.story-popup {
  background: rgba(6, 18, 20, .94) !important;
}

.story-popup-happiness-story::after {
  background:
    radial-gradient(circle at 76% 17%, rgba(249,208,91,.21), transparent 26%),
    radial-gradient(circle at 9% 28%, rgba(194,62,48,.22), transparent 30%),
    linear-gradient(145deg, rgba(10,50,48,.97), rgba(16,76,79,.94) 52%, rgba(8,39,41,.98)) !important;
}
.story-popup-happiness-story .series-lightbox-shell > figure {
  background:
    radial-gradient(circle at 77% 18%, #f4d266 0 5.5%, rgba(244,210,102,.35) 12%, transparent 26%),
    radial-gradient(ellipse at 12% 22%, rgba(201,67,48,.68), transparent 34%),
    radial-gradient(ellipse at 88% 78%, rgba(20,89,91,.68), transparent 40%),
    linear-gradient(158deg, #c84e3d 0%, #e69248 25%, #e7bb59 42%, #2d91a0 62%, #176d79 78%, #143d3c 100%) !important;
}

.story-popup-world-of-children::after {
  background:
    radial-gradient(circle at 78% 16%, rgba(231,245,255,.24), transparent 22%),
    linear-gradient(145deg, rgba(13,39,70,.98), rgba(37,78,112,.95) 52%, rgba(20,50,78,.98)) !important;
}
.story-popup-world-of-children .series-lightbox-shell > figure {
  background:
    radial-gradient(circle at 80% 16%, #f3f8ff 0 5%, rgba(239,247,255,.24) 11%, transparent 24%),
    radial-gradient(circle at 18% 24%, rgba(255,255,255,.48) 0 1.2px, transparent 1.8px),
    radial-gradient(circle at 68% 36%, rgba(255,255,255,.34) 0 1px, transparent 1.7px),
    linear-gradient(160deg, #819eb7, #4d789d 44%, #244c75 72%, #163755) !important;
  background-size: auto, 82px 82px, 108px 108px, auto !important;
}

.story-popup-dream-series::after {
  background:
    radial-gradient(circle at 82% 12%, rgba(104,202,255,.17), transparent 24%),
    linear-gradient(145deg, rgba(2,10,29,.99), rgba(8,28,69,.97) 56%, rgba(3,14,39,.99)) !important;
}
.story-popup-dream-series .series-lightbox-shell > figure {
  background:
    radial-gradient(circle at 78% 17%, rgba(111,204,255,.30) 0 7%, transparent 19%),
    radial-gradient(circle, rgba(255,231,91,.88) 0 1px, transparent 1.7px),
    radial-gradient(circle, rgba(191,232,255,.72) 0 1px, transparent 1.7px),
    linear-gradient(155deg, #173f79, #0b2859 46%, #07152f 100%) !important;
  background-size: auto, 43px 43px, 67px 67px, auto !important;
  background-position: center, 0 0, 19px 27px, center !important;
}

.story-popup-light-stories::after {
  background:
    radial-gradient(circle at 78% 12%, rgba(255,235,135,.22), transparent 27%),
    linear-gradient(145deg, rgba(53,80,58,.97), rgba(105,114,65,.92) 46%, rgba(44,72,56,.98)) !important;
}
.story-popup-light-stories .series-lightbox-shell > figure {
  background:
    radial-gradient(circle at 76% 14%, rgba(255,245,180,.95) 0 6%, rgba(255,229,130,.30) 13%, transparent 28%),
    linear-gradient(150deg, #fff3bf 0%, #ead88e 40%, #aac6a0 68%, #698f72 100%) !important;
}

/* Header/footer are calmer extensions of each chapter rather than a generic beige frame. */
.story-popup-happiness-story .series-lightbox-shell > header,
.story-popup-happiness-story .series-lightbox-shell > footer {
  background: #f3e2b5 !important;
}
.story-popup-world-of-children .series-lightbox-shell > header,
.story-popup-world-of-children .series-lightbox-shell > footer {
  background: #edf4f8 !important;
}
.story-popup-dream-series .series-lightbox-shell > header {
  background: #07162f !important;
  color: #edf5ff !important;
  border-color: rgba(151,210,247,.20) !important;
}
.story-popup-dream-series .series-lightbox-shell > header p,
.story-popup-dream-series .series-lightbox-shell > header span,
.story-popup-dream-series .series-lightbox-shell > header span b,
.story-popup-dream-series .series-lightbox-shell > header button {
  color: #e9f4ff !important;
}
.story-popup-dream-series .series-lightbox-shell > header i {
  border-color: rgba(216,237,255,.42) !important;
}
.story-popup-dream-series .series-lightbox-shell > footer {
  background: #e7eef4 !important;
}
.story-popup-light-stories .series-lightbox-shell > header,
.story-popup-light-stories .series-lightbox-shell > footer {
  background: #fff5cf !important;
}

/* Small ownership note in the normal artwork footer. */
.story-popup .series-lightbox-shell > footer .art-private-collection-note {
  grid-column: 2 / -1;
  display: block;
  margin-top: 1px;
  color: var(--popup-accent) !important;
  opacity: .94 !important;
  font: 850 7px/1.25 Arial, sans-serif;
  letter-spacing: .13em;
  text-transform: uppercase;
}

/* Owner story: side-by-side with the painting on wide screens. */
.story-popup .series-lightbox-shell > figure.has-owner-story {
  grid-template-columns: 52px minmax(360px, 1.2fr) minmax(300px, .72fr) 52px !important;
  gap: clamp(14px, 1.7vw, 30px);
  padding-inline: clamp(10px, 2vw, 34px) !important;
}

.story-popup .series-lightbox-shell > figure.has-owner-story > .series-lightbox-prev { grid-column: 1; }
.story-popup .series-lightbox-shell > figure.has-owner-story > .series-lightbox-art { grid-column: 2; }
.story-popup .series-lightbox-shell > figure.has-owner-story > .art-owner-story { grid-column: 3; }
.story-popup .series-lightbox-shell > figure.has-owner-story > .series-lightbox-next { grid-column: 4; }

.art-owner-story {
  z-index: 3;
  align-self: stretch;
  min-width: 0;
  max-height: 100%;
  overflow: auto;
  border: 1px solid rgba(255,255,255,.42);
  border-radius: 24px;
  background: rgba(249,245,230,.91);
  box-shadow: 0 22px 58px rgba(5,25,24,.24);
  backdrop-filter: blur(16px);
  color: var(--popup-ink);
  display: grid;
  grid-template-rows: minmax(190px, 43%) auto;
}

.art-owner-story-photo {
  min-height: 0;
  margin: 0;
  overflow: hidden;
  background: rgba(255,255,255,.52);
  border-bottom: 1px solid rgba(43,63,54,.14);
  position: relative;
}

.art-owner-story-photo::after {
  content: "картина дома";
  position: absolute;
  left: 14px;
  bottom: 13px;
  padding: 7px 9px;
  border-radius: 999px;
  background: rgba(9,35,33,.72);
  color: #fff;
  backdrop-filter: blur(8px);
  font: 800 6px/1 Arial, sans-serif;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.art-owner-story-photo img {
  width: 100%;
  height: 100%;
  min-height: 210px;
  object-fit: cover;
  display: block;
}
.art-owner-story[data-owner-story="moon-flowers"] .art-owner-story-photo img {
  object-position: 50% 29%;
}
.art-owner-story[data-owner-story="to-the-moon"] .art-owner-story-photo img {
  object-position: 50% 42%;
}

.art-owner-story-copy {
  align-content: start;
  gap: 8px;
  padding: clamp(18px, 2vw, 27px);
  display: grid;
}
.art-owner-story-copy small {
  color: var(--popup-accent);
  font: 850 7px/1.2 Arial, sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.art-owner-story-copy h3 {
  margin: 0;
  color: var(--popup-ink);
  font: 400 clamp(25px, 2vw, 36px)/1.02 Georgia, 'Times New Roman', serif;
  letter-spacing: -.035em;
}
.art-owner-story-copy strong {
  color: var(--popup-ink);
  opacity: .74;
  font: 700 9px/1.45 Arial, sans-serif;
  letter-spacing: .02em;
}
.art-owner-story-copy p {
  margin: 6px 0 0;
  color: var(--popup-ink);
  font: 400 clamp(12px, .92vw, 15px)/1.65 Georgia, 'Times New Roman', serif;
}

/* Keep the framed artwork dominant even when the story card is present. */
.story-popup .series-lightbox-shell > figure.has-owner-story .series-lightbox-frame img {
  max-width: min(100%, 58vw) !important;
}

@media (max-width: 1120px) {
  .story-popup .series-lightbox-shell > figure.has-owner-story {
    grid-template-columns: 40px minmax(0, 1fr) 40px !important;
    grid-template-rows: minmax(420px, 1fr) auto;
    align-content: start;
    overflow-y: auto !important;
    gap: 10px;
  }
  .story-popup .series-lightbox-shell > figure.has-owner-story > .series-lightbox-prev {
    grid-column: 1; grid-row: 1;
  }
  .story-popup .series-lightbox-shell > figure.has-owner-story > .series-lightbox-art {
    grid-column: 2; grid-row: 1;
    min-height: 420px;
  }
  .story-popup .series-lightbox-shell > figure.has-owner-story > .series-lightbox-next {
    grid-column: 3; grid-row: 1;
  }
  .story-popup .series-lightbox-shell > figure.has-owner-story > .art-owner-story {
    grid-column: 1 / -1; grid-row: 2;
    width: min(760px, calc(100% - 24px));
    justify-self: center;
    grid-template-columns: minmax(170px, .42fr) minmax(0, 1fr);
    grid-template-rows: none;
    max-height: none;
  }
  .art-owner-story-photo {
    border-right: 1px solid rgba(43,63,54,.14);
    border-bottom: 0;
  }
  .art-owner-story-photo img { min-height: 250px; }
}

@media (max-width: 760px) {
  .story-chapter-page .art-adopted-badge {
    top: 9px;
    right: 9px;
    min-height: 23px;
    max-width: calc(100% - 18px);
    padding: 0 8px;
    font-size: 5.8px;
    letter-spacing: .10em;
  }

  .story-popup .series-lightbox-shell.has-owner-story {
    grid-template-rows: 58px minmax(0, 1fr) 124px !important;
  }
  .story-popup .series-lightbox-shell > figure.has-owner-story {
    grid-template-columns: 34px minmax(0, 1fr) 34px !important;
    grid-template-rows: minmax(330px, 56svh) auto;
    padding: 10px 2px 18px !important;
  }
  .story-popup .series-lightbox-shell > figure.has-owner-story > .series-lightbox-art {
    min-height: 330px;
  }
  .story-popup .series-lightbox-shell > figure.has-owner-story > .art-owner-story {
    width: calc(100% - 16px);
    border-radius: 18px;
    grid-template-columns: 1fr;
  }
  .art-owner-story-photo {
    border-right: 0;
    border-bottom: 1px solid rgba(43,63,54,.14);
    max-height: 360px;
  }
  .art-owner-story-photo img {
    min-height: 310px;
    max-height: 360px;
  }
  .art-owner-story-copy {
    padding: 18px;
    gap: 7px;
  }
  .art-owner-story-copy h3 { font-size: 27px; }
  .art-owner-story-copy p { font-size: 13px; line-height: 1.58; }

  .story-popup .series-lightbox-shell > footer .art-private-collection-note {
    grid-column: 1 / -1;
    font-size: 6px;
    margin-top: 3px;
  }
}

@media (max-width: 430px) {
  .story-popup .series-lightbox-shell.has-owner-story {
    grid-template-rows: 56px minmax(0, 1fr) 132px !important;
  }
  .story-popup .series-lightbox-shell > figure.has-owner-story {
    grid-template-rows: minmax(300px, 52svh) auto;
  }
  .art-owner-story-photo img {
    min-height: 290px;
    max-height: 330px;
  }
}