/* MoxKit image box. The picture, a shade and the text are stacked layers; designs only move and reveal them.
   Design rules stay at two classes or fewer so the Elementor style controls (two classes) win. */
/* With no width chosen, the widget fills its container: its box has no width of its own, so in a row container it would
   shrink to nothing. Inline and Custom widths still apply. */
.elementor-widget-moxkit-image-box:not(.elementor-widget__width-auto,.elementor-widget__width-initial){width:100%}
.moxkit-ibox{--moxkit-ibox-h:420px;--moxkit-ibox-pad:30px;--moxkit-ibox-zoom:1.08;--moxkit-ibox-dur:.6s;--moxkit-ibox-ease:cubic-bezier(.2,0,.3,1);--moxkit-ibox-shade:rgba(10,12,20,.78);--moxkit-ibox-tint:rgba(10,12,20,.28);--moxkit-ibox-panel:#fff;--moxkit-ibox-arrow:50px;position:relative;isolation:isolate;display:block;min-height:var(--moxkit-ibox-h);overflow:hidden;border-radius:14px;background:#1d2230;color:#fff;text-align:left;transition:transform var(--moxkit-ibox-dur) var(--moxkit-ibox-ease),box-shadow var(--moxkit-ibox-dur) ease}
.moxkit-ibox-media{position:absolute;z-index:-2;inset:0}
.moxkit-ibox .moxkit-ibox-media img{width:100%;height:100%;max-width:none;object-fit:cover;border-radius:0;transition:transform calc(var(--moxkit-ibox-dur) * 1.8) var(--moxkit-ibox-ease)}
.moxkit-ibox:is(:hover,:focus-within) .moxkit-ibox-media img{transform:scale(var(--moxkit-ibox-zoom))}
.moxkit-ibox-shade{position:absolute;z-index:-1;inset:0;background:linear-gradient(to var(--moxkit-ibox-shade-to,top),var(--moxkit-ibox-shade) 0%,transparent var(--moxkit-ibox-shade-h,62%));pointer-events:none}
.moxkit-ibox-shade::after{content:"";position:absolute;inset:0;background:var(--moxkit-ibox-tint);opacity:0;transition:opacity var(--moxkit-ibox-dur) ease}
.moxkit-ibox:is(:hover,:focus-within) .moxkit-ibox-shade::after{opacity:1}
/* Frosted glass shade: a blur layer between the picture and the text; Under the text fades it out with a mask. */
.moxkit-ibox:is(.moxkit-ibox--frost-bottom,.moxkit-ibox--frost-full) .moxkit-ibox-shade::before{content:"";position:absolute;inset:0;-webkit-backdrop-filter:blur(var(--moxkit-ibox-frost-blur,12px)) saturate(140%);backdrop-filter:blur(var(--moxkit-ibox-frost-blur,12px)) saturate(140%)}
.moxkit-ibox--frost-bottom{--moxkit-ibox-frost-mask:linear-gradient(to var(--moxkit-ibox-shade-to,top),#000 0%,#000 calc(var(--moxkit-ibox-frost-h,55%) - 18%),transparent var(--moxkit-ibox-frost-h,55%))}
.moxkit-ibox--frost-bottom.moxkit-ibox--feature{--moxkit-ibox-frost-mask:linear-gradient(to top,#000 0%,#000 calc(var(--moxkit-ibox-frost-h,55%) / 2 - 10%),transparent calc(var(--moxkit-ibox-frost-h,55%) / 2),transparent calc(100% - var(--moxkit-ibox-frost-h,55%) / 2),#000 calc(100% - var(--moxkit-ibox-frost-h,55%) / 2 + 10%))}
.moxkit-ibox--frost-bottom .moxkit-ibox-shade::before{-webkit-mask-image:var(--moxkit-ibox-frost-mask);mask-image:var(--moxkit-ibox-frost-mask)}

/* Text layer. Content position sets --moxkit-ibox-justify; the shade and frosted glass follow the text to the top (--moxkit-ibox-shade-to). */
.moxkit-ibox-content{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:var(--moxkit-ibox-justify,flex-end);padding:var(--moxkit-ibox-pt,var(--moxkit-ibox-pad)) var(--moxkit-ibox-pr,var(--moxkit-ibox-pad)) var(--moxkit-ibox-pb,var(--moxkit-ibox-pad)) var(--moxkit-ibox-pl,var(--moxkit-ibox-pad))}
.moxkit-ibox-eyebrow{margin:0 0 10px;font-size:12px;font-weight:700;line-height:1.5;letter-spacing:.16em;text-transform:uppercase;color:#fff}
.moxkit-ibox-title{margin:0;font-size:22px;font-weight:600;line-height:1.25;color:#fff}
.moxkit-ibox .moxkit-ibox-link,.moxkit-ibox .moxkit-ibox-link:is(:hover,:focus){color:inherit}
.moxkit-ibox .moxkit-ibox-link::after{content:"";position:absolute;z-index:1;inset:0}
.moxkit-ibox .moxkit-ibox-link:focus-visible{outline:none}
.moxkit-ibox:has(.moxkit-ibox-link:focus-visible){outline:3px solid var(--moxkit-accent);outline-offset:3px}
.moxkit-ibox-subtitle{margin:4px 0 0;font-size:14px;line-height:1.5;color:rgba(255,255,255,.76)}
.moxkit-ibox .moxkit-ibox-desc{margin:0;max-width:none;font-size:15px;line-height:1.6;color:rgba(255,255,255,.86)}
.moxkit-ibox-icon{display:inline-flex;align-self:var(--moxkit-ibox-self,flex-start);margin-bottom:16px;font-size:36px;line-height:1;color:#fff;transition:opacity var(--moxkit-ibox-dur) ease,transform var(--moxkit-ibox-dur) var(--moxkit-ibox-ease)}
.moxkit-ibox-icon svg{width:1em;height:1em;fill:currentColor}
.moxkit-ibox :is(.moxkit-ibox-eyebrow,.moxkit-ibox-title,.moxkit-ibox-subtitle,.moxkit-ibox-desc){transition:color .3s ease}
/* The badge sits in the corner; designs with text at the top, and a chosen Content position, put it in the flow instead. */
.moxkit-ibox-badge{position:var(--moxkit-ibox-badge-pos,absolute);z-index:2;top:22px;left:22px;align-self:var(--moxkit-ibox-self,flex-start);margin-bottom:14px;padding:4px 12px;border-radius:99px;background:var(--moxkit-accent);color:#fff;font-size:11px;font-weight:700;line-height:1.6;letter-spacing:.06em;text-transform:uppercase;pointer-events:none}
.moxkit-ibox:is(.moxkit-ibox--rise,.moxkit-ibox--swap,.moxkit-ibox--frame){--moxkit-ibox-self:center}
/* Description and button: a collapsing row (grid 0fr to 1fr) so the title slides up smoothly. */
.moxkit-ibox-more{display:grid;grid-template-rows:1fr;pointer-events:none;transition:grid-template-rows var(--moxkit-ibox-dur) var(--moxkit-ibox-ease),opacity var(--moxkit-ibox-dur) ease,transform var(--moxkit-ibox-dur) var(--moxkit-ibox-ease),clip-path var(--moxkit-ibox-dur) var(--moxkit-ibox-ease)}
.moxkit-ibox-more-inner{min-height:0;overflow:hidden}
.moxkit-ibox-more-inner>:first-child{margin-top:12px}
.moxkit-ibox .moxkit-ibox-button{position:relative;z-index:2;margin-top:16px;text-decoration:none;transition:color .2s ease,background-color .2s ease,border-color .2s ease}
/* Above the stretched title link for its own hover; it takes the pointer only once it is shown. */
.moxkit-ibox:is(:hover,:focus-within) .moxkit-ibox-button{pointer-events:auto}
.moxkit-ibox:is(.moxkit-ibox--rise,.moxkit-ibox--reveal,.moxkit-ibox--arrow,.moxkit-ibox--hover-arrow,.moxkit-ibox--feature) .moxkit-ibox-more{grid-template-rows:0fr;opacity:0}
.moxkit-ibox:is(.moxkit-ibox--rise,.moxkit-ibox--reveal,.moxkit-ibox--arrow,.moxkit-ibox--hover-arrow,.moxkit-ibox--feature):is(:hover,:focus-within) .moxkit-ibox-more{grid-template-rows:1fr;opacity:1}

/* Title on the image: a steady tint, nothing hidden. */
.moxkit-ibox--classic .moxkit-ibox-shade::after{opacity:1}

/* Icon rises on hover. */
.moxkit-ibox--rise{text-align:center}
.moxkit-ibox--rise .moxkit-ibox-icon{opacity:0;transform:translateY(16px)}
.moxkit-ibox--rise:is(:hover,:focus-within) .moxkit-ibox-icon{opacity:1;transform:none}

/* Details slide up, and Icon and round arrow: the icon sits at the top. A chosen Content position turns the auto
   margins into gaps (--moxkit-ibox-push), so the badge and icon stay with the text. */
.moxkit-ibox:is(.moxkit-ibox--reveal,.moxkit-ibox--arrow) .moxkit-ibox-icon{margin-bottom:var(--moxkit-ibox-push,auto)}
/* Badge above the icon, so they never overlap; without an icon the badge holds the top alone. */
.moxkit-ibox:is(.moxkit-ibox--reveal,.moxkit-ibox--arrow) .moxkit-ibox-badge{position:static;margin-bottom:var(--moxkit-ibox-push,auto)}
.moxkit-ibox:is(.moxkit-ibox--reveal,.moxkit-ibox--arrow) .moxkit-ibox-badge:has(+.moxkit-ibox-icon){margin-bottom:14px}
.moxkit-ibox--arrow .moxkit-ibox-content{padding-right:calc(var(--moxkit-ibox-pr,var(--moxkit-ibox-pad)) + var(--moxkit-ibox-arrow) + 12px)}
.moxkit-ibox-arrow{position:absolute;z-index:2;right:var(--moxkit-ibox-pr,var(--moxkit-ibox-pad));bottom:var(--moxkit-ibox-pb,var(--moxkit-ibox-pad));display:flex;align-items:center;justify-content:center;width:var(--moxkit-ibox-arrow);height:var(--moxkit-ibox-arrow);border-radius:50%;background:#ffd84d;color:#111827;pointer-events:none;transition:transform .5s cubic-bezier(.61,1,.88,1.5),background-color .3s ease}
.moxkit-ibox-arrow svg{width:42%;height:42%}
.moxkit-ibox--arrow:is(:hover,:focus-within) .moxkit-ibox-arrow{transform:scale(1.1) rotate(-45deg)}

/* Arrow beside the title. */
.moxkit-ibox-go{display:inline-flex;width:.85em;height:.85em;margin-left:.35em;vertical-align:-.08em;opacity:0;transform:translateX(-8px);transition:opacity .3s ease,transform var(--moxkit-ibox-dur) var(--moxkit-ibox-ease)}
.moxkit-ibox-go svg{width:100%;height:100%}
.moxkit-ibox--hover-arrow:is(:hover,:focus-within) .moxkit-ibox-go{opacity:1;transform:none}

/* Framed panel: centred title; on hover a panel grows up inside a margin and shows the description, always in
   the middle of the panel (Content position moves only the title and the text around it). */
.moxkit-ibox--frame{text-align:center}
.moxkit-ibox--frame .moxkit-ibox-content{justify-content:var(--moxkit-ibox-justify,center)}
.moxkit-ibox--frame .moxkit-ibox-eyebrow::after{content:"";display:block;width:60%;max-width:150px;height:1px;margin:12px auto 0;background:currentColor;opacity:.45}
.moxkit-ibox--frame .moxkit-ibox-more{position:absolute;z-index:2;inset:var(--moxkit-ibox-panel-inset,calc(var(--moxkit-ibox-pad) * .75));display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;background:var(--moxkit-ibox-panel);border-radius:var(--moxkit-ibox-panel-r,10px);clip-path:inset(100% 0 0 0 round var(--moxkit-ibox-panel-r,10px))}
.moxkit-ibox--frame:is(:hover,:focus-within) .moxkit-ibox-more{clip-path:inset(0 round var(--moxkit-ibox-panel-r,10px))}
.moxkit-ibox--frame .moxkit-ibox-content>:not(.moxkit-ibox-more){transition:opacity .3s ease}
.moxkit-ibox--frame:is(:hover,:focus-within) .moxkit-ibox-content>:not(.moxkit-ibox-more){opacity:0}
.moxkit-ibox--frame .moxkit-ibox-desc{color:#182230}
/* Frosted glass panel: a see-through tint over the blurred picture, with a light edge. Panel color still overrides the tint. */
.moxkit-ibox--glass{--moxkit-ibox-panel:rgba(255,255,255,.14)}
.moxkit-ibox--glass .moxkit-ibox-more{-webkit-backdrop-filter:blur(var(--moxkit-ibox-blur,14px)) saturate(160%);backdrop-filter:blur(var(--moxkit-ibox-blur,14px)) saturate(160%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.32),inset 0 1px 0 rgba(255,255,255,.45)}
.moxkit-ibox--glass .moxkit-ibox-desc{color:#fff}

/* Swap on hover: the title fades away and the description comes in at the centre (or at the Content position). */
.moxkit-ibox--swap{text-align:center;--moxkit-ibox-tint:rgba(10,12,20,.62)}
.moxkit-ibox--swap .moxkit-ibox-content>:not(.moxkit-ibox-more){transition:opacity .35s ease,transform var(--moxkit-ibox-dur) var(--moxkit-ibox-ease)}
/* The title only fades: a transform would make it the containing block of the stretched link. */
.moxkit-ibox--swap:is(:hover,:focus-within) .moxkit-ibox-content>:not(.moxkit-ibox-more){opacity:0}
.moxkit-ibox--swap:is(:hover,:focus-within) .moxkit-ibox-content>:not(.moxkit-ibox-more,.moxkit-ibox-title){transform:translateY(-14px)}
.moxkit-ibox--swap .moxkit-ibox-more{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:var(--moxkit-ibox-justify,center);padding:var(--moxkit-ibox-pt,var(--moxkit-ibox-pad)) var(--moxkit-ibox-pr,var(--moxkit-ibox-pad)) var(--moxkit-ibox-pb,var(--moxkit-ibox-pad)) var(--moxkit-ibox-pl,var(--moxkit-ibox-pad));opacity:0;transform:scale(.92)}
.moxkit-ibox--swap:is(:hover,:focus-within) .moxkit-ibox-more{opacity:1;transform:none}

/* Title on top: the icon and subtitle sit at the bottom; the description opens above them. */
.moxkit-ibox--feature .moxkit-ibox-badge{position:static}
.moxkit-ibox--feature .moxkit-ibox-eyebrow{order:0}
.moxkit-ibox--feature .moxkit-ibox-title{order:1;margin-bottom:var(--moxkit-ibox-title-push,auto)}
.moxkit-ibox--feature .moxkit-ibox-more{order:2}
.moxkit-ibox--feature .moxkit-ibox-more-inner>:last-child{margin-bottom:14px}
.moxkit-ibox--feature .moxkit-ibox-icon{order:3;margin:0 0 8px;font-size:26px}
.moxkit-ibox--feature .moxkit-ibox-subtitle{order:4;margin:0;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#fff}
.moxkit-ibox--feature .moxkit-ibox-shade{background:linear-gradient(to top,var(--moxkit-ibox-shade) 0%,transparent var(--moxkit-ibox-shade-h,45%),transparent 70%,rgba(10,12,20,.45) 100%)}

.moxkit-ibox--lifted:is(:hover,:focus-within){transform:translateY(-6px);box-shadow:0 26px 44px -20px rgba(16,24,40,.5)}

/* Touch screens have no hover: open what hover would reveal (the framed panel and swap keep their idle face). */
@media(hover:none){
.moxkit-ibox:is(.moxkit-ibox--rise,.moxkit-ibox--reveal,.moxkit-ibox--arrow,.moxkit-ibox--hover-arrow,.moxkit-ibox--feature) .moxkit-ibox-more{grid-template-rows:1fr;opacity:1}
.moxkit-ibox--rise .moxkit-ibox-icon,.moxkit-ibox--hover-arrow .moxkit-ibox-go{opacity:1;transform:none}
}
@media(prefers-reduced-motion:reduce){.moxkit-ibox,.moxkit-ibox *,.moxkit-ibox *::after{transition:none!important}
.moxkit-ibox:is(:hover,:focus-within) .moxkit-ibox-media img,.moxkit-ibox--lifted:is(:hover,:focus-within){transform:none}
}
