.results-section {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
  background: transparent;
  padding-top: var(--header-height);
}

.results-section .container {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: none;
  min-height: calc(100vh - var(--header-height));
  padding-inline: clamp(1rem, 2.2vw, 2.8rem);
}


/* ==================================================
   HEADING
================================================== */

.results-section .section-heading {
  position: absolute;
  z-index: 60;
  top: clamp(1rem, 2vh, 1.8rem);
  left: clamp(1.8rem, 3.4vw, 4rem);
  width: min(52rem, 47vw);
  pointer-events: none;
}

.results-section .section-heading > span {
  display: block;
  margin-bottom: 0.45rem;
  font-size: clamp(0.72rem, 0.66vw, 0.95rem);
  letter-spacing: 0.16em;
  color: rgba(255, 255, 255, 0.72);
}

.results-section .section-heading h2 {
  margin: 0;
  max-width: none;
  font-size: clamp(3rem, 3.8vw, 5.5rem);
  line-height: 0.95;
  white-space: nowrap;
}

.results-section .section-heading h2 strong {
  display: inline;
}

.results-section .section-heading p {
  max-width: 42rem;
  margin-top: 0.7rem;
  font-size: clamp(0.84rem, 0.82vw, 1.05rem);
  line-height: 1.3;
  color: var(--color-text-muted);
}


/* ==================================================
   RESULTS STAGE
================================================== */

.results-stage,
.results-gallery {
  position: absolute;
  inset: 0;
}

.results-stage {
  z-index: 1;
}

.results-gallery {
  z-index: 10;
}

.results-carousel {
  display: none;
}


/* ==================================================
   RESULT CARD BASE
================================================== */

.results-card {
  position: absolute;
  overflow: hidden;
  margin: 0;

  border: 2px solid rgba(255, 44, 215, 0.94);
  border-radius: clamp(10px, 0.85vw, 18px);

  background: rgba(5, 3, 12, 0.92);

  box-shadow:
    0 0 7px rgba(255, 29, 187, 0.8),
    0 0 19px rgba(131, 56, 255, 0.24);

  transform-origin: center;
}

.results-card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}


/* ==================================================
   DESKTOP COLLAGE

   --1  = 1.png
   --2  = 2.png
   --3  = 3.png
   --4  = 4.png
   --5  = 5.png
   --6  = 6.png
   --7  = 7.png
   --8  = 8.png
   --9  = 11.png
   --10 = 12.png
   --11 = 13.png
   --12 = 14.png
================================================== */


/* --------------------------------------------------
   LEFT GROUP
-------------------------------------------------- */

/* 1.png */
.results-card--1 {
  left: 8.7%;
  top: 31.8%;
  width: 24.8%;
  height: 18.8%;

  transform: rotate(-8deg);
  z-index: 14;
}

/* 2.png */
.results-card--2 {
  left: 29.6%;
  top: 23.4%;
  width: 17.4%;
  height: 35%;

  transform: rotate(-8deg);
  z-index: 39;
}

/* 6.png */
.results-card--6 {
  left: 4.8%;
  top: 52.3%;
  width: 12.8%;
  height: 33.5%;

  transform: rotate(-6deg);
  z-index: 31;
}

/* 13.png */
.results-card--11 {
  left: 16.9%;
  top: 50.2%;
  width: 28%;
  height: 25.2%;

  transform: rotate(-3deg);
  z-index: 18;
}

/* 12.png — portrait card, show much more of the original image */
.results-card--10 {
  left: 16.0%;
  top: 63.8%;
  width: 13.4%;
  height: 35.2%;

  transform: rotate(5deg);
  z-index: 37;
}

/* 7.png — slightly right, closer to 14.png */
.results-card--7 {
  left: 29.0%;
  top: 70.6%;
  width: 20.5%;
  height: 24.3%;

  transform: rotate(-5deg);
  z-index: 34;
}


/* --------------------------------------------------
   RIGHT GROUP
-------------------------------------------------- */

/* 3.png */
.results-card--3 {
  left: 47.3%;
  top: 20.7%;
  width: 23.4%;
  height: 26.2%;

  transform: rotate(7deg);
  z-index: 26;
}

/* 4.png — foreground visual anchor */
.results-card--4 {
  left: 67.6%;
  top: 19.1%;
  width: 15.3%;
  height: 35.2%;

  transform: rotate(-6deg);
  z-index: 42;
}

/* 5.png */
.results-card--5 {
  left: 83.1%;
  top: 27.9%;
  width: 16.3%;
  height: 23.6%;

  transform: rotate(8deg);
  z-index: 25;
}

/* 8.png */
.results-card--8 {
  left: 57.1%;
  top: 46.1%;
  width: 21.8%;
  height: 27.8%;

  transform: rotate(7deg);
  z-index: 33;
}

/* 11.png */
.results-card--9 {
  left: 78.2%;
  top: 49%;
  width: 15.8%;
  height: 30.2%;

  transform: rotate(-5deg);
  z-index: 35;
}

/* 14.png — moved left toward 7.png */
.results-card--12 {
  left: 50.3%;
  top: 70.3%;
  width: 25.2%;
  height: 23.2%;

  transform: rotate(6deg);
  z-index: 32;
}


/* ==================================================
   IMAGE POSITION INSIDE CARDS
================================================== */

.results-card--1 img {
  object-position: center 53%;
}

.results-card--2 img {
  object-position: center 16%;
}

.results-card--3 img {
  object-position: center 53%;
}

.results-card--4 img {
  object-position: center 24%;
}

.results-card--5 img {
  object-position: center 54%;
}

.results-card--6 img {
  object-position: center 42%;
}

.results-card--7 img {
  object-position: center 52%;
}

.results-card--8 img {
  object-position: center 48%;
}

.results-card--9 img {
  object-position: center 48%;
}

.results-card--10 img {
  object-fit: cover;
  object-position: center top;
}

.results-card--11 img {
  object-position: center 56%;
}

.results-card--12 img {
  object-position: center 56%;
}


/* ==================================================
   CTA — PREMIUM NEON VARIANT
================================================== */

.results-cta {
  position: absolute;
  z-index: 90;

  left: 52%;
  top: 59.2%;

  transform: translate(-50%, -50%);
}

.results-cta .button {
  width: clamp(15rem, 15vw, 19rem);
  min-width: 0;
  min-height: clamp(3.6rem, 6vh, 4.9rem);

  padding-inline: clamp(1.6rem, 2.8vw, 2.7rem);

  font-size: clamp(1rem, 1.08vw, 1.3rem);
  font-weight: 700;
  white-space: nowrap;

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    border-color 0.2s ease,
    filter 0.2s ease;
}

.results-cta .button:hover {
  transform: translateY(-3px) scale(1.025);

  border-color: #ffffff;

  filter: brightness(1.08);

  box-shadow:
    0 0 0 3px rgba(255, 45, 187, 0.88),
    0 0 16px rgba(255, 255, 255, 0.78),
    0 0 34px rgba(255, 45, 187, 0.95),
    0 0 64px rgba(166, 69, 255, 0.65),
    0 14px 32px rgba(0, 0, 0, 0.46);
}


/* ==================================================
   CONTACT CARD
================================================== */

.results-contact {
  position: absolute;
  z-index: 80;

  right: 3.7%;
  bottom: 3.4%;

  width: clamp(18rem, 19vw, 23rem);

  padding: clamp(0.75rem, 1vw, 1rem);

  border: 2px solid rgba(255, 44, 215, 0.82);
  border-radius: clamp(12px, 0.9vw, 18px);

  background:
    linear-gradient(
      145deg,
      rgba(17, 8, 31, 0.96),
      rgba(5, 3, 12, 0.98)
    );

  box-shadow:
    0 0 18px rgba(255, 29, 187, 0.2);

  transform: rotate(-5deg);

  transition:
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    filter 0.18s ease;
}

.results-contact__title {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  margin-bottom: 0.65rem;
}

.results-contact__title strong,
.results-contact__title span {
  display: block;
}

.results-contact__title strong {
  font-size: 0.95rem;
}

.results-contact__title span {
  font-size: 0.75rem;
  color: var(--color-text-muted);
}

.results-contact__icon {
  font-size: 1.8rem !important;
  color: var(--color-pink) !important;
}


/* ==================================================
   EMAIL COPY
================================================== */

.results-contact__email {
  width: 100%;
  min-height: 44px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 12px;

  padding: 0 14px;

  border: 1px solid rgba(171, 49, 255, 0.75);
  border-radius: 8px;

  background: rgba(15, 6, 29, 0.88);

  color: #ffffff;

  cursor: pointer;

  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background 0.2s ease;
}

.results-contact__email:hover {
  border-color: var(--color-pink);

  background: rgba(28, 8, 42, 0.95);

  box-shadow:
    0 0 12px rgba(255, 29, 187, 0.22);
}

.results-contact__email-text {
  font-size: 0.9rem;
}

.results-contact__copy-icon {
  flex: 0 0 auto;

  font-size: 1.15rem;

  color: var(--color-violet);

  transition:
    transform 0.2s ease;
}

.results-contact__email:hover .results-contact__copy-icon {
  transform: scale(1.1);
}

.results-contact__email.is-copied {
  border-color: #ffffff;

  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.8),
    0 0 16px rgba(255, 29, 187, 0.55);
}


/* ==================================================
   CONTACT HIGHLIGHT
================================================== */

.results-contact.is-highlighted {
  border-color: #ffffff;

  box-shadow:
    0 0 0 3px rgba(255, 29, 187, 0.8),
    0 0 32px rgba(255, 29, 187, 0.85),
    0 0 64px rgba(131, 56, 255, 0.55);

  filter: brightness(1.18);

  animation:
    contact-flash 1.15s ease-out forwards;
}

@keyframes contact-flash {

  0% {
    box-shadow:
      0 0 0 3px rgba(255, 255, 255, 1),
      0 0 38px rgba(255, 29, 187, 1),
      0 0 72px rgba(131, 56, 255, 0.72);
  }

  45% {
    box-shadow:
      0 0 0 2px rgba(255, 29, 187, 0.9),
      0 0 26px rgba(255, 29, 187, 0.65),
      0 0 52px rgba(131, 56, 255, 0.42);
  }

  100% {
    box-shadow:
      0 0 18px rgba(255, 29, 187, 0.2);
  }
}


/* ==================================================
   FULL HD — 1920x1080
================================================== */

@media (min-width: 1200px) and (max-width: 1919px) {

  .results-section .section-heading {
    left: 2.7%;
    top: 1.2rem;
    width: min(50rem, 50vw);
  }

  .results-section .section-heading h2 {
    font-size: clamp(2.8rem, 3.55vw, 4.7rem);
  }

  .results-section .section-heading p {
    max-width: 41rem;
    font-size: 0.96rem;
  }


  /* LEFT */

  .results-card--1 {
    left: 8.4%;
    top: 33.2%;
    width: 25.2%;
    height: 18.8%;
  }

  .results-card--2 {
    left: 29.1%;
    top: 24.7%;
    width: 17.8%;
    height: 35.3%;
    z-index: 39;
  }

  .results-card--6 {
    left: 4.6%;
    top: 53.8%;
    width: 13.1%;
    height: 34%;
  }

  .results-card--11 {
    left: 16.8%;
    top: 51.3%;
    width: 28.2%;
    height: 25.6%;
    z-index: 18;
  }

  .results-card--10 {
    left: 15.8%;
    top: 64.8%;
    width: 13.8%;
    height: 35.0%;
  }

  .results-card--7 {
    left: 29.0%;
    top: 71.4%;
    width: 20.8%;
    height: 24.4%;
  }


  /* RIGHT */

  .results-card--3 {
    left: 46.9%;
    top: 22.2%;
    width: 23.7%;
    height: 26.4%;
  }

  .results-card--4 {
    left: 67.3%;
    top: 20.8%;
    width: 15.5%;
    height: 35.5%;
    z-index: 42;
  }

  .results-card--5 {
    left: 82.9%;
    top: 29.8%;
    width: 16.5%;
    height: 23.8%;
  }

  .results-card--8 {
    left: 56.8%;
    top: 47.4%;
    width: 22%;
    height: 28.1%;
  }

  .results-card--9 {
    left: 77.9%;
    top: 50.2%;
    width: 16%;
    height: 30.5%;
  }

  .results-card--12 {
    left: 50.4%;
    top: 71.2%;
    width: 25.4%;
    height: 23.3%;
  }


  /* CTA */

  .results-cta {
    left: 52%;
    top: 60.4%;
  }


  /* CONTACT */

  .results-contact {
    right: 3.1%;
    bottom: 3%;
    width: clamp(17rem, 18vw, 20rem);
  }
}


/* ==================================================
   4K / LARGE DESKTOP
================================================== */

@media (min-width: 2200px) {

  .results-section .section-heading {
    left: 3.2rem;
    width: min(58rem, 46vw);
  }

  .results-section .section-heading h2 {
    font-size: clamp(4rem, 4.25vw, 6rem);
  }

  .results-section .section-heading p {
    font-size: 1.02rem;
    max-width: 45rem;
  }

  .results-contact {
    width: clamp(23rem, 18vw, 31rem);
  }

  .results-cta .button {
    width: clamp(21rem, 16vw, 26rem);
    min-height: clamp(4.8rem, 6.8vh, 6rem);

    padding-inline: clamp(2rem, 3vw, 3.4rem);

    font-size: clamp(1.3rem, 1.15vw, 1.65rem);

    border-width: 5px;

    border-radius: 22px;

    box-shadow:
      0 0 0 3px rgba(255, 45, 187, 0.72),
      0 0 16px rgba(255, 255, 255, 0.58),
      0 0 34px rgba(255, 45, 187, 0.82),
      0 0 70px rgba(166, 69, 255, 0.52),
      0 16px 34px rgba(0, 0, 0, 0.42);
  }
}


/* ==================================================
   TABLET
================================================== */

@media (max-width: 1199px) {

  .results-section {
    min-height: auto;

    padding:
      calc(var(--header-height) + 1.25rem)
      0
      2.5rem;

    overflow: visible;
  }

  .results-section .container {
    min-height: auto;
  }

  .results-section .section-heading {
    position: relative;

    top: auto;
    left: auto;

    width: min(92%, 30rem);

    margin: 0 0 1.2rem;

    pointer-events: auto;
  }

  .results-section .section-heading h2 {
    white-space: normal;
  }

  .results-section .section-heading h2 strong {
    display: block;
  }

  .results-section .section-heading p {
    max-width: 30rem;
  }


  .results-stage {
    position: relative;

    inset: auto;

    min-height: 43rem;
  }

  .results-gallery {
    display: none;
  }

  .results-carousel {
    position: relative;

    z-index: 5;

    display: grid;

    grid-template-columns:
      1fr
      1fr;

    gap: 0.75rem;
  }

  .results-carousel img {
    width: 100%;

    aspect-ratio: 4 / 3;

    object-fit: cover;

    border: 1px solid var(--color-pink);

    border-radius: 12px;
  }

  .results-cta {
    top: auto;
    bottom: 10.5rem;

    transform:
      translateX(-50%);
  }

  .results-contact {
    right: 50%;
    bottom: 0;

    width: min(92%, 28rem);

    transform:
      translateX(50%);
  }
}


/* ==================================================
   MOBILE
================================================== */

@media (max-width: 767px) {

  .results-stage {
    min-height: 50rem;
  }

  .results-carousel {
    grid-template-columns: 1fr;
  }

  .results-carousel img:nth-child(n + 4) {
    display: none;
  }

  .results-cta {
    bottom: 11.5rem;
  }
}


/* ==================================================
   COPY TOAST
================================================== */

.copy-toast {
  position: fixed;

  left: 24px;
  bottom: 24px;

  z-index: 9999;

  padding: 12px 16px;

  border: 1px solid rgba(255, 29, 187, 0.85);

  border-radius: 10px;

  background: rgba(10, 6, 18, 0.96);

  color: #ffffff;

  box-shadow:
    0 0 16px rgba(255, 29, 187, 0.28),
    0 8px 28px rgba(0, 0, 0, 0.35);

  font-size: 0.9rem;
  line-height: 1.2;

  opacity: 0;
  visibility: hidden;

  transform:
    translateY(10px);

  pointer-events: none;

  transition:
    opacity 0.2s ease,
    transform 0.2s ease,
    visibility 0.2s ease;
}

.copy-toast.is-visible {
  opacity: 1;
  visibility: visible;

  transform:
    translateY(0);
}


/* ==================================================
   ACCESSIBILITY
================================================== */

.sr-only {
  position: absolute;

  width: 1px;
  height: 1px;

  padding: 0;
  margin: -1px;

  overflow: hidden;

  clip: rect(0, 0, 0, 0);

  white-space: nowrap;

  border: 0;
}