/* Swop Packages — optional effects. Loaded only when at least one effect is on. */
@property --swpk-angle { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
.swpk { --swpk-color2: color-mix(in srgb, var(--swpk-accent) 35%, #ffb800); }

/* Entrance on scroll (JS adds .swpk-fx-ready, so content is visible without JS) */
.swpk-fx-ready .swpk-fx-item {
	opacity: 0;
	transition: opacity .7s ease, translate .7s cubic-bezier(.2, .7, .2, 1), scale .7s cubic-bezier(.2, .7, .2, 1), rotate .7s cubic-bezier(.2, .7, .2, 1), transform var(--swpk-speed), box-shadow var(--swpk-speed), border-color var(--swpk-speed);
	transition-delay: calc(var(--i, 0) * 110ms), calc(var(--i, 0) * 110ms), calc(var(--i, 0) * 110ms), calc(var(--i, 0) * 110ms), 0s, 0s, 0s;
}
.swpk-fx-ready.swpk-fx-in-rise .swpk-fx-item { translate: 0 34px; }
.swpk-fx-ready.swpk-fx-in-zoom .swpk-fx-item { scale: .9; }
.swpk-fx-ready.swpk-fx-in-flip .swpk-fx-item { rotate: x 22deg; translate: 0 24px; transform-origin: 50% 0; }
.swpk-fx-ready .swpk-fx-item.is-in { opacity: 1; translate: 0 0; scale: 1; rotate: x 0deg; }
.swpk-fx-ready.swpk-fx-draw:not([class*="swpk-fx-in-"]) .swpk-fx-item { opacity: 1; }

/* Checkmarks draw in, one by one */
.swpk-fx-draw .swpk-fx-item .swpk-list__item::before, .swpk-fx-draw .swpk-fx-item .swpk-list__item::after { scale: 0; transition: scale .35s cubic-bezier(.3, 1.6, .5, 1); }
.swpk-fx-draw .swpk-fx-item.is-in .swpk-list__item::before, .swpk-fx-draw .swpk-fx-item.is-in .swpk-list__item::after { scale: 1; }
.swpk-fx-draw .swpk-list__item:nth-child(1)::before, .swpk-fx-draw .swpk-list__item:nth-child(1)::after { transition-delay: .25s; }
.swpk-fx-draw .swpk-list__item:nth-child(2)::before, .swpk-fx-draw .swpk-list__item:nth-child(2)::after { transition-delay: .32s; }
.swpk-fx-draw .swpk-list__item:nth-child(3)::before, .swpk-fx-draw .swpk-list__item:nth-child(3)::after { transition-delay: .39s; }
.swpk-fx-draw .swpk-list__item:nth-child(4)::before, .swpk-fx-draw .swpk-list__item:nth-child(4)::after { transition-delay: .46s; }
.swpk-fx-draw .swpk-list__item:nth-child(5)::before, .swpk-fx-draw .swpk-list__item:nth-child(5)::after { transition-delay: .53s; }
.swpk-fx-draw .swpk-list__item:nth-child(6)::before, .swpk-fx-draw .swpk-list__item:nth-child(6)::after { transition-delay: .6s; }
.swpk-fx-draw .swpk-list__item:nth-child(7)::before, .swpk-fx-draw .swpk-list__item:nth-child(7)::after { transition-delay: .67s; }
.swpk-fx-draw .swpk-list__item:nth-child(n+8)::before, .swpk-fx-draw .swpk-list__item:nth-child(n+8)::after { transition-delay: .74s; }

/* 3D tilt + glare, spotlight (JS injects .swpk-fx-light) */
.swpk-fx-tilt .swpk-card { transform-style: preserve-3d; will-change: transform; }
.swpk-fx-light { position: absolute; inset: 0; z-index: 3; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .3s ease; }
.swpk-card:hover > .swpk-fx-light { opacity: 1; }
.swpk-fx-tilt .swpk-fx-light { background: radial-gradient(420px circle at var(--gx, 50%) var(--gy, 0%), rgba(255, 255, 255, .28), transparent 45%); mix-blend-mode: overlay; }
.swpk-fx-spotlight .swpk-fx-light { background: radial-gradient(380px circle at var(--gx, 50%) var(--gy, 50%), color-mix(in srgb, var(--swpk-accent) 22%, transparent), transparent 60%); mix-blend-mode: normal; }
.swpk-fx-tilt.swpk-fx-spotlight .swpk-fx-light { background: radial-gradient(380px circle at var(--gx, 50%) var(--gy, 50%), color-mix(in srgb, var(--swpk-accent) 22%, transparent), transparent 55%), radial-gradient(420px circle at var(--gx, 50%) var(--gy, 0%), rgba(255, 255, 255, .22), transparent 45%); }
.swpk-card__body, .swpk-card__media { position: relative; z-index: 1; }

/* Animated gradient border */
.swpk-fx-border-all .swpk-card::after, .swpk-fx-border-recommended .swpk-card.is-recommended::after {
	content: ""; position: absolute; inset: 0; z-index: 4; padding: 2px; border-radius: inherit; pointer-events: none;
	background: conic-gradient(from var(--swpk-angle), var(--swpk-accent), var(--swpk-color2), var(--swpk-accent));
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
	mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
	animation: swpk-spin 4s linear infinite;
}
.swpk-fx-border-recommended .swpk-card.is-recommended, .swpk-fx-border-all .swpk-card { border-color: transparent; }
.swpk .swpk-fx-border-recommended .swpk-card.is-recommended, .swpk.swpk-fx-border-recommended .swpk-card.is-recommended, .swpk.swpk-fx-border-all .swpk-card.is-recommended { box-shadow: var(--swpk-card-shadow-hover); }
.swpk.swpk-fx-border-all .swpk-card.is-recommended::after { padding: 3px; }
@keyframes swpk-spin { to { --swpk-angle: 360deg; } }

/* Light sweep over the recommended card (stays inside the card: background sweep, no overflow) */
.swpk-fx-shine .swpk-card.is-recommended .swpk-card__body::after {
	content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
	background: linear-gradient(100deg, transparent 42%, rgba(255, 255, 255, .32) 50%, transparent 58%) no-repeat;
	background-size: 300% 100%; animation: swpk-sweep 5.5s ease-in-out infinite;
}
@keyframes swpk-sweep { 0%, 60% { background-position: 120% 0; } 85%, 100% { background-position: -20% 0; } }

/* Section backgrounds */
.swpk.swpk-bg-aurora, .swpk.swpk-bg-mesh, .swpk.swpk-bg-dots, .swpk.swpk-bg-grid { position: relative; isolation: isolate; padding: clamp(16px, 3vw, 36px); border-radius: calc(var(--swpk-radius) + 8px); overflow: hidden; }
.swpk-bg-aurora::before, .swpk-bg-mesh::before, .swpk-bg-dots::before, .swpk-bg-grid::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.swpk-bg-aurora::before {
	inset: -30%;
	background: radial-gradient(35% 40% at 20% 30%, color-mix(in srgb, var(--swpk-accent) 55%, transparent), transparent 70%), radial-gradient(35% 40% at 80% 20%, color-mix(in srgb, var(--swpk-color2) 55%, transparent), transparent 70%), radial-gradient(40% 45% at 60% 85%, color-mix(in srgb, var(--swpk-accent) 35%, #3b82f6 30%), transparent 70%);
	filter: blur(40px) saturate(1.2); opacity: .55; animation: swpk-drift 22s ease-in-out infinite alternate;
}
@keyframes swpk-drift { 0% { transform: translate3d(-4%, -2%, 0) rotate(0deg); } 100% { transform: translate3d(4%, 3%, 0) rotate(8deg); } }
.swpk-bg-mesh::before { background: radial-gradient(at 10% 10%, color-mix(in srgb, var(--swpk-accent) 28%, transparent) 0, transparent 50%), radial-gradient(at 90% 0%, color-mix(in srgb, var(--swpk-color2) 30%, transparent) 0, transparent 50%), radial-gradient(at 80% 100%, color-mix(in srgb, var(--swpk-accent) 22%, transparent) 0, transparent 55%), radial-gradient(at 0% 100%, color-mix(in srgb, var(--swpk-color2) 22%, transparent) 0, transparent 50%); }
.swpk-bg-dots::before { background-image: radial-gradient(color-mix(in srgb, var(--swpk-accent) 45%, transparent) 1.2px, transparent 1.4px); background-size: 22px 22px; -webkit-mask-image: radial-gradient(ellipse at 50% 40%, #000 30%, transparent 75%); mask-image: radial-gradient(ellipse at 50% 40%, #000 30%, transparent 75%); }
.swpk-bg-grid::before { background-image: linear-gradient(color-mix(in srgb, var(--swpk-accent) 22%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--swpk-accent) 22%, transparent) 1px, transparent 1px); background-size: 40px 40px; -webkit-mask-image: radial-gradient(ellipse at 50% 30%, #000 20%, transparent 70%); mask-image: radial-gradient(ellipse at 50% 30%, #000 20%, transparent 70%); }

/* Buttons */
.swpk-btn-shine .swpk-button--primary, .swpk-btn-shine .swpk-button--request, .swpk-fx-ripple .swpk-button--primary { position: relative; overflow: hidden; isolation: isolate; }
.swpk-btn-shine .swpk-button--primary::after, .swpk-btn-shine .swpk-button--request::after {
	content: ""; position: absolute; top: 0; bottom: 0; left: -75%; width: 50%; z-index: 1; pointer-events: none;
	background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .45), transparent); transform: skewX(-20deg);
}
.swpk-btn-shine .swpk-button--primary:hover::after, .swpk-btn-shine .swpk-button--request:hover::after { left: 130%; transition: left .75s ease; }
.swpk.swpk-mode-swop.swpk-btn-gradient .swpk-button.swpk-button--primary, .swpk.swpk-mode-swop.swpk-btn-gradient .swpk-button.swpk-button--request {
	background-image: linear-gradient(120deg, var(--swpk-btn-bg), var(--swpk-color2), var(--swpk-btn-bg)); background-size: 220% 100%; background-position: 0% 0;
	transition: background-position .6s ease, transform var(--swpk-speed), box-shadow var(--swpk-speed);
}
.swpk.swpk-mode-swop.swpk-btn-gradient .swpk-button.swpk-button--primary:hover, .swpk.swpk-mode-swop.swpk-btn-gradient .swpk-button.swpk-button--request:hover { background-image: linear-gradient(120deg, var(--swpk-btn-bg), var(--swpk-color2), var(--swpk-btn-bg)); background-position: 100% 0; }
.swpk-fx-magnetic .swpk-button--primary { translate: var(--mx, 0) var(--my, 0); }
.swpk-fx-ripple-dot { position: absolute; z-index: 0; border-radius: 50%; background: currentColor; opacity: .35; transform: scale(0); animation: swpk-ripple .6s ease-out forwards; pointer-events: none; }
@keyframes swpk-ripple { to { transform: scale(4); opacity: 0; } }
.swpk-btn-pulse .swpk-card.is-recommended .swpk-button--primary, .swpk-btn-pulse.swpk-package .swpk-button--primary { animation: swpk-pulse-ring 2.6s ease-out infinite; }
@keyframes swpk-pulse-ring { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--swpk-btn-bg) 55%, transparent); } 70%, 100% { box-shadow: 0 0 0 14px transparent; } }

/* Badges */
.swpk-badge-ribbon .swpk-card .swpk-badge { top: 26px; right: -46px; width: 180px; padding: 8px 0; border-radius: 0; text-align: center; transform: rotate(45deg); box-shadow: 0 4px 12px rgba(0, 0, 0, .18); letter-spacing: .04em; }
.swpk-badge-sticker .swpk-card .swpk-badge { top: 10px; right: 10px; display: grid; place-items: center; width: 74px; height: 74px; padding: 8px; border-radius: 50%; text-align: center; line-height: 1.1; transform: rotate(-12deg); box-shadow: 0 6px 16px rgba(0, 0, 0, .2), inset 0 0 0 3px color-mix(in srgb, var(--swpk-badge-color) 35%, transparent); }
.swpk-badge-tag .swpk-card .swpk-badge { top: 18px; right: auto; left: 0; padding: 8px 18px 8px 14px; border-radius: 0 999px 999px 0; box-shadow: 0 4px 12px rgba(0, 0, 0, .15); }
.swpk-badge-shimmer .swpk-badge { overflow: hidden; isolation: isolate; }
.swpk-badge-shimmer .swpk-badge::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .5) 50%, transparent 70%); background-size: 250% 100%; animation: swpk-shimmer 2.8s linear infinite; }
.swpk-badge-shimmer .swpk-badge--inline { position: relative; }
@keyframes swpk-shimmer { from { background-position: 150% 0; } to { background-position: -100% 0; } }

/* Sliding switcher (JS injects .swpk-fx-thumb) */
.swpk-fx-slide .swpk-options__track { position: relative; isolation: isolate; }
.swpk-fx-slide .swpk-options__option { position: relative; z-index: 1; }
.swpk-fx-slide.swpk-fx-slide-ready .swpk-options__option[aria-checked="true"] { background: transparent; box-shadow: none; }
.swpk-fx-thumb { position: absolute; top: 4px; bottom: 4px; left: 0; z-index: 0; border-radius: 999px; background: var(--swpk-switch-active-bg); box-shadow: 0 6px 18px color-mix(in srgb, var(--swpk-switch-active-bg) 40%, transparent); transition: transform .45s cubic-bezier(.3, 1.3, .5, 1), width .45s cubic-bezier(.3, 1.3, .5, 1); }

/* Price count-up */
.swpk-fx-countup .swpk-price__amount.is-counting { color: var(--swpk-accent); transition: color .3s; }

/* Confetti canvas */
.swpk-confetti { position: fixed; inset: 0; z-index: 100001; pointer-events: none; }

@media (prefers-reduced-motion: reduce) {
	.swpk-fx-ready .swpk-fx-item { opacity: 1; translate: none; scale: none; rotate: none; transition: none; }
	.swpk-bg-aurora::before, .swpk-fx-border-all .swpk-card::after, .swpk-fx-border-recommended .swpk-card.is-recommended::after, .swpk-fx-shine .swpk-card.is-recommended .swpk-card__body::after, .swpk-badge-shimmer .swpk-badge::after, .swpk-btn-pulse .swpk-button--primary { animation: none; }
}