/* =====================================
   NOVA — SELECTED RESULTS
   ===================================== */

.nova-results {
  --nr-bg: #090d16;
  --nr-surface: #141b29;
  --nr-border: rgba(174,195,237,.15);
  --nr-blue: #a4baff;

  background: var(--nr-bg);
  color: #f5f7ff;
  position: relative;
  overflow: hidden;
  padding: clamp(86px,10vw,160px) 24px
           clamp(68px,8vw,124px);
  isolation: isolate;
}

.nova-results::before {
  content: "";
  position: absolute;
  inset: -300px -200px auto auto;
  width: 850px;
  height: 850px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(51,88,171,.13),
    transparent 64%
  );
  pointer-events: none;
  z-index: -1;
}

.nr-wrap {
  width: min(1180px,100%);
  margin-inline: auto;
}

/* HEADER */

.nr-header__top,
.nr-heading-row,
.nr-toolbar,
.nr-case__meta,
.nr-case__bottom,
.nr-outro,
.nr-dialog__bar,
.nr-dialog__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.nr-header__top {
  gap: 20px;
  margin-bottom: 28px;
}

.nr-eyebrow,
.nr-index,
.nr-count,
.nr-case__meta,
.nr-case__bottom,
.nr-dialog__bar,
.nr-dialog__eyebrow {
  font-size: 10px;
  letter-spacing: .18em;
  font-weight: 650;
}

.nr-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  color: #d7e0f6;
}

.nr-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #a4baff;
  box-shadow: 0 0 18px #8fa9ff;
}

.nr-index,
.nr-count {
  color: #8794ac;
  white-space: nowrap;
}

.nr-heading-row {
  align-items: end;
  gap: 36px;
}

.nr-heading-row h2 {
  margin: 0;
  font-size: clamp(54px,8.2vw,118px);
  font-weight: 750;
  line-height: .91;
  letter-spacing: -.075em;
}

.nr-heading-row h2 em {
  color: var(--nr-blue);
  font-style: normal;
}

.nr-heading-row > p {
  margin: 0 0 7px;
  max-width: 285px;
  color: #a9b4c8;
  line-height: 1.65;
  font-size: 14px;
}

/* FILTERS */

.nr-toolbar {
  gap: 20px;
  margin: 48px 0 21px;
}

.nr-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.nr-filter {
  appearance: none;
  border: 1px solid #303b50;
  border-radius: 100px;
  padding: 11px 17px;
  color: #bac5d9;
  background: #161d2b;
  cursor: pointer;
  font: inherit;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  transition:
    background .22s,
    color .22s,
    border-color .22s,
    transform .22s;
}

.nr-filter:hover {
  color: white;
  border-color: #a4baff;
  transform: translateY(-1px);
}

.nr-filter.is-active {
  background: #d8e3ff;
  border-color: #d8e3ff;
  color: #101728;
}

.nr-filter:focus-visible,
.nr-case:focus-visible,
.nr-contact-cta:focus-visible,
.nr-dialog button:focus-visible,
.nr-dialog a:focus-visible {
  outline: 2px solid #a4baff;
  outline-offset: 4px;
}

/* PROJECT GRID */

.nr-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 16px;
}

.nr-case {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 455px;
  border: 1px solid var(--nr-border);
  border-radius: 16px;
  background: var(--nr-surface);
  padding: 0;
  overflow: hidden;
  text-align: left;
  color: inherit;
  font: inherit;
  cursor: pointer;
  transition:
    transform .28s,
    border-color .28s,
    box-shadow .28s;
}

.nr-case[hidden] {
  display: none !important;
}

.nr-case:hover {
  transform: translateY(-5px);
  border-color: rgba(164,186,255,.55);
  box-shadow: 0 25px 55px rgba(0,0,0,.22);
}

.nr-case__art {
  display: block;
  flex: 0 0 240px;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.nr-case__art::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    transparent 50%,
    rgba(6,9,16,.42)
  );
}

.nr-case__content {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
  padding: 25px 28px 23px;
}

.nr-case__meta {
  color: #b5c5e8;
  gap: 10px;
}

.nr-case__meta > span {
  color: #b5c5e8;
}

.nr-case__title {
  display: block;
  font-size: clamp(27px,3.1vw,44px);
  line-height: 1.02;
  letter-spacing: -.05em;
  font-weight: 760;
  margin: 21px 0 12px;
}

.nr-case__description {
  display: block;
  color: #aab6c9;
  line-height: 1.5;
  font-size: 13px;
  max-width: 370px;
}

.nr-case__bottom {
  margin-top: auto;
  padding-top: 30px;
  color: #c7d5f6;
  gap: 10px;
}

.nr-case__arrow {
  display: grid;
  place-items: center;
  width: 37px;
  height: 37px;
  border-radius: 50%;
  border: 1px solid #647799;
  font-size: 19px;
  transition: background .2s,color .2s;
}

.nr-case:hover .nr-case__arrow {
  background: #d8e3ff;
  color: #0c1425;
}

/* FEATURED PROJECT */

.nr-case--featured {
  grid-column: 1 / -1;
  min-height: 455px;
  display: grid;
  grid-template-columns: 1fr 1.06fr;
}

.nr-case--featured .nr-case__art {
  grid-column: 2;
  grid-row: 1;
  height: 100%;
  min-height: 455px;
}

.nr-case--featured .nr-case__content {
  grid-column: 1;
  grid-row: 1;
  padding: clamp(30px,4vw,57px);
}

.nr-case--featured .nr-case__title {
  font-size: clamp(42px,5.4vw,79px);
  margin-top: auto;
}

.nr-case--featured .nr-case__description {
  font-size: 15px;
}

.nr-case--featured .nr-case__bottom {
  padding-top: 48px;
}

/* ART — WEB & SEO */

.nr-art__label {
  position: absolute;
  z-index: 2;
  left: 22px;
  bottom: 20px;
  color: rgba(231,237,255,.85);
  font-size: 10px;
  letter-spacing: .18em;
  font-weight: 700;
}

.nr-art--web {
  background: radial-gradient(
    circle at 58% 48%,
    #344c82 0,
    #17233c 34%,
    #0b1425 78%
  );
}

.nr-art__orbit {
  position: absolute;
  left: 50%;
  top: 50%;
  border: 1px solid rgba(180,202,255,.25);
  border-radius: 50%;
  transform: translate(-50%,-50%);
}

.nr-art__orbit--one {
  width: 64%;
  aspect-ratio: 1;
}

.nr-art__orbit--two {
  width: 100%;
  aspect-ratio: 1;
}

.nr-art__core {
  position: absolute;
  top: 49%;
  left: 50%;
  transform: translate(-50%,-50%);
  font-size: clamp(60px,9vw,145px);
  font-weight: 850;
  letter-spacing: -.14em;
  white-space: nowrap;
  color: #e8efff;
  text-shadow: 0 0 60px rgba(121,161,255,.3);
}

.nr-art__core span {
  color: #91b1ff;
}

/* ART — GROWTH */

.nr-art--growth {
  background: linear-gradient(
    145deg,
    #10283b,
    #0d1528 65%,
    #192b44
  );
}

.nr-art__bars {
  position: absolute;
  left: 13%;
  right: 13%;
  bottom: 25%;
  height: 60%;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 11px;
}

.nr-art__bars i {
  flex: 1;
  border-radius: 5px 5px 0 0;
  background: linear-gradient(0deg,#3a65a7,#afcaff);
  opacity: .87;
  box-shadow: 0 0 35px rgba(108,155,255,.1);
}

.nr-art__bars i:nth-child(1) {height:22%}
.nr-art__bars i:nth-child(2) {height:36%}
.nr-art__bars i:nth-child(3) {height:31%}
.nr-art__bars i:nth-child(4) {height:56%}
.nr-art__bars i:nth-child(5) {height:69%}
.nr-art__bars i:nth-child(6) {height:94%}

/* ART — BRANDING */

.nr-art--branding {
  background: radial-gradient(
    circle at 48% 35%,
    #596b87,
    #24314a 48%,
    #111a2b
  );
}

.nr-art__package {
  position: absolute;
  width: 120px;
  height: 150px;
  top: 18%;
  left: 50%;
  border-radius: 5px;
  box-shadow: 12px 20px 35px rgba(0,0,0,.35);
}

.nr-art__package--back {
  transform: translateX(-8%) rotate(15deg);
  background: linear-gradient(135deg,#a6b8d7,#4a658b);
}

.nr-art__package--front {
  transform: translateX(-85%) rotate(-12deg);
  background: linear-gradient(140deg,#e5ebf7,#9aadd2);
  display: grid;
  place-items: center;
}

.nr-art__package--front span {
  font-size: 70px;
  font-weight: 800;
  color: #182642;
  letter-spacing: -.1em;
}

/* ART — SOCIAL */

.nr-art--social {
  background: linear-gradient(
    140deg,
    #23223d,
    #142d49 65%,
    #111725
  );
}

.nr-art__social-card {
  position: absolute;
  top: 23%;
  width: 28%;
  height: 52%;
  border: 1px solid rgba(233,239,255,.2);
  border-radius: 10px;
  display: grid;
  place-items: center;
  font-size: 28px;
  font-weight: 850;
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
}

.nr-art__social-card--one {
  left: 14%;
  transform: rotate(-15deg);
  background: #7388b7;
}

.nr-art__social-card--two {
  left: 36%;
  transform: rotate(4deg);
  background: #344e81;
  font-size: 23px;
}

.nr-art__social-card--three {
  left: 59%;
  transform: rotate(14deg);
  background: #c4d4ff;
  color: #1a2947;
}

/* ART — WEBSITE */

.nr-art--website {
  background: linear-gradient(145deg,#0c263a,#1a213c);
}

.nr-art__browser {
  position: absolute;
  left: 16%;
  top: 20%;
  width: 70%;
  height: 66%;
  border: 1px solid #5d7195;
  border-radius: 9px;
  background: #17253e;
  box-shadow: 20px 24px 50px rgba(0,0,0,.4);
  transform: rotate(-5deg);
}

.nr-art__browser-bar {
  display: block;
  height: 25px;
  border-bottom: 1px solid #475b7d;
  padding: 4px 11px;
  color: #7c91b5;
  font-size: 9px;
  letter-spacing: .3em;
}

.nr-art__browser-word {
  display: block;
  margin: 20px 0 0 23px;
  font-size: 47px;
  font-weight: 850;
  letter-spacing: -.1em;
}

.nr-art__browser-word span {
  color: #91b1ff;
}

.nr-art__browser-lines {
  display: block;
  width: 62%;
  height: 7px;
  background: #405779;
  margin: 16px 0 0 24px;
  border-radius: 6px;
  box-shadow:
    0 17px 0 #314867,
    0 34px 0 #314867;
}

/* BOTTOM CTA */

.nr-outro {
  border-top: 1px solid var(--nr-border);
  margin-top: 52px;
  padding-top: 30px;
  gap: 20px;
}

.nr-outro p {
  margin: 0;
  font-size: clamp(18px,2.4vw,30px);
  font-weight: 750;
  letter-spacing: -.045em;
}

.nr-outro em {
  color: #a4baff;
  font-style: normal;
}

.nr-contact-cta {
  cursor: pointer;
  background: #d8e3ff;
  color: #101727;
  border: 0;
  border-radius: 3px;
  padding: 17px 22px;
  font: inherit;
  font-size: 11px;
  letter-spacing: .09em;
  font-weight: 800;
  white-space: nowrap;
  transition: transform .2s,background .2s;
}

.nr-contact-cta:hover {
  background: white;
  transform: translateY(-2px);
}

.nr-contact-cta span {
  margin-left: 15px;
  font-size: 17px;
}

/* PROJECT PREVIEW DIALOG */

.nr-dialog {
  width: min(760px,calc(100vw - 32px));
  max-height: min(90dvh,900px);
  padding: 0;
  border: 1px solid #384763;
  border-radius: 15px;
  background: #0c1321;
  color: #f6f8ff;
  box-shadow: 0 45px 130px rgba(0,0,0,.65);
  overflow: auto;
}

.nr-dialog::backdrop {
  background: rgba(1,5,14,.82);
  backdrop-filter: blur(9px);
}

.nr-dialog__bar {
  padding: 22px 28px;
  border-bottom: 1px solid #293650;
  color: #aebbd6;
  gap: 16px;
}

.nr-dialog__close {
  color: #e5edff;
  background: transparent;
  border: 0;
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  letter-spacing: .1em;
}

.nr-dialog__body {
  padding: clamp(24px,5vw,48px);
}

.nr-dialog__eyebrow {
  color: #a4baff;
}

.nr-dialog h3 {
  font-size: clamp(38px,6vw,67px);
  letter-spacing: -.06em;
  line-height: 1.03;
  margin: 18px 0;
}

.nr-dialog__description {
  color: #c2ccdf;
  line-height: 1.65;
  max-width: 540px;
  font-size: 15px;
}

.nr-dialog__visual {
  height: 210px;
  margin: 30px 0 13px;
  background: radial-gradient(
    circle at 60% 40%,
    #3c5688,
    #1b2b48 50%,
    #111d31
  );
  border: 1px solid #405275;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
}

.nr-dialog__visual > span {
  font-size: 74px;
  font-weight: 850;
  letter-spacing: -.11em;
}

.nr-dialog__visual > span span {
  color: #a4baff;
}

.nr-dialog__visual small {
  font-size: 10px;
  letter-spacing: .18em;
  color: #afc2e6;
}

.nr-dialog__note {
  color: #8f9eb9;
  font-size: 12px;
  line-height: 1.5;
}

.nr-dialog__actions {
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 30px;
}

.nr-dialog__primary,
.nr-dialog__secondary {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 48px;
  padding: 14px 20px;
  border-radius: 3px;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .05em;
  text-decoration: none;
  cursor: pointer;
}

.nr-dialog__primary {
  background: #d8e3ff;
  color: #111b2c;
  border: 1px solid #d8e3ff;
}

.nr-dialog__secondary {
  background: transparent;
  color: #e0e9ff;
  border: 1px solid #5c6f94;
}

/* MOBILE */

@media (max-width:760px) {

  .nova-results {
    padding: 75px 17px;
  }

  .nr-header__top {
    margin-bottom: 22px;
  }

  .nr-heading-row {
    display: block;
  }

  .nr-heading-row h2 {
    font-size: clamp(50px,12vw,76px);
  }

  .nr-heading-row > p {
    margin-top: 23px;
    max-width: 400px;
  }

  .nr-toolbar {
    display: block;
    margin-top: 35px;
  }

  .nr-filters {
    gap: 7px;
  }

  .nr-filter {
    font-size: 9px;
    padding: 10px 12px;
  }

  .nr-count {
    display: block;
    margin: 15px 0 0;
  }

  .nr-grid {
    grid-template-columns: 1fr;
    gap: 13px;
  }

  .nr-case {
    min-height: 410px;
  }

  .nr-case__art {
    flex-basis: 220px;
  }

  .nr-case__content {
    padding: 22px;
  }

  .nr-case__title {
    font-size: 34px;
  }

  .nr-case--featured {
    grid-column: 1;
    display: flex;
    flex-direction: column;
  }

  .nr-case--featured .nr-case__art {
    min-height: 260px;
    height: 260px;
  }

  .nr-case--featured .nr-case__content {
    padding: 25px;
  }

  .nr-case--featured .nr-case__title {
    margin-top: 26px;
    font-size: clamp(39px,9vw,60px);
  }

  .nr-case--featured .nr-case__bottom {
    padding-top: 30px;
  }

  .nr-outro {
    flex-direction: column;
    align-items: flex-start;
  }

  .nr-dialog__bar {
    padding: 19px 22px;
  }

  .nr-dialog__visual {
    height: 175px;
  }
}

@media (prefers-reduced-motion:reduce) {

  .nr-filter,
  .nr-case,
  .nr-case__arrow,
  .nr-contact-cta {
    transition: none;
  }

}
.nr-art--edart {
  position: relative;
  overflow: hidden;
  padding: 0;
  background: #173ca5;
}

.nr-art--edart > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.nr-art--edart::before,
.nr-art--edart::after {
  content: none;
}
.nr-art--nini {
  position: relative;
  overflow: hidden;
  padding: 0;
  background: #260000;
}

.nr-art--nini > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.nr-art--nini::before,
.nr-art--nini::after {
  content: none;
}
.nr-case .nr-art--nini {
  display: block;
  position: relative;
  min-height: 220px;
  padding: 0;
  overflow: hidden;
  background: #260000;
}

.nr-case .nr-art--nini > img {
  display: block;
  width: 100%;
  height: 220px;
  object-fit: contain;
}
#nr-grid [data-nr-case="branding"] .nr-art--nini {
  display: block !important;
  width: 100%;
  height: 240px !important;
  flex: 0 0 240px !important;
  background: #260000 url("images/nini-preview.png")
    center / contain no-repeat !important;
  opacity: 1 !important;
  visibility: visible !important;
}

#nr-grid [data-nr-case="branding"] .nr-art--nini > img {
  display: none !important;
}
#nr-grid .nr-art--ecommerce {
  position: relative;
  width: 100%;
  height: 240px;
  flex: 0 0 240px;
  overflow: hidden;
  background: #050831;
}

#nr-grid .nr-art--ecommerce > img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

#nr-grid .nr-art--ecommerce::before,
#nr-grid .nr-art--ecommerce::after {
  content: none;
}
#nr-grid .nr-art--ecommerce > img {
  object-fit: cover;
  object-position: center;
}
#nr-grid .nr-art--sofra {
  position: relative;
  width: 100%;
  height: 240px;
  flex: 0 0 240px;
  overflow: hidden;
  background: #160e09;
}

#nr-grid .nr-art--sofra > img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

#nr-grid .nr-art--sofra::before,
#nr-grid .nr-art--sofra::after {
  content: none;
}
[data-nr-case="social"] .nr-art__social-card {
  display: none !important;
}