/* A photo's crop chosen in the panel: its own on a computer, from a tablet's
   width up, when one was chosen. */
@media (min-width: 768px) {
    img[data-focus] { object-position: var(--fp-computer, var(--fp-phone)) !important }
}

/* The language switcher floating in a corner of the screen. */
[data-fiticms-language-switcher] {
    position: fixed; z-index: 2147483000; display: flex; gap: 2px; padding: 4px; border-radius: 999px;
    background: rgba(255, 255, 255, .92); box-shadow: 0 1px 2px rgba(0, 0, 0, .08), 0 6px 20px rgba(0, 0, 0, .12);
    backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
    font: 600 12px/1 ui-sans-serif, system-ui, -apple-system, sans-serif; letter-spacing: .04em;
}
[data-fiticms-language-switcher] a { display: inline-block; padding: 8px 12px; border-radius: 999px; text-decoration: none; color: #374151 }
[data-fiticms-language-switcher] a[aria-current="true"] { background: #111827; color: #fff }

/* The cookie bar. */
#fiticms-consent { --consent-background: #10192c; --consent-accent: #b79a70; }
#fiticms-consent {
    --consent-text: #fff;
    --consent-accent-text: #1a1a1a;
    position: fixed;
    inset-inline: clamp(12px, 3vw, 40px);
    bottom: clamp(12px, 3vw, 32px);
    z-index: 2147483000;
    display: flex;
    flex-wrap: wrap;
    gap: clamp(16px, 3vw, 48px);
    align-items: center;
    justify-content: space-between;
    padding: clamp(18px, 2.5vw, 28px) clamp(20px, 3vw, 36px);
    border: 1px solid color-mix(in srgb, var(--consent-text) 18%, transparent);
    border-radius: var(--consent-bar-radius, 0);
    background: var(--consent-background);
    color: var(--consent-text);
    font-family: var(--consent-font, inherit);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.55;
    box-shadow: var(--consent-shadow, 0 18px 48px rgb(0 0 0 / .35));
}
#fiticms-consent[hidden], .consent-settings[hidden] { display: none }
.consent-text-block { flex: 1 1 380px; max-width: 62ch }
.consent-title { margin: 0 0 6px; font-size: 1.05rem; font-weight: 600 }
.consent-description { margin: 0; opacity: .78 }
.consent-policy { color: inherit; font-weight: 600; text-decoration: none; border-bottom: 1px solid currentColor; white-space: nowrap }
.consent-choices { display: flex; flex-wrap: wrap; align-items: center; gap: 12px }
.consent-button {
    cursor: pointer;
    border: 1px solid color-mix(in srgb, var(--consent-text) 35%, transparent);
    border-radius: var(--consent-radius, 0);
    background: transparent;
    color: inherit;
    padding: var(--consent-button-padding, 14px 24px);
    font: inherit;
    font-family: var(--consent-button-font, inherit);
    font-weight: var(--consent-button-weight, 500);
    text-transform: var(--consent-button-case, none);
    letter-spacing: var(--consent-button-tracking, normal);
    transition: opacity .15s;
}
.consent-button:hover { opacity: .85 }
.consent-button--primary { border-color: var(--consent-accent-border, var(--consent-accent)); background: var(--consent-accent); color: var(--consent-accent-text) }
.consent-link { cursor: pointer; border: 0; background: none; color: inherit; padding: 14px 4px; font: inherit; text-decoration: underline }
.consent-settings { display: grid; gap: 0 }
.consent-categories { margin-top: 24px; border-top: 1px solid color-mix(in srgb, var(--consent-text) 14%, transparent) }
.consent-category { display: flex; gap: 24px; align-items: flex-start; justify-content: space-between; padding: 22px 0; border-bottom: 1px solid color-mix(in srgb, var(--consent-text) 14%, transparent); cursor: pointer }
div.consent-category { cursor: default }
.consent-name { display: block; font-weight: 600; margin-bottom: 4px }
.consent-explanation { display: block; opacity: .75; max-width: 52ch }
.consent-always { flex: none; margin-top: 2px; font-size: .75rem; letter-spacing: .16em; text-transform: uppercase; opacity: .5 }
.consent-switch {
    flex: none; appearance: none; -webkit-appearance: none; margin: 2px 0 0; cursor: pointer;
    width: 46px; height: 26px; position: relative;
    border-radius: min(var(--consent-radius, 0px), 13px);
    background: color-mix(in srgb, var(--consent-text) 16%, transparent);
    transition: background .2s;
}
.consent-switch::after {
    content: ''; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px;
    border-radius: min(var(--consent-radius, 0px), 10px);
    background: var(--consent-background); box-shadow: 0 1px 2px rgb(0 0 0 / .25); transition: transform .2s;
}
.consent-switch:checked { background: var(--consent-accent) }
.consent-switch:checked::after { transform: translateX(20px); background: var(--consent-accent-text) }
.consent-switch:focus-visible { outline: 2px solid var(--consent-accent); outline-offset: 3px }
.consent-links { margin: 24px 0 0; display: flex; flex-wrap: wrap; gap: 10px; font-size: .9rem; opacity: .7 }
.consent-links a { color: inherit; text-decoration: none; border-bottom: 1px solid currentColor }
/* Opened from a consent settings link: a window in the middle, the page dimmed. */
#fiticms-consent.consent--window {
    inset: 0;
    margin: auto;
    width: min(640px, calc(100% - 32px));
    height: fit-content;
    max-height: calc(100% - 48px);
    overflow: auto;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: clamp(24px, 3vw, 40px);
}
#fiticms-consent.consent--window .consent-text-block, #fiticms-consent.consent--window .consent-choices--bar { display: none }
#fiticms-consent.consent--window .consent-settings { border-top: 0; padding-top: 0 }
#fiticms-consent.consent--window + .consent-backdrop { display: block }
.consent-backdrop { display: none; position: fixed; inset: 0; z-index: 2147482999; background: rgb(0 0 0 / .6) }
.consent-close { position: absolute; top: 14px; right: 16px; cursor: pointer; border: 0; background: none; color: inherit; font-size: 28px; line-height: 1; opacity: .7 }
.consent-close[hidden] { display: none }
.consent-eyebrow { margin: 0 0 12px; font-size: .75rem; letter-spacing: .16em; text-transform: uppercase; opacity: .6 }
.consent-heading { margin: 0 0 12px; font-family: var(--consent-heading-font, inherit); font-size: clamp(1.6rem, 3.4vw, 2.4rem); font-weight: var(--consent-heading-weight, 600); line-height: 1.15 }
.consent-settings .consent-description { margin-bottom: 8px }
.consent-settings .consent-choices { padding-top: 28px }

@media (max-width: 720px) {
    #fiticms-consent { gap: 18px }
    .consent-choices { width: 100%; }
    .consent-button { flex: 1 1 auto }
}