/* Locally hosted Poppins. These declarations do not affect theme typography. */
@font-face{font-family:"SSOR Poppins";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/poppins-400.woff2") format("woff2")}
@font-face{font-family:"SSOR Poppins";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/poppins-500.woff2") format("woff2")}
@font-face{font-family:"SSOR Poppins";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/poppins-600.woff2") format("woff2")}
@font-face{font-family:"SSOR Poppins";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/poppins-700.woff2") format("woff2")}

.ss-or,
.ss-or-dialog {
    --ss-or-accent: var(--e-global-color-primary, #1ba3b2);
    --ss-or-heading: var(--e-global-color-secondary, #162f33);
    --ss-or-text: var(--e-global-color-text, #43565a);
    --ss-or-action: #116b76;
    font-family: "SSOR Poppins", "Poppins", sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.75;
    color: var(--ss-or-text);
    text-align: start;
    -webkit-font-smoothing: antialiased;
}
@supports (color: color-mix(in srgb, black, white)) {
    .ss-or, .ss-or-dialog {--ss-or-action: color-mix(in srgb, var(--ss-or-accent) 67%, #000);}
}
.ss-or, .ss-or *, .ss-or-dialog, .ss-or-dialog * {box-sizing: border-box;}
.ss-or {width: 100%; min-width: 0; container-type: inline-size;}
/* No section or card background is assigned. Elementor controls the section. */
.ss-or .ss-or-intro {margin: 0 0 36px; text-align: center;}
.ss-or .ss-or-heading {margin: 0 0 10px; color: var(--ss-or-heading); font: 600 clamp(25px, 2.5vw, 38px)/1.25 "SSOR Poppins", "Poppins", sans-serif; letter-spacing: -.025em; text-wrap: balance;}
.ss-or .ss-or-subheading {margin: 0; font: inherit; font-size: 17px; color: var(--ss-or-text);}
.ss-or .ss-or-grid {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; align-items: stretch;}
.ss-or .ss-or-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 330px;
    margin: 0;
    padding: 24px 21px 22px;
    border: 1.5px solid var(--ss-or-accent);
    border-radius: 22px;
    transition: transform .2s ease, box-shadow .2s ease;
}
.ss-or .ss-or-person, .ss-or-dialog .ss-or-person {display: flex; align-items: center; gap: 14px; min-width: 0;}
.ss-or .ss-or-person__info, .ss-or-dialog .ss-or-person__info {min-width: 0; overflow-wrap: anywhere;}
.ss-or .ss-or-portrait, .ss-or-dialog .ss-or-portrait {
    display: block;
    flex: 0 0 62px;
    width: 62px;
    height: 76px;
    max-width: none;
    margin: 0;
    border: 0;
    border-radius: 16px;
    object-fit: cover;
    object-position: center;
    box-shadow: none;
}
.ss-or .ss-or-portrait--initials, .ss-or-dialog .ss-or-portrait--initials {display: flex; align-items: center; justify-content: center; border: 1px solid var(--ss-or-accent); color: var(--ss-or-action); font-size: 23px; font-weight: 600; text-transform: uppercase;}
.ss-or .ss-or-name, .ss-or-dialog .ss-or-name {margin: 0 0 4px; color: var(--ss-or-heading); font: 600 19px/1.3 "SSOR Poppins", "Poppins", sans-serif; letter-spacing: -.025em;}
.ss-or .ss-or-role, .ss-or-dialog .ss-or-role {margin: 0; color: var(--ss-or-text); font: 400 12px/1.55 "SSOR Poppins", "Poppins", sans-serif;}
.ss-or .ss-or-company, .ss-or-dialog .ss-or-company {margin: 3px 0 0; color: var(--ss-or-action); font: 500 12px/1.5 "SSOR Poppins", "Poppins", sans-serif;}
.ss-or .ss-or-excerpt {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    overflow: hidden;
    overflow-wrap: anywhere;
    margin: 23px 0 24px;
    color: var(--ss-or-text);
    font: 400 14px/1.8 "SSOR Poppins", "Poppins", sans-serif;
}
.ss-or .ss-or-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 42px;
    width: auto;
    margin: 0;
    padding: 9px 19px;
    border: 1.5px solid var(--ss-or-accent);
    border-radius: 999px;
    background: transparent;
    background-image: none;
    color: var(--ss-or-action);
    font: 500 13px/1.4 "SSOR Poppins", "Poppins", sans-serif;
    text-transform: none;
    letter-spacing: 0;
    text-decoration: none;
    white-space: normal;
    cursor: pointer;
    box-shadow: none;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}
.ss-or .ss-or-button::before, .ss-or .ss-or-button::after, .ss-or-dialog .ss-or-dialog__close::before, .ss-or-dialog .ss-or-dialog__close::after {content: none;}
.ss-or .ss-or-button svg {display: block; flex: 0 0 18px; width: 18px; height: 18px;}
.ss-or .ss-or-button--read {align-self: center; margin-top: auto;}
.ss-or .ss-or-button--load {min-height: 48px; padding: 12px 27px; background-color: var(--ss-or-action); border-color: var(--ss-or-action); color: #fff; font-size: 15px; font-weight: 600;}
.ss-or .ss-or-button:hover {background-color: var(--ss-or-action); border-color: var(--ss-or-action); color: #fff;}
.ss-or .ss-or-button--load:hover {filter: brightness(.9);}
.ss-or .ss-or-button:disabled {opacity: .65; cursor: wait; transform: none;}
.ss-or .ss-or-button:focus-visible, .ss-or-dialog button:focus-visible, .ss-or-dialog a:focus-visible {outline: 3px solid var(--ss-or-action); outline-offset: 4px;}
.ss-or [hidden] {display: none !important;}
.ss-or .ss-or-footer {display: flex; flex-direction: column; align-items: center; gap: 12px; margin-top: 30px;}
.ss-or .ss-or-footer:has(> button[hidden]):has(> .ss-or-status:empty) {display: none;}
.ss-or .ss-or-status {margin: 0; text-align: center; font: 400 12px/1.5 "SSOR Poppins", "Poppins", sans-serif;}
.ss-or .ss-or-status:empty {display: none;}
.ss-or .ss-or-status--error {color: #a12626;}

/* The popup needs an opaque reading surface. The containing section stays untouched. */
dialog.ss-or-dialog {
    position: fixed;
    inset: 0;
    width: min(720px, calc(100% - 32px));
    max-width: 720px;
    max-height: calc(100vh - 48px);
    max-height: calc(100dvh - 48px);
    margin: auto;
    padding: 0;
    border: 0;
    border-radius: 26px;
    background: #fff;
    box-shadow: 0 24px 100px rgb(10 37 40 / 24%);
    overflow: hidden;
    overscroll-behavior: contain;
}
dialog.ss-or-dialog:not([open]) {display: none;}
dialog.ss-or-dialog[open] {display: flex; flex-direction: column; animation: ss-or-appear .18s ease-out;}
dialog.ss-or-dialog::backdrop {background: rgb(14 34 38 / 55%); backdrop-filter: blur(3px);}
.ss-or-dialog .ss-or-dialog__mount {display: flex; flex-direction: column; min-height: 0; overflow: hidden;}
.ss-or-dialog .ss-or-dialog__header {flex-shrink: 0; margin: 0; padding: 34px 68px 26px 34px; border-bottom: 1px solid #e5eeee;}
.ss-or-dialog .ss-or-person {gap: 20px;}
.ss-or-dialog .ss-or-portrait {flex-basis: 80px; width: 80px; height: 96px; border-radius: 19px;}
.ss-or-dialog .ss-or-name {font-size: 26px; margin-bottom: 6px;}
.ss-or-dialog .ss-or-dialog__title:focus {outline: none;}
.ss-or-dialog .ss-or-role, .ss-or-dialog .ss-or-company {font-size: 14px;}
.ss-or-dialog .ss-or-dialog__body {overflow-y: auto; overscroll-behavior: contain; min-height: 0; padding: 26px 34px 34px; overflow-wrap: anywhere; scrollbar-width: thin; scrollbar-color: var(--ss-or-accent) transparent;}
.ss-or-dialog .ss-or-dialog__body:focus-visible {outline: 2px solid var(--ss-or-action); outline-offset: -3px;}
.ss-or-dialog .ss-or-dialog__body > :first-child {margin-top: 0;}
.ss-or-dialog .ss-or-dialog__body > :last-child {margin-bottom: 0;}
.ss-or-dialog .ss-or-dialog__body p {margin: 0 0 1.2em; font: inherit; color: inherit;}
.ss-or-dialog .ss-or-dialog__body h2, .ss-or-dialog .ss-or-dialog__body h3, .ss-or-dialog .ss-or-dialog__body h4 {font-family: inherit; font-size: 1.3em; line-height: 1.4; color: var(--ss-or-heading);}
.ss-or-dialog .ss-or-dialog__body a {color: var(--ss-or-action); text-decoration: underline;}
.ss-or-dialog .ss-or-dialog__body img {max-width: 100%; height: auto; border-radius: 12px;}
.ss-or-dialog .ss-or-dialog__body ul, .ss-or-dialog .ss-or-dialog__body ol {padding-inline-start: 1.5em; margin: 0 0 1.2em;}
.ss-or-dialog .ss-or-dialog__body blockquote {margin: 1em 0; padding: 0 0 0 18px; border-inline-start: 3px solid var(--ss-or-accent); font: inherit;}
.ss-or-dialog .ss-or-dialog__close {
    position: absolute;
    inset: 15px 15px auto auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    min-height: 42px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--ss-or-action);
    cursor: pointer;
    box-shadow: none;
    z-index: 1;
}
.ss-or-dialog .ss-or-dialog__close:hover {background: #edf7f8;}
.ss-or-dialog .ss-or-dialog__close svg {display: block; width: 22px; height: 22px;}
@keyframes ss-or-appear {from {opacity: 0; transform: translateY(10px);} to {opacity: 1; transform: translateY(0);}}
@media (hover: hover) {.ss-or .ss-or-card:hover {transform: translateY(-3px); box-shadow: 0 10px 28px rgb(20 95 105 / 8%);}}
@media (max-width: 1024px) {.ss-or .ss-or-grid {grid-template-columns: repeat(2, minmax(0, 1fr));}}
@media (max-width: 600px) {
    .ss-or .ss-or-grid {grid-template-columns: minmax(0, 1fr); gap: 18px;}
    .ss-or .ss-or-card {min-height: 300px; padding: 24px;}
    .ss-or .ss-or-name {font-size: 21px;}
    .ss-or .ss-or-role {font-size: 13px;}
    .ss-or .ss-or-excerpt {font-size: 14px;}
    .ss-or .ss-or-intro {margin-bottom: 28px;}
    .ss-or .ss-or-footer {margin-top: 24px;}
    dialog.ss-or-dialog {width: calc(100% - 24px); max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); border-radius: 22px;}
    .ss-or-dialog .ss-or-dialog__header {padding: 26px 53px 22px 22px;}
    .ss-or-dialog .ss-or-person {gap: 13px;}
    .ss-or-dialog .ss-or-portrait {flex-basis: 60px; width: 60px; height: 76px; border-radius: 15px;}
    .ss-or-dialog .ss-or-name {font-size: 21px;}
    .ss-or-dialog .ss-or-role, .ss-or-dialog .ss-or-company {font-size: 12px;}
    .ss-or-dialog .ss-or-dialog__body {padding: 22px; font-size: 14px;}
    .ss-or-dialog .ss-or-dialog__close {inset: 9px 9px auto auto; width: 40px; height: 40px; min-height: 40px;}
}
/* Also adapt when a shortcode lives in a narrower Elementor column. */
@container (max-width: 900px) {.ss-or .ss-or-grid {grid-template-columns: repeat(2, minmax(0, 1fr));}}
@container (max-width: 480px) {.ss-or .ss-or-grid {grid-template-columns: minmax(0, 1fr);}}
@media (max-height: 480px) {
    .ss-or-dialog .ss-or-dialog__header {padding-top: 16px; padding-bottom: 16px;}
    .ss-or-dialog .ss-or-portrait {height: 56px; width: 48px; flex-basis: 48px;}
}
@media (prefers-reduced-motion: reduce) {
    .ss-or .ss-or-card, .ss-or .ss-or-button {transition: none;}
    dialog.ss-or-dialog[open] {animation: none;}
    .ss-or .ss-or-card:hover {transform: none;}
}