/**
 * Wedwebs Paper Texture - image-free paper grain for Elementor Containers.
 *
 * Each class paints a CSS-generated noise layer (inline SVG feTurbulence -
 * zero HTTP requests, resolution-independent) ON TOP of the container's own
 * background-color, blended so the grain takes on whatever colour the couple
 * chose. Pick a texture under a Container's Advanced > Paper Texture, or add
 * one class by hand in "CSS Classes":
 *
 *     ww-paper-cotton | ww-paper-handmade | ww-paper-vellum | ww-paper-linen
 *     ww-paper-laid   | ww-paper-parchment | ww-paper-kraft
 *
 * Strength is a second, optional class, because the contrast of the grain is
 * baked into the SVG and cannot be dialled from CSS:
 *
 *     ww-paper-strength-subtle | ww-paper-strength-strong
 *
 * Everything else is a custom property, so the panel controls only have to set
 * a variable on the element. Every one has a fallback here, which means the
 * classes still look right when used by hand with no variables set at all:
 *
 *     --ww-paper-scale         grain tile size, as a % of its natural size (100)
 *     --ww-paper-blend         blend mode of the grain layer (per texture)
 *     --ww-paper-weave-gap     linen: distance between threads (4px)
 *     --ww-paper-weave-alpha   linen: thread contrast, as a % (4.5)
 *     --ww-paper-weave-angle   linen: weave rotation (90deg)
 *     --ww-paper-laid-gap      laid: distance between laid lines (3px)
 *     --ww-paper-laid-alpha    laid: laid line contrast, as a % (5)
 *     --ww-paper-chain-gap     laid: distance between chain lines (26px)
 *     --ww-paper-chain-alpha   laid: chain line contrast, as a % (4)
 *     --ww-paper-laid-angle    laid: 0deg for horizontal lines, 90deg vertical
 *     --ww-paper-mottle-scale  parchment: blotch size, as a % (100)
 *     --ww-paper-fleck-scale   kraft: fleck size, as a % (100)
 *
 * Backgrounds always render behind the Container's content, and no
 * pseudo-elements are used, so this never collides with Elementor's own
 * background / overlay layers. To use a real photo texture instead, just use
 * Elementor's native Container background - these classes are the lightweight
 * alternative, not a replacement for it.
 *
 * No JavaScript. No animation.
 */

/* Shared paint behaviour. */

.ww-paper-cotton,
.ww-paper-handmade,
.ww-paper-vellum,
.ww-paper-linen,
.ww-paper-laid,
.ww-paper-parchment,
.ww-paper-kraft {
	background-repeat: repeat;
	background-position: center;
}

/*
 * COTTON - the default fine, even invitation-stock grain.
 * Fine fractal noise, desaturated, low contrast, blended soft-light so it
 * gently lightens and darkens the underlying colour like paper fibre.
 */
.ww-paper-cotton {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='c'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.35' intercept='0.32'/%3E%3CfeFuncG type='linear' slope='0.35' intercept='0.32'/%3E%3CfeFuncB type='linear' slope='0.35' intercept='0.32'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23c)'/%3E%3C/svg%3E");
	background-size: calc(var(--ww-paper-scale, 100) * 1.8px) calc(var(--ww-paper-scale, 100) * 1.8px);
	background-blend-mode: var(--ww-paper-blend, soft-light);
}

/*
 * HANDMADE - coarser, mottled cotton-rag look.
 * Lower frequency = larger fibre clumps; multiply blend deepens the grain so
 * it reads as a heavier, more organic stock.
 */
.ww-paper-handmade {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='h'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.4' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.5' intercept='0.28'/%3E%3CfeFuncG type='linear' slope='0.5' intercept='0.28'/%3E%3CfeFuncB type='linear' slope='0.5' intercept='0.28'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23h)'/%3E%3C/svg%3E");
	background-size: calc(var(--ww-paper-scale, 100) * 2.2px) calc(var(--ww-paper-scale, 100) * 2.2px);
	background-blend-mode: var(--ww-paper-blend, multiply);
}

/*
 * VELLUM - very fine, smooth, near-translucent finish.
 * High frequency + very low contrast = a whisper of grain for a polished,
 * semi-transparent vellum sheet.
 */
.ww-paper-vellum {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='v'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.3' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.18' intercept='0.41'/%3E%3CfeFuncG type='linear' slope='0.18' intercept='0.41'/%3E%3CfeFuncB type='linear' slope='0.18' intercept='0.41'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23v)'/%3E%3C/svg%3E");
	background-size: calc(var(--ww-paper-scale, 100) * 1.4px) calc(var(--ww-paper-scale, 100) * 1.4px);
	background-blend-mode: var(--ww-paper-blend, soft-light);
}

/*
 * LINEN - woven approximation.
 * A faint warp/weft grid (two repeating-linear-gradients) over fibre noise.
 * This is a CSS approximation; for a true photographic linen weave, use a
 * real seamless image via Elementor's native Container background instead.
 *
 * Layer order (top -> bottom): noise, warp threads, weft threads. The two
 * thread layers stay perpendicular: the second is the weave angle minus 90deg.
 */
.ww-paper-linen {
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='l'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.95' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.28' intercept='0.36'/%3E%3CfeFuncG type='linear' slope='0.28' intercept='0.36'/%3E%3CfeFuncB type='linear' slope='0.28' intercept='0.36'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23l)'/%3E%3C/svg%3E"),
		repeating-linear-gradient(var(--ww-paper-weave-angle, 90deg), rgb(0 0 0 / calc(var(--ww-paper-weave-alpha, 4.5) * 1%)) 0, rgb(0 0 0 / calc(var(--ww-paper-weave-alpha, 4.5) * 1%)) 1px, transparent 1px, transparent var(--ww-paper-weave-gap, 4px)),
		repeating-linear-gradient(calc(var(--ww-paper-weave-angle, 90deg) - 90deg), rgb(0 0 0 / calc(var(--ww-paper-weave-alpha, 4.5) * 1%)) 0, rgb(0 0 0 / calc(var(--ww-paper-weave-alpha, 4.5) * 1%)) 1px, transparent 1px, transparent var(--ww-paper-weave-gap, 4px));
	background-size: calc(var(--ww-paper-scale, 100) * 1.6px) calc(var(--ww-paper-scale, 100) * 1.6px), auto, auto;
	background-blend-mode: var(--ww-paper-blend, soft-light), normal, normal;
}

/*
 * LAID - classic formal/traditional stock.
 * Strongly directional fine ridge lines ("laid lines"), crossed by fainter,
 * widely-spaced perpendicular "chain lines", over a whisper of fibre. Unlike
 * linen's even grid, laid reads as one dominant direction.
 *
 * Layer order (top -> bottom): fibre noise, laid lines, chain lines.
 */
.ww-paper-laid {
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='la'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.2' intercept='0.4'/%3E%3CfeFuncG type='linear' slope='0.2' intercept='0.4'/%3E%3CfeFuncB type='linear' slope='0.2' intercept='0.4'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23la)'/%3E%3C/svg%3E"),
		repeating-linear-gradient(var(--ww-paper-laid-angle, 0deg), rgb(0 0 0 / calc(var(--ww-paper-laid-alpha, 5) * 1%)) 0, rgb(0 0 0 / calc(var(--ww-paper-laid-alpha, 5) * 1%)) 1px, transparent 1px, transparent var(--ww-paper-laid-gap, 3px)),
		repeating-linear-gradient(calc(var(--ww-paper-laid-angle, 0deg) + 90deg), rgb(0 0 0 / calc(var(--ww-paper-chain-alpha, 4) * 1%)) 0, rgb(0 0 0 / calc(var(--ww-paper-chain-alpha, 4) * 1%)) 1px, transparent 1px, transparent var(--ww-paper-chain-gap, 26px));
	background-size: calc(var(--ww-paper-scale, 100) * 1.2px) calc(var(--ww-paper-scale, 100) * 1.2px), auto, auto;
	background-blend-mode: var(--ww-paper-blend, soft-light), normal, normal;
}

/*
 * PARCHMENT - aged, cloudy mottling.
 * The one large-scale option: very low-frequency turbulence makes soft
 * light/dark blotches across the surface, with a fine grain layered on top
 * for tooth. Suits vintage / old-world themes.
 *
 * Layer order (top -> bottom): cloudy mottle, fine grain. The mottle has its
 * own scale variable so the blotches can be resized without touching the grain.
 */
.ww-paper-parchment {
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600'%3E%3Cfilter id='pa'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.012' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.7' intercept='0.2'/%3E%3CfeFuncG type='linear' slope='0.7' intercept='0.2'/%3E%3CfeFuncB type='linear' slope='0.7' intercept='0.2'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23pa)'/%3E%3C/svg%3E"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='pg'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.22' intercept='0.39'/%3E%3CfeFuncG type='linear' slope='0.22' intercept='0.39'/%3E%3CfeFuncB type='linear' slope='0.22' intercept='0.39'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23pg)'/%3E%3C/svg%3E");
	background-size: calc(var(--ww-paper-mottle-scale, 100) * 6px) calc(var(--ww-paper-mottle-scale, 100) * 6px), calc(var(--ww-paper-scale, 100) * 1.5px) calc(var(--ww-paper-scale, 100) * 1.5px);
	background-blend-mode: var(--ww-paper-blend, soft-light), var(--ww-paper-blend, soft-light);
}

/*
 * KRAFT - recycled / rustic stock.
 * A medium fibre grain with sparse darker flecks (a turbulence layer reduced
 * to occasional specks via a discrete alpha transfer), multiplied in so the
 * flecks read as bits of pulp. Best over a tan/brown container colour.
 *
 * Layer order (top -> bottom): flecks, fibre grain.
 */
.ww-paper-kraft {
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='ks'%3E%3CfeTurbulence type='turbulence' baseFrequency='0.45' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0'/%3E%3CfeComponentTransfer%3E%3CfeFuncA type='discrete' tableValues='0 0 0 0 0 0 0 0.5'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23ks)'/%3E%3C/svg%3E"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='kf'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.55' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.45' intercept='0.3'/%3E%3CfeFuncG type='linear' slope='0.45' intercept='0.3'/%3E%3CfeFuncB type='linear' slope='0.45' intercept='0.3'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23kf)'/%3E%3C/svg%3E");
	background-size: calc(var(--ww-paper-fleck-scale, 100) * 2px) calc(var(--ww-paper-fleck-scale, 100) * 2px), calc(var(--ww-paper-scale, 100) * 2px) calc(var(--ww-paper-scale, 100) * 2px);
	background-blend-mode: var(--ww-paper-blend, multiply), soft-light;
}

/*
 * Strength variants.
 *
 * The grain's contrast lives inside the SVG filter (the feComponentTransfer
 * slope), so it cannot be turned down with a variable the way spacing can:
 * each step is its own tile. Only background-image is redeclared, so the size
 * and blend mode set above still apply. Line contrast moves with it, as a
 * variable, so a subtle linen has subtle threads too.
 */

.ww-paper-strength-subtle.ww-paper-cotton {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='c'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.17' intercept='0.41'/%3E%3CfeFuncG type='linear' slope='0.17' intercept='0.41'/%3E%3CfeFuncB type='linear' slope='0.17' intercept='0.41'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23c)'/%3E%3C/svg%3E");
}

.ww-paper-strength-subtle.ww-paper-handmade {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='h'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.4' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.25' intercept='0.38'/%3E%3CfeFuncG type='linear' slope='0.25' intercept='0.38'/%3E%3CfeFuncB type='linear' slope='0.25' intercept='0.38'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23h)'/%3E%3C/svg%3E");
}

.ww-paper-strength-subtle.ww-paper-vellum {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='v'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.3' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.09' intercept='0.46'/%3E%3CfeFuncG type='linear' slope='0.09' intercept='0.46'/%3E%3CfeFuncB type='linear' slope='0.09' intercept='0.46'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23v)'/%3E%3C/svg%3E");
}

.ww-paper-strength-subtle.ww-paper-linen {
	--ww-paper-weave-alpha: 2.2;
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='l'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.95' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.14' intercept='0.43'/%3E%3CfeFuncG type='linear' slope='0.14' intercept='0.43'/%3E%3CfeFuncB type='linear' slope='0.14' intercept='0.43'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23l)'/%3E%3C/svg%3E"),
		repeating-linear-gradient(var(--ww-paper-weave-angle, 90deg), rgb(0 0 0 / calc(var(--ww-paper-weave-alpha, 4.5) * 1%)) 0, rgb(0 0 0 / calc(var(--ww-paper-weave-alpha, 4.5) * 1%)) 1px, transparent 1px, transparent var(--ww-paper-weave-gap, 4px)),
		repeating-linear-gradient(calc(var(--ww-paper-weave-angle, 90deg) - 90deg), rgb(0 0 0 / calc(var(--ww-paper-weave-alpha, 4.5) * 1%)) 0, rgb(0 0 0 / calc(var(--ww-paper-weave-alpha, 4.5) * 1%)) 1px, transparent 1px, transparent var(--ww-paper-weave-gap, 4px));
}

.ww-paper-strength-subtle.ww-paper-laid {
	--ww-paper-laid-alpha: 2.5;
	--ww-paper-chain-alpha: 2.0;
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='la'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.1' intercept='0.45'/%3E%3CfeFuncG type='linear' slope='0.1' intercept='0.45'/%3E%3CfeFuncB type='linear' slope='0.1' intercept='0.45'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23la)'/%3E%3C/svg%3E"),
		repeating-linear-gradient(var(--ww-paper-laid-angle, 0deg), rgb(0 0 0 / calc(var(--ww-paper-laid-alpha, 5) * 1%)) 0, rgb(0 0 0 / calc(var(--ww-paper-laid-alpha, 5) * 1%)) 1px, transparent 1px, transparent var(--ww-paper-laid-gap, 3px)),
		repeating-linear-gradient(calc(var(--ww-paper-laid-angle, 0deg) + 90deg), rgb(0 0 0 / calc(var(--ww-paper-chain-alpha, 4) * 1%)) 0, rgb(0 0 0 / calc(var(--ww-paper-chain-alpha, 4) * 1%)) 1px, transparent 1px, transparent var(--ww-paper-chain-gap, 26px));
}

.ww-paper-strength-subtle.ww-paper-parchment {
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600'%3E%3Cfilter id='pa'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.012' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.35' intercept='0.33'/%3E%3CfeFuncG type='linear' slope='0.35' intercept='0.33'/%3E%3CfeFuncB type='linear' slope='0.35' intercept='0.33'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23pa)'/%3E%3C/svg%3E"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='pg'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.11' intercept='0.45'/%3E%3CfeFuncG type='linear' slope='0.11' intercept='0.45'/%3E%3CfeFuncB type='linear' slope='0.11' intercept='0.45'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23pg)'/%3E%3C/svg%3E");
}

.ww-paper-strength-subtle.ww-paper-kraft {
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='ks'%3E%3CfeTurbulence type='turbulence' baseFrequency='0.45' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0'/%3E%3CfeComponentTransfer%3E%3CfeFuncA type='discrete' tableValues='0 0 0 0 0 0 0 0.28'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23ks)'/%3E%3C/svg%3E"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='kf'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.55' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.23' intercept='0.39'/%3E%3CfeFuncG type='linear' slope='0.23' intercept='0.39'/%3E%3CfeFuncB type='linear' slope='0.23' intercept='0.39'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23kf)'/%3E%3C/svg%3E");
}

.ww-paper-strength-strong.ww-paper-cotton {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='c'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.59' intercept='0.21'/%3E%3CfeFuncG type='linear' slope='0.59' intercept='0.21'/%3E%3CfeFuncB type='linear' slope='0.59' intercept='0.21'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23c)'/%3E%3C/svg%3E");
}

.ww-paper-strength-strong.ww-paper-handmade {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='h'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.4' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.85' intercept='0.08'/%3E%3CfeFuncG type='linear' slope='0.85' intercept='0.08'/%3E%3CfeFuncB type='linear' slope='0.85' intercept='0.08'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23h)'/%3E%3C/svg%3E");
}

.ww-paper-strength-strong.ww-paper-vellum {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='v'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.3' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.31' intercept='0.34'/%3E%3CfeFuncG type='linear' slope='0.31' intercept='0.34'/%3E%3CfeFuncB type='linear' slope='0.31' intercept='0.34'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23v)'/%3E%3C/svg%3E");
}

.ww-paper-strength-strong.ww-paper-linen {
	--ww-paper-weave-alpha: 7.6;
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='l'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.95' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.48' intercept='0.26'/%3E%3CfeFuncG type='linear' slope='0.48' intercept='0.26'/%3E%3CfeFuncB type='linear' slope='0.48' intercept='0.26'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23l)'/%3E%3C/svg%3E"),
		repeating-linear-gradient(var(--ww-paper-weave-angle, 90deg), rgb(0 0 0 / calc(var(--ww-paper-weave-alpha, 4.5) * 1%)) 0, rgb(0 0 0 / calc(var(--ww-paper-weave-alpha, 4.5) * 1%)) 1px, transparent 1px, transparent var(--ww-paper-weave-gap, 4px)),
		repeating-linear-gradient(calc(var(--ww-paper-weave-angle, 90deg) - 90deg), rgb(0 0 0 / calc(var(--ww-paper-weave-alpha, 4.5) * 1%)) 0, rgb(0 0 0 / calc(var(--ww-paper-weave-alpha, 4.5) * 1%)) 1px, transparent 1px, transparent var(--ww-paper-weave-gap, 4px));
}

.ww-paper-strength-strong.ww-paper-laid {
	--ww-paper-laid-alpha: 8.5;
	--ww-paper-chain-alpha: 6.8;
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='la'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.34' intercept='0.33'/%3E%3CfeFuncG type='linear' slope='0.34' intercept='0.33'/%3E%3CfeFuncB type='linear' slope='0.34' intercept='0.33'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23la)'/%3E%3C/svg%3E"),
		repeating-linear-gradient(var(--ww-paper-laid-angle, 0deg), rgb(0 0 0 / calc(var(--ww-paper-laid-alpha, 5) * 1%)) 0, rgb(0 0 0 / calc(var(--ww-paper-laid-alpha, 5) * 1%)) 1px, transparent 1px, transparent var(--ww-paper-laid-gap, 3px)),
		repeating-linear-gradient(calc(var(--ww-paper-laid-angle, 0deg) + 90deg), rgb(0 0 0 / calc(var(--ww-paper-chain-alpha, 4) * 1%)) 0, rgb(0 0 0 / calc(var(--ww-paper-chain-alpha, 4) * 1%)) 1px, transparent 1px, transparent var(--ww-paper-chain-gap, 26px));
}

.ww-paper-strength-strong.ww-paper-parchment {
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600'%3E%3Cfilter id='pa'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.012' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.95' intercept='0.03'/%3E%3CfeFuncG type='linear' slope='0.95' intercept='0.03'/%3E%3CfeFuncB type='linear' slope='0.95' intercept='0.03'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23pa)'/%3E%3C/svg%3E"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='pg'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.37' intercept='0.32'/%3E%3CfeFuncG type='linear' slope='0.37' intercept='0.32'/%3E%3CfeFuncB type='linear' slope='0.37' intercept='0.32'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23pg)'/%3E%3C/svg%3E");
}

.ww-paper-strength-strong.ww-paper-kraft {
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='ks'%3E%3CfeTurbulence type='turbulence' baseFrequency='0.45' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0'/%3E%3CfeComponentTransfer%3E%3CfeFuncA type='discrete' tableValues='0 0 0 0 0 0 0.3 0.75'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23ks)'/%3E%3C/svg%3E"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='kf'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.55' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.77' intercept='0.11'/%3E%3CfeFuncG type='linear' slope='0.77' intercept='0.11'/%3E%3CfeFuncB type='linear' slope='0.77' intercept='0.11'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23kf)'/%3E%3C/svg%3E");
}