.hero-diagonal{position:relative;width:100%;min-height:100vh;overflow:hidden}.hero-diagonal__container{position:relative;display:flex;width:100%;height:100vh;min-height:600px}.hero-diagonal__panel{position:relative;flex:1;display:flex;align-items:center;justify-content:center;text-decoration:none;transition:transform .6s cubic-bezier(.4,0,.2,1);overflow:hidden;will-change:transform}.hero-diagonal__panel--shop,.hero-diagonal__panel--create{width:50%}@media screen and (min-width: 769px){.hero-diagonal__panel--shop{clip-path:polygon(0 0,calc(100% - 8vw) 0,100% 100%,0 100%);margin-right:-4vw;z-index:2}.hero-diagonal__panel--create{clip-path:polygon(8vw 0,100% 0,100% 100%,0 100%);margin-left:-4vw;z-index:1}}.hero-diagonal__media{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;overflow:hidden}.hero-diagonal__bg-image{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .8s cubic-bezier(.4,0,.2,1);will-change:transform}.hero-diagonal__panel:hover .hero-diagonal__bg-image{transform:scale(1.05)}.hero-diagonal__panel:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:currentColor;z-index:2;transition:opacity .4s ease;pointer-events:none}.hero-diagonal__panel--shop:after{color:#000}.hero-diagonal__panel--create:after{color:#000}.hero-diagonal__panel:hover:after{opacity:.15!important}.hero-diagonal__content{position:relative;z-index:3;text-align:center;max-width:600px;padding:2rem;transition:transform .6s cubic-bezier(.4,0,.2,1);will-change:transform}.hero-diagonal__panel:hover .hero-diagonal__content{transform:translateY(-10px)}.hero-diagonal__headline{font-family:Playfair Display,Georgia,serif;font-weight:700;font-size:clamp(2.5rem,5vw,5rem);line-height:1.1;margin:0 0 1rem;letter-spacing:-.02em;transition:transform .6s cubic-bezier(.4,0,.2,1)}.hero-diagonal__subtext{font-family:Inter,-apple-system,BlinkMacSystemFont,Helvetica Neue,sans-serif;font-weight:300;font-size:clamp(1.125rem,2vw,1.5rem);line-height:1.6;margin:0 0 2.5rem;letter-spacing:.02em;opacity:.9}.hero-diagonal__cta{display:inline-block;font-family:Inter,-apple-system,BlinkMacSystemFont,Helvetica Neue,sans-serif;font-weight:600;font-size:clamp(1.125rem,1.5vw,1.375rem);letter-spacing:.1em;text-transform:uppercase;position:relative;padding:.75rem 0;cursor:pointer;color:#c7a24b;background:linear-gradient(135deg,#d4af37,#c7a24b,#b8941f);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-diagonal__cta:after{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:0;height:2px;background-color:#c7a24b;transition:width .5s cubic-bezier(.4,0,.2,1)}.hero-diagonal__panel:hover .hero-diagonal__cta:after{width:100%}@media screen and (min-width: 769px){.hero-diagonal__panel:hover{transform:scale(1.02);z-index:10!important}.hero-diagonal__container:has(.hero-diagonal__panel--shop:hover) .hero-diagonal__panel--create,.hero-diagonal__container:has(.hero-diagonal__panel--create:hover) .hero-diagonal__panel--shop{transform:scale(.98)}}.hero-diagonal__panel:focus{outline:3px solid #c7a24b;outline-offset:-3px}.hero-diagonal__panel:focus:not(:focus-visible){outline:none}.hero-diagonal__panel:focus-visible{outline:3px solid #c7a24b;outline-offset:-3px}@media screen and (max-width: 768px){.hero-diagonal__container{flex-direction:column;height:auto;min-height:100vh}.hero-diagonal__panel--shop,.hero-diagonal__panel--create{width:100%;min-height:50vh;clip-path:none!important;margin:0!important}.hero-diagonal__panel--shop{border-bottom:1px solid rgba(199,162,75,.3)}.hero-diagonal__content{padding:3rem 1.5rem}.hero-diagonal__headline{font-size:2rem;margin-bottom:.75rem}.hero-diagonal__subtext{font-size:1.0625rem;margin-bottom:2rem}.hero-diagonal__cta{font-size:1rem}.hero-diagonal__panel:hover,.hero-diagonal__panel:hover .hero-diagonal__content{transform:none}.hero-diagonal__cta:after{width:60%;opacity:.6}.hero-diagonal__panel:active .hero-diagonal__cta:after{width:100%;opacity:1}}.hero-diagonal__panel,.hero-diagonal__content,.hero-diagonal__bg-image{backface-visibility:hidden;-webkit-backface-visibility:hidden;perspective:1000px;-webkit-perspective:1000px}.hero-diagonal__panel{transform:translateZ(0);-webkit-transform:translateZ(0)}.hero-diagonal__media:not(:has(img)){background:linear-gradient(135deg,#0000000d,#00000005)}@media print{.hero-diagonal{min-height:auto;page-break-inside:avoid}.hero-diagonal__container{height:auto;flex-direction:column}.hero-diagonal__panel{clip-path:none!important;page-break-inside:avoid;min-height:400px}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/section-hero-diagonal-split.css.map */
