/* NadirFilm Neon Reel v2.7.1 — shared card geometry, distinct editorial identities.
 * Five equal-size cards per row on wide screens; responsive grids on smaller screens.
 * Skin-specific backdrops, poster art, label shapes, offsets and decorative layers remain unique.
 * Applies to existing editorial selections and future custom terms, never the Marvel guide. */

/* The shared five-across cabinet: no oversized featured card or unequal card dimensions.
   A selection may still stagger equal-size cards as part of its own art direction. */
.nf-curation .nf-curation-grid {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  align-items:stretch;
  gap:25px 15px;
}
.nf-curation .nf-curation-grid > .nf-curation-card {
  display:flex;
  flex-direction:column;
  grid-column:auto;
  grid-row:auto;
  align-self:stretch;
  justify-self:stretch;
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  margin:0;
  transform:none;
}
.nf-curation .nf-curation-grid .nf-curation-card__poster {
  display:block;
  flex:0 0 auto;
  width:100%;
  height:auto;
  min-height:0;
  aspect-ratio:2/3;
}
.nf-curation .nf-curation-grid .nf-curation-card__poster img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.nf-curation .nf-curation-grid .nf-curation-card__copy {
  display:flex;
  flex:0 0 116px;
  flex-direction:column;
  justify-content:flex-start;
  height:116px;
  min-height:116px;
  max-height:116px;
  overflow:hidden;
  padding:14px 12px 14px;
}
.nf-curation .nf-curation-grid .nf-curation-card__metadata {
  flex-wrap:nowrap;
  white-space:nowrap;
  min-height:13px;
  overflow:hidden;
  margin-bottom:8px;
  font-size:10px;
}
.nf-curation .nf-curation-grid .nf-curation-card__copy h3 {
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  line-clamp:2;
  overflow:hidden;
  overflow-wrap:anywhere;
  max-height:2.5em;
  margin:0;
}
.nf-curation .nf-curation-grid .nf-curation-card__original {
  display:block;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  margin:7px 0 0;
  max-width:100%;
}

/* Reality: revert ONLY the oversized, side-by-side first film of v2.6.98.
   Every film uses the original prismatic poster/copy design. */
.nf-curation.nf-curation--neon .nf-curation-grid > .nf-curation-card:first-child {
  display:flex;
  grid-column:auto;
  grid-template-columns:none;
  min-height:0;
  background:#0b182b;
}
.nf-curation.nf-curation--neon .nf-curation-grid > .nf-curation-card:first-child .nf-curation-card__poster {
  height:auto;
  min-height:0;
  aspect-ratio:2/3;
  border-right:0;
}
.nf-curation.nf-curation--neon .nf-curation-grid > .nf-curation-card:first-child .nf-curation-card__copy {
  justify-content:flex-start;
  height:116px;
  min-height:116px;
  max-height:116px;
  padding:14px 12px 14px;
  background:linear-gradient(135deg,#0d2434 0%,#0c192e 70%,#131728 100%);
}
.nf-curation.nf-curation--neon .nf-curation-grid > .nf-curation-card:first-child .nf-curation-card__copy h3 {
  font-size:16px;
  line-height:1.2;
}
.nf-curation.nf-curation--neon .nf-curation-grid > .nf-curation-card:first-child .nf-curation-card__copy::after {
  top:0;
  left:auto;
  right:0;
  width:47%;
  height:2px;
  background:linear-gradient(90deg,transparent,#9a95e4);
}

/* Shared baseline before the Japan-specific zine offsets reapplied at the end of this file. */
.nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card,
.nf-curation.nf-curation--horror .nf-curation-grid > .nf-curation-card {
  margin-top:0;
  transform:none;
}
.nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:hover,
.nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:focus-within {
  transform:translateY(-7px) rotate(0);
}
.nf-curation.nf-curation--horror .nf-curation-grid > .nf-curation-card:hover,
.nf-curation.nf-curation--horror .nf-curation-grid > .nf-curation-card:focus-within {
  transform:translateY(-7px) rotate(0);
}

/* The future-editorial fallback is neutral; new collections can receive their
   own art direction without changing the shared card dimensions. */
.nf-curation.nf-curation--custom {
  --cur-accent:#b7c7f3;
  --cur-ink:#f4f2fa;
  --cur-sub:#b7b6ce;
  --cur-border:rgba(172,181,233,.3);
  --cur-card:#17182a;
  background:#101220;
}
.nf-curation--custom .nf-curation-ambient {
  background:radial-gradient(ellipse at 78% 9%,rgba(114,104,195,.23),transparent 56%),linear-gradient(#151529,#0d101c 82%);
}
.nf-curation--custom .nf-curation-hero::before {
  background-image:linear-gradient(90deg,rgba(14,15,31,.97),rgba(18,18,38,.80) 48%,rgba(18,19,40,.17)),linear-gradient(0deg,rgba(7,8,20,.7),transparent 75%),var(--nf-cur-image,linear-gradient(110deg,#1b1d36,#3d3760,#101322));
}

/* Responsive readability: five cards on wide screens, three on tablet,
   two on phones. Equal sizes are maintained at each breakpoint. */
@media (min-width:761px) and (max-width:1179px) {
  .nf-curation .nf-curation-grid {grid-template-columns:repeat(3,minmax(0,1fr));gap:23px 17px}
}
@media (max-width:760px) {
  .nf-curation .nf-curation-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:19px 12px}
  .nf-curation .nf-curation-grid .nf-curation-card__copy,
  .nf-curation.nf-curation--neon .nf-curation-grid > .nf-curation-card:first-child .nf-curation-card__copy {
    flex-basis:112px;
    height:112px;
    min-height:112px;
    max-height:112px;
    padding:11px 10px 12px;
  }
  .nf-curation .nf-curation-grid .nf-curation-card__metadata {font-size:9px;gap:6px;margin-bottom:7px}
  .nf-curation .nf-curation-grid .nf-curation-card__copy h3 {font-size:clamp(12px,3.4vw,15px);line-height:1.25}
  .nf-curation .nf-curation-grid .nf-curation-card__original {font-size:10px;margin-top:5px}
  .nf-curation.nf-curation--neon .nf-curation-grid > .nf-curation-card:first-child .nf-curation-card__copy h3 {font-size:clamp(12px,3.4vw,15px)}
}
@media (max-width:360px) {
  .nf-curation .nf-curation-grid {gap:17px 9px}
  .nf-curation .nf-curation-grid .nf-curation-card__copy,
  .nf-curation.nf-curation--neon .nf-curation-grid > .nf-curation-card:first-child .nf-curation-card__copy {
    flex-basis:109px;
    height:109px;
    min-height:109px;
    max-height:109px;
    padding:10px 8px 11px;
  }
}

/* ========================================================================
   v2.7.0 — restore a distinct art direction to each selection.
   Geometry stays standardized; visual language does not.
   ======================================================================== */

/* JAPAN — youth zine / scrapbook. Equal-size cards deliberately float at
   different vertical levels on wide screens, just like the earlier version. */
@media (min-width:1180px) {
  .nf-curation.nf-curation--japan .nf-curation-grid {
    row-gap:56px;
    align-items:stretch;
  }
  .nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card {
    --nf-jp-offset:0px;
    --nf-jp-tilt:0deg;
    transform:translateY(var(--nf-jp-offset)) rotate(var(--nf-jp-tilt));
    transform-origin:center top;
    z-index:1;
  }
  .nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:nth-child(5n+1) {--nf-jp-offset:0px;--nf-jp-tilt:-.18deg}
  .nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:nth-child(5n+2) {--nf-jp-offset:25px;--nf-jp-tilt:.38deg}
  .nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:nth-child(5n+3) {--nf-jp-offset:8px;--nf-jp-tilt:-.3deg}
  .nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:nth-child(5n+4) {--nf-jp-offset:34px;--nf-jp-tilt:.48deg}
  .nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:nth-child(5n+5) {--nf-jp-offset:14px;--nf-jp-tilt:-.24deg}
  .nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:hover,
  .nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:focus-within {
    transform:translateY(calc(var(--nf-jp-offset,0px) - 7px)) rotate(0deg);
    z-index:5;
  }
}

/* The same Japanese poster-marker is no longer stamped identically on every
   poster. Five restrained zine textures rotate through each five-card row. */
.nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:nth-child(5n+1) .nf-curation-card__poster::before {
  background-image:linear-gradient(160deg,rgba(255,255,255,.11),transparent 22%),url('./curation-textures/japan-card-doodles.svg');
  background-position:center,center;
  background-size:cover,100% 100%;
  opacity:.58;
}
.nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:nth-child(5n+2) .nf-curation-card__poster::before {
  background-image:linear-gradient(160deg,rgba(255,255,255,.10),transparent 22%),url('./curation-textures/japan-zine-stickers.svg');
  background-position:center,center;
  background-size:cover,cover;
  opacity:.40;
}
.nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:nth-child(5n+3) .nf-curation-card__poster::before {
  background-image:linear-gradient(160deg,rgba(255,255,255,.10),transparent 22%),url('./curation-textures/japan-youth-ribbons.svg');
  background-position:center,center;
  background-size:cover,cover;
  opacity:.47;
}
.nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:nth-child(5n+4) .nf-curation-card__poster::before {
  background-image:linear-gradient(160deg,rgba(255,255,255,.10),transparent 22%),url('./curation-textures/japan-card-notes.svg');
  background-position:center,center;
  background-size:cover,100% 100%;
  opacity:.53;
}
.nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:nth-child(5n+5) .nf-curation-card__poster::before {
  background-image:linear-gradient(160deg,rgba(255,255,255,.10),transparent 22%),url('./curation-textures/sakura-petals.svg');
  background-position:center,right top;
  background-size:cover,70% auto;
  opacity:.58;
}

/* Japanese order numbers: cut-paper stickers with a different paper tint per card. */
.nf-curation.nf-curation--japan .nf-curation-card__index {
  border:1px solid rgba(255,242,248,.92);
  border-radius:2px 7px 2px 2px;
  clip-path:polygon(0 0,calc(100% - 6px) 0,100% 6px,100% 100%,0 100%);
  background:linear-gradient(135deg,#f5c7d9,#d9c8ff);
  color:#29182f;
  box-shadow:3px 3px 0 rgba(55,27,63,.58);
  transform:rotate(-2deg);
}
.nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:nth-child(5n+2) .nf-curation-card__index {background:linear-gradient(135deg,#b9e0ff,#c4c8ff);transform:rotate(2deg)}
.nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:nth-child(5n+3) .nf-curation-card__index {background:linear-gradient(135deg,#ffe2a8,#f5c5d8);transform:rotate(-1deg)}
.nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:nth-child(5n+4) .nf-curation-card__index {background:linear-gradient(135deg,#f8c4d7,#c1d9ff);transform:rotate(3deg)}
.nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:nth-child(5n+5) .nf-curation-card__index {background:linear-gradient(135deg,#e7d0ff,#ffd5dc);transform:rotate(-3deg)}

/* REALITY — no scrapbook offsets: equal rows, but every poster gets a different
   temporal / prismatic overlay so the repeated cyan geometry stops feeling stamped. */
.nf-curation.nf-curation--neon .nf-curation-grid > .nf-curation-card:nth-child(5n+1) .nf-curation-card__poster::before {
  background:url('./curation-textures/reality-fractures.svg') no-repeat right top/100% 100%,url('./curation-textures/circuit-fracture.svg') no-repeat center/cover;
  opacity:.82;
}
.nf-curation.nf-curation--neon .nf-curation-grid > .nf-curation-card:nth-child(5n+2) .nf-curation-card__poster::before {
  background:url('./curation-textures/reality-prism.svg') no-repeat center/cover,linear-gradient(115deg,rgba(87,224,237,.12),rgba(163,135,235,.13));
  opacity:.76;
}
.nf-curation.nf-curation--neon .nf-curation-grid > .nf-curation-card:nth-child(5n+3) .nf-curation-card__poster::before {
  background:url('./curation-textures/reality-loop.svg') no-repeat center/cover,linear-gradient(90deg,rgba(71,218,236,.13),transparent 72%);
  opacity:.72;
}
.nf-curation.nf-curation--neon .nf-curation-grid > .nf-curation-card:nth-child(5n+4) .nf-curation-card__poster::before {
  background:url('./curation-textures/reality-echo.svg') no-repeat center/cover,linear-gradient(135deg,rgba(135,112,223,.15),rgba(66,221,232,.06));
  opacity:.74;
}
.nf-curation.nf-curation--neon .nf-curation-grid > .nf-curation-card:nth-child(5n+5) .nf-curation-card__poster::before {
  background:url('./curation-textures/circuit-fracture.svg') no-repeat left center/cover,url('./curation-textures/reality-prism.svg') no-repeat center/cover;
  opacity:.76;
}
.nf-curation.nf-curation--neon .nf-curation-card__index {
  border-radius:0;
  clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,0 100%);
  background:linear-gradient(145deg,rgba(3,31,47,.98),rgba(8,21,41,.96));
  border-color:#65edf1;
  box-shadow:3px 3px 0 rgba(155,133,232,.44),inset 0 0 0 1px rgba(105,233,239,.12);
}

/* HORROR — evidence archive, not a repeated wireframe. Different analog marks
   appear on the poster faces while the dark green palette and aligned cards stay. */
.nf-curation.nf-curation--horror .nf-curation-grid > .nf-curation-card:nth-child(5n+1) .nf-curation-card__poster::before {
  background:url('./curation-textures/haunted-analog-scars.svg') no-repeat center/100% 100%,url('./curation-textures/haunted-mist.svg') no-repeat center/112% 115%,linear-gradient(0deg,rgba(25,60,57,.26),transparent 43%);
}
.nf-curation.nf-curation--horror .nf-curation-grid > .nf-curation-card:nth-child(5n+2) .nf-curation-card__poster::before {
  background:url('./curation-textures/haunted-doorway-v2.svg') no-repeat 88% 50%/62% 76%,url('./curation-textures/haunted-mist.svg') no-repeat right center/cover,linear-gradient(0deg,rgba(10,33,33,.33),transparent 50%);
  opacity:.62;
}
.nf-curation.nf-curation--horror .nf-curation-grid > .nf-curation-card:nth-child(5n+3) .nf-curation-card__poster::before {
  background:url('./curation-textures/haunted-scratches.svg') no-repeat center/100% 100%,url('./curation-textures/haunted-analog-scars.svg') no-repeat center/100% 100%,linear-gradient(0deg,rgba(10,33,33,.30),transparent 50%);
}
.nf-curation.nf-curation--horror .nf-curation-grid > .nf-curation-card:nth-child(5n+4) .nf-curation-card__poster::before {
  background:url('./curation-textures/haunted-wallpaper.svg') no-repeat center/cover,url('./curation-textures/haunted-mist.svg') no-repeat center/cover,linear-gradient(0deg,rgba(10,33,33,.36),transparent 50%);
}
.nf-curation.nf-curation--horror .nf-curation-grid > .nf-curation-card:nth-child(5n+5) .nf-curation-card__poster::before {
  background:url('./curation-textures/haunted-door.svg') no-repeat 88% 50%/56% 72%,url('./curation-textures/haunted-mist.svg') no-repeat center/cover,linear-gradient(0deg,rgba(10,33,33,.38),transparent 50%);
  opacity:.56;
}
.nf-curation.nf-curation--horror .nf-curation-card__index {
  border:1px solid rgba(215,231,213,.92);
  border-radius:1px 1px 8px 1px;
  background:linear-gradient(145deg,#315352,#172f31);
  color:#f2f2e5;
  box-shadow:0 3px 0 #102526,0 0 0 2px rgba(181,208,190,.09),0 7px 13px rgba(0,0,0,.42);
}

/* Future custom selections inherit a clean editorial marker, while retaining
   the option to specialize it later through their own skin class. */
.nf-curation.nf-curation--custom .nf-curation-card__index {
  border:1px solid var(--cur-accent,#b7c7f3);
  border-radius:2px 7px 2px 2px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--cur-accent,#b7c7f3) 24%,#111522),#15172a);
  color:#f4f2fa;
  box-shadow:3px 3px 0 color-mix(in srgb,var(--cur-accent,#b7c7f3) 28%,transparent);
}

@media(max-width:760px) {
  /* Staggering is a desktop art-direction choice; small screens stay tidy. */
  .nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card,
  .nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:hover,
  .nf-curation.nf-curation--japan .nf-curation-grid > .nf-curation-card:focus-within {
    transform:none;
  }
}

