/* Neo Tools Promotions widget. Colours, type, sizes and spacing come from the widget's Style tab;
 * these are neutral starting values. Layouts: --deck, --side, --photo, --grid. */
.ndet-promos {
	--ndet-promo-accent: currentColor;
	--ndet-promo-bar: currentColor;
	--ndet-promo-track: rgba(127, 127, 127, 0.28);
	--ndet-promo-h: 220px;
	--ndet-promo-fade: rgba(18, 15, 16, 0.9);
	--ndet-promo-secs: 6s;
	--ndet-promo-bar-h: 4px;
	--ndet-promo-dot: 8px;
}
.ndet-promos a,
.ndet-promos a:hover,
.ndet-promos a:focus { text-decoration: none; color: inherit; }
.ndet-promos a:focus-visible { outline: 3px solid currentColor; outline-offset: 3px; }

.ndet-promos__card {
	box-sizing: border-box; overflow: hidden; border-radius: 14px; background: #fff; color: #231f20;
	transition: background-color 0.2s, border-color 0.2s, box-shadow 0.2s, transform 0.25s ease;
}
.ndet-promos__body { display: flex; flex-direction: column; gap: 6px; min-width: 0; flex: 1; }
.ndet-promos__kicker { font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; line-height: 1.2; }
.ndet-promos__title { font-size: 22px; font-weight: 500; line-height: 1.15; }
.ndet-promos__line { font-size: 15px; line-height: 1.4; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.ndet-promos__foot { margin-top: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; font-size: 14px; line-height: 1.3; }
.ndet-promos__cta { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }
.ndet-promos__arrow { flex: none; fill: none; stroke: var(--ndet-promo-accent); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; transition: transform 0.25s ease; }
.ndet-promos a:hover .ndet-promos__arrow { transform: translateX(4px); }
.ndet-promos__when { opacity: 0.8; }
.ndet-promos__days::before { content: " · "; }
.ndet-promos__empty { margin: 0; }

.ndet-promos__media { position: relative; display: block; flex: none; overflow: hidden; background: rgba(127, 127, 127, 0.15); }
.ndet-promos .ndet-promos__img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; display: block; transition: transform 0.7s ease; }
.ndet-promos a:hover .ndet-promos__img { transform: scale(1.05); }

.ndet-promos__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.ndet-promos__card[hidden] { display: none; }
.ndet-promos-lift-yes .ndet-promos a.ndet-promos__card:hover { transform: translateY(-3px); }

/* Side by side: photo on the left. */
.ndet-promos--side .ndet-promos__card { display: flex; align-items: center; gap: 18px; padding: 12px 18px 12px 12px; border: 1px solid rgba(35, 31, 32, 0.12); border-radius: 16px; }
.ndet-promos--side .ndet-promos__media { width: 104px; height: 104px; border-radius: 12px; }
.ndet-promos--side .ndet-promos__body { gap: 5px; }
.ndet-promos--side .ndet-promos__title { font-size: 21px; }

/* Photo cards: the photo fills the card. */
.ndet-promos--photo .ndet-promos__card { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 440px; border-radius: 16px; background: #2a2425; color: #f7f4ee; }
.ndet-promos--photo .ndet-promos__media { position: absolute; inset: 0; z-index: 0; background: none; border-radius: 0; }
.ndet-promos--photo .ndet-promos__card::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(0deg, var(--ndet-promo-fade) 0%, transparent 66%); }
.ndet-promos--photo .ndet-promos__kicker { position: absolute; top: 16px; left: 16px; z-index: 2; padding: 6px 10px; border-radius: 999px; background: rgba(247, 244, 238, 0.92); color: #1a1617; font-size: 11px; letter-spacing: 0.1em; }
.ndet-promos--photo .ndet-promos__body { position: relative; z-index: 2; flex: none; padding: 24px; gap: 8px; }
.ndet-promos--photo .ndet-promos__title { font-size: 28px; line-height: 1.1; }
.ndet-promos--photo .ndet-promos__foot { margin-top: 6px; font-size: 15px; }

/* Text grid: no photo, the end date on top. */
.ndet-promos--grid .ndet-promos__card { display: flex; flex-direction: column; padding: 28px; border: 1px solid rgba(35, 31, 32, 0.08); }
.ndet-promos--grid .ndet-promos__body { gap: 12px; }
.ndet-promos--grid .ndet-promos__body > .ndet-promos__when,
.ndet-promos--grid .ndet-promos__body > .ndet-promos__kicker { font-size: 13px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; opacity: 1; }
.ndet-promos--grid .ndet-promos__title { font-size: 27px; line-height: 1.12; }
.ndet-promos--grid .ndet-promos__line { -webkit-line-clamp: 4; }
.ndet-promos--grid .ndet-promos__foot { font-size: 16px; }

/* Deck: one promotion at a time. Motion: --stack (the next two peek out behind), --slide, --fade. */
.ndet-promos--deck { position: relative; }
/* A grid holding only absolute cards lays out as before; "Height from: Tallest offer" puts the cards in its one cell. */
.ndet-promos--deck .ndet-promos__stack { position: relative; display: grid; height: var(--ndet-promo-h); }
.ndet-promos--stack .ndet-promos__stack { height: calc(var(--ndet-promo-h) + 32px); }
/* Room for the cards peeking out behind. No effect on a fixed-height card (absolute, held by its bottom). */
.ndet-promos--stack .ndet-promos__card { margin-top: 32px; }
.ndet-promos--slide .ndet-promos__stack { clip-path: inset(-120px -48px -120px -48px); } /* room for the card shadow; cards waiting off to the side stay hidden */
.ndet-promos--deck .ndet-promos__card {
	position: absolute; left: 0; right: 0; bottom: 0; height: var(--ndet-promo-h);
	background: #221d1e; color: #f7f4ee; border: 1px solid rgba(247, 244, 238, 0.14); box-shadow: 0 28px 60px rgba(0, 0, 0, 0.35);
	transform-origin: center bottom;
	transition: transform 0.8s cubic-bezier(0.22, 0.8, 0.24, 1), opacity 0.8s ease, background-color 0.2s, border-color 0.2s;
}
.ndet-promos--stack .is-p0 { transform: none; opacity: 1; z-index: 3; }
.ndet-promos--stack .is-p1 { transform: translateY(-16px) scale(0.94); opacity: 0.75; z-index: 2; }
.ndet-promos--stack .is-p2 { transform: translateY(-30px) scale(0.88); opacity: 0.4; z-index: 1; }
.ndet-promos--stack .is-px { transform: translateY(-30px) scale(0.88); opacity: 0; z-index: 0; }
/* Slide: only the card leaving and the card arriving move; the rest wait out of sight. */
.ndet-promos--slide .ndet-promos__card { transform: translateX(calc(100% + 72px)); visibility: hidden; z-index: 1; transition: none; }
.ndet-promos--slide .ndet-promos__card.is-prev { transform: translateX(calc(-100% - 72px)); }
.ndet-promos--slide .ndet-promos__card.is-p0,
.ndet-promos--slide .ndet-promos__card.is-was { visibility: visible; transition: transform 0.7s cubic-bezier(0.22, 0.8, 0.24, 1), background-color 0.2s, border-color 0.2s; }
.ndet-promos--slide .ndet-promos__card.is-p0 { transform: none; z-index: 2; }
/* Fade: cross-fade in place. */
.ndet-promos--fade .ndet-promos__card { transform: none; opacity: 0; visibility: hidden; z-index: 1; transition: opacity 0.6s ease, visibility 0s linear 0.6s; }
.ndet-promos--fade .ndet-promos__card.is-p0 { opacity: 1; visibility: visible; z-index: 2; transition: opacity 0.6s ease; }
.ndet-promos__inner { height: 100%; box-sizing: border-box; display: flex; flex-direction: column; gap: 14px; padding: 16px 18px 18px; transition: opacity 0.4s ease; }
.ndet-promos--stack .is-p1 .ndet-promos__inner,
.ndet-promos--stack .is-p2 .ndet-promos__inner,
.ndet-promos--stack .is-px .ndet-promos__inner { opacity: 0; }
.ndet-promos--nav-bottom .ndet-promos__top { margin-top: auto; }
.ndet-promos__top { display: flex; align-items: center; gap: 12px; }
.ndet-promos__segs { flex: 1; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 6px; }
.ndet-promos__segs[hidden] { display: block; visibility: hidden; }
.ndet-promos__seg { display: block; height: var(--ndet-promo-bar-h); border-radius: 999px; background: var(--ndet-promo-track); overflow: hidden; }
.ndet-promos__seg i { display: block; height: 100%; width: 0; border-radius: 999px; background: var(--ndet-promo-bar); }
.ndet-promos__seg.is-done i { width: 100%; }
.ndet-promos__seg.is-cur i { width: 100%; transition: width var(--ndet-promo-secs) linear; }
.ndet-promos--deck[data-auto="0"] .ndet-promos__seg.is-cur i { transition: none; }
/* Timer: dots (the current one stretches into a small bar that fills). */
.ndet-promos--timer-dots .ndet-promos__segs { display: flex; align-items: center; gap: calc(var(--ndet-promo-dot) * 0.75); }
.ndet-promos--timer-dots .ndet-promos__seg { flex: none; width: var(--ndet-promo-dot); height: var(--ndet-promo-dot); transition: width 0.3s ease; }
.ndet-promos--timer-dots .ndet-promos__seg.is-on { width: calc(var(--ndet-promo-dot) * 3.5); }
.ndet-promos--timer-dots .ndet-promos__seg:not(.is-on) i { width: 0; transition: none; }
.ndet-promos--timer-dots[data-auto="0"] .ndet-promos__seg.is-on i { width: 100%; }
/* Timer: count. */
.ndet-promos__count { flex: 1; font-size: 14px; font-weight: 600; letter-spacing: 0.06em; font-variant-numeric: tabular-nums; opacity: 0.8; }
/* Timer: one line along the bottom edge of the card. */
.ndet-promos__timer { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; height: var(--ndet-promo-bar-h); background: var(--ndet-promo-track); pointer-events: none; }
.ndet-promos__timer i { display: block; height: 100%; width: 0; background: var(--ndet-promo-bar); }
.ndet-promos__card.is-run .ndet-promos__timer i { width: 100%; transition: width var(--ndet-promo-secs) linear; }
.ndet-promos__card.is-hold .ndet-promos__timer i { width: 100%; }
.ndet-promos--deck[data-auto="0"] .ndet-promos__timer { display: none; }
.ndet-promos .ndet-promos__nav[type="button"],
.ndet-promos .ndet-promos__nav[type="button"]:focus {
	flex: none; width: 32px; height: 32px; min-height: 0; padding: 0; margin: 0; border-radius: 999px;
	border: 1px solid rgba(127, 127, 127, 0.45); background: transparent; color: inherit; box-shadow: none; line-height: 0;
	display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
}
.ndet-promos .ndet-promos__nav[type="button"]:hover { background: rgba(127, 127, 127, 0.18); color: inherit; }
.ndet-promos__nav svg { fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.ndet-promos__link { flex: 1; min-height: 0; display: flex; gap: 18px; }
.ndet-promos--deck .ndet-promos__media { width: 132px; height: auto; border-radius: 8px; }
.ndet-promos--deck .ndet-promos__img { transition: transform 6s ease; }
.ndet-promos--deck .is-p0 .ndet-promos__img { transform: scale(1.07); }
.ndet-promos--deck a:hover .ndet-promos__img { transform: scale(1.07); }
.ndet-promos__shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(18, 15, 16, 0) 52%, rgba(18, 15, 16, 0.72) 100%); }
.ndet-promos__frame { position: absolute; inset: 6px; border: 1px solid rgba(247, 244, 238, 0.45); border-radius: 4px; }
.ndet-promos__product { position: absolute; left: 13px; right: 10px; bottom: 12px; font-size: 10.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1.2; color: #f7f4ee; }
.ndet-promos--deck .ndet-promos__title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }

@media (max-width: 767px) {
	.ndet-promos--deck .ndet-promos__media { width: 100px; }
	.ndet-promos--deck .ndet-promos__link { gap: 14px; }
	.ndet-promos.ndet-promos--deck .ndet-promos__nav[type="button"] { width: 40px; height: 40px; }
}

@media (prefers-reduced-motion: reduce) {
	.ndet-promos--deck .ndet-promos__card,
	.ndet-promos--slide .ndet-promos__card.is-p0,
	.ndet-promos--slide .ndet-promos__card.is-was { transition: opacity 0.3s; }
	.ndet-promos__seg.is-cur i,
	.ndet-promos__card.is-run .ndet-promos__timer i { transition: none; }
	.ndet-promos__img,
	.ndet-promos--deck .is-p0 .ndet-promos__img,
	.ndet-promos a:hover .ndet-promos__img { transition: none; transform: none; }
	.ndet-promos__arrow { transition: none; }
	.ndet-promos-lift-yes .ndet-promos a.ndet-promos__card:hover { transform: none; }
}

/* Countdown: tiles counting to the soonest end. */
.ndet-promos--countdown { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.ndet-promos--countdown[hidden] { display: none; }
.ndet-promos__cd-label, .ndet-promos__cd-when { margin: 0; }
.ndet-promos__cd-label { font-size: 14px; font-weight: 600; letter-spacing: 0.04em; }
.ndet-promos__cd-when { font-size: 14px; opacity: 0.85; }
.ndet-promos__cd-tiles { display: flex; flex-wrap: wrap; gap: 8px; }
/* With "Tiles Fill the Width" the row stretches and --ndet-cd-grow lets the tiles share it. */
.ndet-promos__cd-tile { flex: var(--ndet-cd-grow, 0) 1 var(--ndet-cd-basis, auto); }
.ndet-promos__cd-tile { display: flex; flex-direction: column; align-items: center; min-width: 64px; padding: 10px 8px; border-radius: 12px; background: rgba(127, 127, 127, 0.14); box-sizing: border-box; }
.ndet-promos__cd-num { font-size: 30px; font-weight: 600; line-height: 1.1; font-variant-numeric: tabular-nums; }
.ndet-promos__cd-unit { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; opacity: 0.8; }

/* Ticker: offer names sliding past in a band. */
.ndet-promos--ticker { --ndet-tk-gap: 24px; overflow: hidden; }
.ndet-promos--ticker[hidden] { display: none; }
.ndet-promos__tk-track { display: flex; width: max-content; }
.ndet-promos__tk-set { display: flex; flex: none; align-items: center; }
.ndet-promos__tk-item { display: inline-flex; align-items: center; flex: none; white-space: nowrap; }
.ndet-promos__tk-item[hidden] { display: none; }
.ndet-promos__tk-sep { padding: 0 var(--ndet-tk-gap); }
.ndet-promos__tk-set:not(.is-copy) .ndet-promos__tk-item:first-child { padding-left: 0; }
.ndet-promos__tk-name { font-size: 15px; font-weight: 600; }
.ndet-promos--ticker.is-moving .ndet-promos__tk-track { animation: ndet-promos-tk var(--ndet-tk-secs, 30s) linear infinite; }
.ndet-promos--ticker.is-moving:hover .ndet-promos__tk-track,
.ndet-promos--ticker.is-moving:focus-within .ndet-promos__tk-track { animation-play-state: paused; }
@keyframes ndet-promos-tk { to { transform: translateX(var(--ndet-tk-shift, -50%)); } }
/* Reduced motion, or before the script: one set, still, wrapping. */
.ndet-promos--ticker:not(.is-moving) .ndet-promos__tk-track { width: auto; }
.ndet-promos--ticker:not(.is-moving) .ndet-promos__tk-set { flex-wrap: wrap; row-gap: 6px; }
