/*! Notes...

    Author: Jay George
    Author URI: https://jaygeorge.co.uk

    ABOUT THIS CSS
    ===================================================
    - Only edit filename-dev.css, then process with Laravel Mix (1. Configure with `webpack.mix.js` 2. `npm run production` will compile into prod/ on the server)

*/
:root{--texture-width:17rem;--texture-height:5rem;--texture-push-from-top:10px}@media (width>=1024px){:root{--texture-push-from-top:40px}}@layer scope{@media (width<=1023px){.c-site-footer{position:relative}.c-site-footer .u-texture{display:none}.c-site-footer:after{content:"";pointer-events:none;z-index:var(--z-index-above-body);background:var(--colour-black);mix-blend-mode:color-dodge;position:absolute;inset:0}}html:not(:has(.c-page-column-layout)) .u-texture:not(.u-texture--2):after,html:not(:has(.c-page-column-layout)) .u-texture:not(.u-texture--2):not([class*=c-]) .u-hue-overlay{top:var(--texture-push-from-top)}@media (width>=1024px){html:not(:has(.c-page-column-layout)) .u-texture,html:not(:has(.c-page-column-layout)) .u-texture:before,html:not(:has(.c-page-column-layout)) .u-texture:after{position:absolute}}@media (width>=1200px) and (height<=950px){html:has(.c-page-column-layout) .c-site-footer .u-texture--2:after{content:unset}html:has(.c-page-column-layout) .c-site-footer .u-hue-overlay,html:has(.c-page-column-layout) .c-site-footer .u-hue-overlay:before{background:unset!important}}}@layer utilities{.u-texture:after{content:"";width:100%;max-width:var(--texture-width);height:var(--texture-height);background:url(/img/podcast-artwork-texture-horizontal.avif) no-repeat top left/var(--texture-width);opacity:.4;position:absolute;top:-40px}.u-texture--2:after{z-index:-1;top:unset;opacity:.25;background-image:url(/img/podcast-artwork-texture-horizontal-2.avif);bottom:0}div[class*=u-texture]:not([class*=c-]){z-index:var(--z-index-above-body);width:100%;height:var(--texture-height);max-width:var(--texture-width);position:absolute;top:0}div[class*=u-texture]:not([class*=c-]).u-texture--2:not(.u-texture--flipped){z-index:var(--z-index-nav)}div[class*=u-texture]:not([class*=c-]).u-texture--2{top:unset;bottom:0}@media (width>=1024px){div[class*=u-texture]:not([class*=c-]){position:fixed;top:0}}@media (width>=1024px){:root{--texture-width:18rem}.u-texture:after{position:fixed}.u-texture:not([class*=u-texture--]):after{top:var(--texture-push-from-top)}}@media (width<=1799px){.u-texture:after{left:0}}@media (width>=2060px){div[class*=u-texture]:not([class*=c-]).u-texture--2,div[class*=u-texture]:not([class*=c-]).u-texture--2:after{--texture-height:110px}}}@layer utilities-modifiers{.u-texture--flipped{max-width:var(--max-width-2);margin-inline:auto;left:50%;transform:scaleX(-1)translate(50%)}.u-texture--flipped:before{width:var(--texture-width);right:0}}@layer texture{@media (width>=2060px){.u-radial-mask{z-index:var(--z-index-above-nav);height:100%;position:relative}.u-radial-mask:before{content:"";background:radial-gradient(circle at left, var(--colour-black) 0%,transparent 30%);position:absolute;inset:0}.u-texture:not(.u-texture--2):has(.u-radial-mask) .u-radial-mask{top:var(--texture-push-from-top)}.u-texture--flipped:has(.u-radial-mask) .u-radial-mask{width:var(--texture-width)}}}