.ug-cadre {
 --ugc-height:420px;--ugc-radius:24px;--ugc-padding:24px;--ugc-duration:450ms;--ugc-identity-height:64px;
 --ugc-base:#f0ebe7;--ugc-hover:#123d7f;--ugc-name:#fff;--ugc-role:#fff;--ugc-hover-name:#fff;--ugc-hover-role:#85c3c2;--ugc-text:#fff;--ugc-shade:#08111B;--ugc-border:#e9e3de;--ugc-grid:#FFFFFF0D;
 position:relative;isolation:isolate;overflow:hidden;min-height:var(--ugc-height);border:1px solid var(--ugc-border);border-radius:var(--ugc-radius);background:var(--ugc-base);box-shadow:0 8px 28px #18243212;
}
.ug-cadre *{box-sizing:border-box}
.ug-cadre .ug-cadre__image{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center top;border-radius:0;transform:none;filter:none;image-rendering:auto}
.ug-cadre__shade{position:absolute;inset:auto 0 0;height:var(--ugc-shade-height,42%);pointer-events:none;opacity:var(--ugc-shade-opacity,.95);background:linear-gradient(0deg,var(--ugc-shade) 0%,var(--ugc-shade) var(--ugc-shade-stop-solid,8%),var(--ugc-shade-middle,#08111B80) max(var(--ugc-shade-stop-solid,8%),var(--ugc-shade-stop-middle,35%)),transparent max(var(--ugc-shade-stop-solid,8%),var(--ugc-shade-stop-middle,35%),var(--ugc-shade-stop-end,100%)))}
.ug-cadre__back{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-start;gap:var(--ugc-text-gap,24px);min-height:var(--ugc-height);padding:var(--ugc-padding);transform:translateY(max(0px,calc(100% - var(--ugc-identity-height) - 2 * var(--ugc-padding))));transition:transform var(--ugc-duration) cubic-bezier(.22,.61,.36,1)}
.ug-cadre__surface{position:absolute;z-index:-1;inset:0;pointer-events:none;background:var(--ugc-hover);opacity:0;transition:opacity var(--ugc-duration) ease;border-radius:var(--ugc-radius) var(--ugc-radius) 0 0}
.ug-cadre--grid .ug-cadre__surface:after{content:'';position:absolute;inset:0;background-image:linear-gradient(var(--ugc-grid) 1px,transparent 1px),linear-gradient(90deg,var(--ugc-grid) 1px,transparent 1px);background-size:38px 38px}
.ug-cadre__front{position:absolute;inset:auto 0 0;padding:var(--ugc-padding)}
.ug-cadre .ug-cadre__name{font-size:24px;line-height:1.2;font-weight:700;margin:0;overflow-wrap:anywhere;color:var(--ugc-name);transition:color var(--ugc-duration) ease}
.ug-cadre .ug-cadre__role{font-size:14px;line-height:1.5;font-weight:500;margin:var(--ugc-role-gap,8px) 0 0;overflow-wrap:anywhere;color:var(--ugc-role);transition:color var(--ugc-duration) ease}
.ug-cadre .ug-cadre__text{font-size:15px;line-height:1.65;font-weight:400;margin:0;color:var(--ugc-text);white-space:pre-line;overflow-wrap:anywhere;opacity:0;transition:opacity var(--ugc-duration) ease}
.ug-cadre:not(.ug-cadre--no-bg):is(:hover,:focus-within,.ug-cadre--no-image) .ug-cadre__back{transform:translateY(0)}
.ug-cadre:not(.ug-cadre--no-bg):is(:hover,:focus-within,.ug-cadre--no-image) .ug-cadre__surface,
.ug-cadre:not(.ug-cadre--no-bg):is(:hover,:focus-within,.ug-cadre--no-image) .ug-cadre__text{opacity:1}
.ug-cadre:not(.ug-cadre--no-bg):is(:hover,:focus-within,.ug-cadre--no-image) .ug-cadre__name{color:var(--ugc-hover-name)}
.ug-cadre:not(.ug-cadre--no-bg):is(:hover,:focus-within,.ug-cadre--no-image) .ug-cadre__role{color:var(--ugc-hover-role)}
.ug-cadre:focus-visible{outline:3px solid #f99036;outline-offset:3px}
@media(hover:none){
 .ug-cadre:not(.ug-cadre--no-bg) .ug-cadre__image{position:relative;display:block;height:calc(var(--ugc-height) * .62)}
 .ug-cadre:not(.ug-cadre--no-bg) .ug-cadre__back{min-height:0;transform:none}
 .ug-cadre:not(.ug-cadre--no-bg) .ug-cadre__surface,.ug-cadre:not(.ug-cadre--no-bg) .ug-cadre__text{opacity:1}
 .ug-cadre:not(.ug-cadre--no-bg) .ug-cadre__name{color:var(--ugc-hover-name)}
 .ug-cadre:not(.ug-cadre--no-bg) .ug-cadre__role{color:var(--ugc-hover-role)}
 .ug-cadre:not(.ug-cadre--no-bg){min-height:0}
}
@media(prefers-reduced-motion:reduce){.ug-cadre__back,.ug-cadre__surface,.ug-cadre .ug-cadre__name,.ug-cadre .ug-cadre__role,.ug-cadre .ug-cadre__text{transition:none}}

.ug-cadre:not(.ug-cadre--no-bg):is(:hover,:focus-within,.ug-cadre--no-image) .ug-cadre__role{margin-top:var(--ugc-hover-role-gap,var(--ugc-role-gap,8px))}
@media(hover:none){.ug-cadre:not(.ug-cadre--no-bg) .ug-cadre__role{margin-top:var(--ugc-hover-role-gap,var(--ugc-role-gap,8px))}}