
/* ==========================================================
   Jysk Naturkød: "Vis flere varer" (produktarkiver)
   ========================================================== */
.jn-mere { display: flex; flex-direction: column; align-items: center; gap: 1.4rem; width: 100%; margin-top: var(--brxw-space-m); padding-top: var(--brxw-space-m); text-align: center; }
.jn-mere.is-tom { display: none; }
.jn-mere__antal { font-size: 1.4rem; letter-spacing: 0.04em; color: var(--color-pelsbrun); }
.jn-mere__note { position: relative; max-width: 34ch; margin: 0; padding-bottom: 3.4rem; font-family: "Mynerve", "Schibsted Grotesk", sans-serif; font-size: 1.9rem; line-height: 1.35; color: var(--brxw-color-neutral-950); opacity: 1; transform: translateY(0); transition: opacity 0.35s ease-in-out, transform 0.35s ease-in-out; }
.jn-mere__note::after { content: ""; position: absolute; left: 50%; bottom: 0.2rem; width: 3.6rem; height: 3rem; transform: translateX(-10%); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 40' fill='none' stroke='%237E4F25' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 4c10 2 18 9 19 18 1 6-1 10-3 14'/%3E%3Cpath d='M14 29c3 2 6 5 8 8 3-4 6-7 10-9'/%3E%3C/svg%3E") center / contain no-repeat; }
.jn-mere__note.is-skifter { opacity: 0; transform: translateY(0.4rem); }
.jn-mere.is-slut .jn-mere__note { padding-bottom: 0; }
.jn-mere.is-slut .jn-mere__note::after { display: none; }
.jn-mere__knap { padding: 1.3rem 2.8rem 1.2rem !important; border: 0 !important; border-radius: 0 !important; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 56' preserveAspectRatio='none'%3E%3Cpath d='M5 9C40 4 120 6 195 5C197 20 196 38 194 51C140 53 60 50 6 52C3 38 5 22 5 9Z' fill='%23005327' stroke='%23002d15' stroke-width='1.8' stroke-linejoin='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center / 100% 100% no-repeat !important; color: var(--brxw-color-white) !important; font-weight: 700; cursor: pointer; transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out; }
.jn-mere__knap:hover { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 56' preserveAspectRatio='none'%3E%3Cpath d='M5 9C40 4 120 6 195 5C197 20 196 38 194 51C140 53 60 50 6 52C3 38 5 22 5 9Z' fill='%23003f1d' stroke='%23002d15' stroke-width='1.8' stroke-linejoin='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") !important; transform: translateY(-1px); }
.jn-mere__knap:focus-visible { outline: 2px solid var(--brxw-color-primary); outline-offset: 3px; }
.jn-mere.is-henter .jn-mere__knap { opacity: 0.75; pointer-events: none; }
.jn-mere__knap.brx-load-more-hidden { display: none !important; }
.jn-mere__videre { display: none !important; font-weight: 700; color: var(--brxw-color-primary); text-decoration: underline; text-decoration-style: wavy; text-underline-offset: 0.35em; text-decoration-thickness: 1px; }
.jn-mere.is-slut .jn-mere__videre { display: inline-block !important; }
@media (prefers-reduced-motion: reduce) { .jn-mere__note, .jn-mere__knap { transition: none; } }

/* Kortvifte i slut-tilstanden ([jn_mere_fan]) */
.jn-fan { display: none; position: relative; width: 100%; height: 26rem; margin: 0 auto 0.4rem; }
.jn-mere.is-slut .jn-fan { display: block; }
.jn-fan__kort { position: absolute; left: 50%; bottom: var(--bund, 0px); z-index: var(--z, 1); width: var(--cw, 16rem); margin-left: calc(var(--cw, 16rem) / -2); color: inherit; text-decoration: none; opacity: 0; transform-origin: 50% 120%; transform: translate(var(--x0, 0px), var(--y0, 300px)) rotate(var(--r0, 0deg)); transition: transform 1.1s cubic-bezier(.45, 0, .25, 1) var(--d, 0s), opacity 0.9s ease-in-out var(--d, 0s); }
.jn-fan__kort.is-skjult { display: none; }
.jn-fan.is-inde .jn-fan__kort { opacity: 1; transform: translate(var(--x, 0px), var(--y, 0px)) rotate(var(--r, 0deg)); }
.jn-fan.is-hviler .jn-fan__kort { transition: none; will-change: auto; }
.jn-fan__kort::before { content: ""; position: absolute; left: 12%; right: 12%; bottom: -1.6rem; z-index: -1; height: 2.6rem; border-radius: 50%; background: rgba(20, 21, 21, 0.3); filter: blur(12px); opacity: 0; transform: scale(0.75); transition: opacity 0.45s ease-in-out, transform 0.45s ease-in-out; }
.jn-fan__inner { position: relative; font-family: "Schibsted Grotesk", sans-serif; display: flex; flex-direction: column; padding: 0 0 1.3rem; top: 0; text-align: left; background: #FFFDF9; transition: top 0.45s ease-in-out; }
.jn-fan__inner::after { content: ""; position: absolute; inset: -2px; pointer-events: none; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 160' preserveAspectRatio='none'%3E%3Cpath d='M2 3C40 1 80 3 118 2C119 55 118 110 117 158C80 159 40 157 3 158C1 110 3 55 2 3Z' fill='none' stroke='%23C9AE93' stroke-width='1.4' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
.jn-fan__kort:hover, .jn-fan__kort:focus-visible { z-index: 20; }
.jn-fan__kort:hover .jn-fan__inner, .jn-fan__kort:focus-visible .jn-fan__inner { top: -0.9rem; }
.jn-fan__kort:hover::before, .jn-fan__kort:focus-visible::before { opacity: 1; transform: scale(1); }
.jn-fan__kort:focus-visible { outline: none; }
.jn-fan__kort:focus-visible .jn-fan__inner { outline: 2px solid var(--brxw-color-primary); outline-offset: 3px; }
.jn-fan__img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; background: #3a2a1f; }
.jn-fan__kicker { margin: 0.8rem 0 0.2rem; font-size: 1rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-pelsbrun); }
.jn-fan__titel { padding: 1rem 1.2rem 0; font-family: "Newsreader", Georgia, serif; font-size: 1.7rem; font-weight: 500; line-height: 1.1; color: var(--brxw-color-primary); }
.jn-fan__pris { margin-top: 0.5rem; padding: 0 1.2rem; font-size: 1.3rem; color: var(--brxw-color-neutral-950); }
@media (prefers-reduced-motion: reduce) { .jn-fan__kort, .jn-fan__inner, .jn-fan__kort::before { transition: none; } }
@media (max-width: 640px) { .jn-fan__titel { font-size: 1.45rem; } .jn-fan__kicker { font-size: 0.9rem; letter-spacing: 0.1em; } .jn-fan__inner { padding: 0 0 1rem; } .jn-fan__titel { padding: 0.8rem 0.9rem 0; } .jn-fan__pris { padding: 0 0.9rem; } }
.brxe-section:has(.jn-mere) { overflow-x: clip; overflow-anchor: none; }
.jn-mere { scroll-margin-top: 9rem; }
html:has(.jn-mere), body:has(.jn-mere) { overflow-anchor: none; }
