/* MG: Desktop and base styles for Dean Textiles. Sizes are vw from a 1920 mockup width. */

/* MG: Base */
html{scroll-behavior:smooth}
body{-webkit-font-smoothing:antialiased;background:var(--mg-ground)}
a,a:hover,a:active{color:inherit}
:focus-visible{outline:2px solid var(--mg-madder);outline-offset:3px}
h1,h2,h3,h4{text-wrap:balance}
.elementor em{font-style:italic}
[class*="mg-btn"] span,.mg-link span,.mg-menu-cta span{font-family:var(--mg-font-mono)}
@media (prefers-reduced-motion:reduce){
	html{scroll-behavior:auto}
	*{animation:none!important;transition:none!important}
}

/* MG: Header */
:is(header,div):has(> .mg-header){position:sticky;top:var(--wp-admin--admin-bar--height,0px);z-index:40}
.mg-logo img{display:block;width:100%;height:auto}
.mg-nav .elementor-nav-menu--main .elementor-item{border-bottom:1px solid transparent}
.mg-nav .elementor-nav-menu--main .elementor-item.elementor-item-active,
.mg-nav .elementor-nav-menu--main .current-menu-parent > .elementor-item,
.mg-nav .elementor-nav-menu--main .current-menu-ancestor > .elementor-item{color:var(--mg-ink);border-bottom-color:var(--mg-madder)}
.mg-nav .elementor-nav-menu--main .mg-menu-cta{display:none}

/* MG: Atomic button reset (Hello theme button styles) */
.elementor :where(button.e-button-base){font:inherit;letter-spacing:inherit;text-transform:inherit;white-space:normal;border:0;border-radius:0;transition:none}
.elementor :where(button.e-button-base):hover,.elementor :where(button.e-button-base):focus{background-color:transparent;color:inherit}

/* MG: Footer */
.mg-foot-line em{color:var(--mg-madder)}
.mg-foot-copy span{font-family:var(--mg-font-mono);font-size:0.521vw;letter-spacing:.12em;text-transform:uppercase;color:var(--mg-muted)}
.mg-foot-val:hover,.mg-foot-link:hover{text-underline-offset:5px;text-decoration-thickness:1px}
.mg-foot-mark.mg-woven{color:transparent;-webkit-background-clip:text;background-clip:text;background-repeat:repeat}

/* MG: Shared */
:root{--mg-ease:cubic-bezier(.2,0,0,1)}
.mg-statement em{color:var(--mg-madder)}

/* MG: Image frames. A woven or knitted canvas shows until a photo is set in Elementor. */
.mg-media canvas.mg-cloth{position:absolute;inset:0;width:100%;height:100%;display:block}
.mg-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,20,30,0) 45%,rgba(15,20,30,.28));pointer-events:none}
.mg-media.mg-tone::after{background:linear-gradient(180deg,rgba(15,20,30,.18),rgba(15,20,30,.62))}
.mg-media[data-mg-slot]::before{content:attr(data-mg-slot);position:absolute;top:auto;right:auto;width:auto;height:auto;left:0.729vw;bottom:0.625vw;z-index:2;font-family:var(--mg-font-mono);font-size:0.547vw;line-height:1.65;letter-spacing:.1em;text-transform:uppercase;color:rgba(241,236,225,.82);pointer-events:none}
.mg-media img[src*="placeholder"]{display:none}
.mg-media.mg-has-img::before,.mg-media.mg-has-img canvas.mg-cloth{display:none}
.mg-fabric-name[hidden],.mg-hidden{display:none}

/* MG: Loom hero (home weave, knitwear knit) */
body.admin-bar .mg-loom-stage,body.admin-bar .mg-rail-stage{top:calc(4.375vw + var(--wp-admin--admin-bar--height,0px));height:calc(100svh - 4.375vw - var(--wp-admin--admin-bar--height,0px))}
.mg-loom-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1}
.mg-loom-scrim{position:absolute;inset:0;z-index:2;background:linear-gradient(90deg,rgba(12,16,26,.66),rgba(12,16,26,.18) 62%,rgba(12,16,26,0));opacity:0;transition:opacity .7s var(--mg-ease);pointer-events:none}
.mg-loom-hud{position:absolute;z-index:3;left:0;top:0;font-family:var(--mg-font-mono);font-size:0.547vw;line-height:1.65;letter-spacing:.12em;text-transform:uppercase;color:var(--mg-ink);opacity:.82;pointer-events:none;white-space:nowrap;transition:opacity .4s,color .6s;background:color-mix(in srgb,var(--mg-band) 82%,transparent);padding:0.208vw 0.365vw}
.mg-loom-copy .mg-eyebrow{color:inherit;opacity:.7}
.mg-loom-title em{color:var(--mg-madder);transition:color .6s var(--mg-ease)}
.mg-loom-stages > *{opacity:.38;transition:opacity .4s var(--mg-ease);display:flex;align-items:center;gap:0.417vw}
.mg-loom-stages > *::before{content:"";width:0.313vw;height:0.313vw;border-radius:50%;border:1px solid currentColor}
.mg-loom-stages > .mg-on{opacity:1}
.mg-loom-stages > .mg-on::before{background:var(--mg-madder);border-color:var(--mg-madder);box-shadow:0 0 0.521vw var(--mg-madder)}
.mg-loom-stage.mg-on-image .mg-loom-hud{opacity:0!important}
.mg-loom-stage.mg-on-image .mg-loom-copy{color:var(--mg-light)}
.mg-loom-stage.mg-on-image .mg-loom-title em{color:var(--mg-accent-soft)}
.mg-loom-stage.mg-on-image .mg-loom-scrim{opacity:1}

/* MG: Statement that inks in */
.mg-words .mg-w{color:var(--mg-rule-strong);transition:color .5s var(--mg-ease)}
.mg-words .mg-w.mg-on{color:var(--mg-ink)}
.mg-words em .mg-w.mg-on{color:var(--mg-madder)}

/* MG: Division cards, thread and opening banner */
.mg-division .mg-media canvas,.mg-division .mg-media img{transform:translateY(var(--mg-py,0%)) scale(1.14)}
.mg-division:hover h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:0.417vw}
.mg-div-thread{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:3}
.mg-div-thread polyline{fill:none;stroke:var(--mg-madder);stroke-width:1.6;stroke-dasharray:7 6;stroke-linecap:round}
.mg-div-thread circle{fill:var(--mg-madder);filter:drop-shadow(0 0 6px var(--mg-madder))}
.mg-expand{will-change:clip-path}

/* MG: Product rail and product cards */
.mg-rail-bar-fill{width:var(--mg-rp,0%)}
.mg-rail-track > *{flex:0 0 min(21.875vw,calc((100svh - 21.042vw) * .75))}
.mg-rail.mg-native .mg-rail-stage{position:static;height:auto;min-height:0;padding-block:7.292vw}
.mg-rail.mg-native .mg-rail-track{overflow-x:auto;scroll-snap-type:x mandatory;transform:none!important;padding-bottom:0.625vw}
.mg-rail.mg-native .mg-rail-track > *{scroll-snap-align:start}
.mg-code .mg-fabric-name::before{content:" · ";white-space:pre}
.mg-pcard .mg-media{transform:skewY(var(--mg-skew,0deg));transform-origin:center;transition:transform .9s var(--mg-ease)}
.mg-pcard:hover .mg-media img,.mg-pcard:hover .mg-media canvas{transform:scale(1.025);transition:transform 1.2s var(--mg-ease)}
a.mg-card:hover h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:0.313vw}

/* MG: Tarrit */
.mg-tarrit .mg-media{background-color:var(--mg-t-media)}

/* MG: Stitch rail and thread cursor */
.mg-stitch-rail{position:fixed;top:0;bottom:0;left:calc(2.708vw - 1px);width:2px;pointer-events:none;z-index:1}
.mg-stitch-rail i{position:absolute;inset:0;background:repeating-linear-gradient(to bottom,var(--mg-rule-strong) 0 6px,transparent 6px 12px);opacity:.45}
.mg-stitch-rail b{position:absolute;inset:0;background:repeating-linear-gradient(to bottom,var(--mg-madder) 0 6px,transparent 6px 12px);clip-path:inset(0 0 calc(100% - var(--mg-p,0%)) 0)}
.mg-thread-cursor{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:80}

@media (prefers-reduced-motion:reduce){
	.mg-loom{height:auto!important}
	.mg-loom-stage{position:relative!important;top:0!important;height:min(88svh,42.708vw)!important}
	.mg-words .mg-w{color:inherit}
	.mg-pcard .mg-media{transform:none}
}

/* MG: Tarrit image unbuttons */
.mg-placket{position:absolute;left:50%;top:5%;bottom:5%;width:0;display:flex;flex-direction:column;justify-content:space-between;align-items:center;pointer-events:none;z-index:4}
.mg-placket::before{content:"";position:absolute;top:-5%;bottom:-5%;left:0;border-left:1px solid var(--mg-t-line)}
.mg-placket i{width:0.833vw;height:0.833vw;flex:none;box-shadow:0 1px 3px rgba(0,0,0,.25);border-radius:50%;background:var(--mg-t-bg);border:1.5px solid var(--mg-t-accent);transform:translateX(calc(var(--mg-sp,0px) * -1));position:relative}
.mg-placket i::after{content:"";position:absolute;inset:0.156vw;border-radius:50%;background:radial-gradient(circle,var(--mg-t-accent) 0 1px,transparent 1.5px) 0 0/3px 3px}