/* Redful Design System v4 — shared shell primitives loaded after legacy CSS. */
:root {
    --rf-bg: #080c12;
    --rf-bg-rgb: 8, 12, 18;
    --rf-surface: rgba(14, 20, 29, .84);
    --rf-surface-elevated: #121a25;
    --rf-border: rgba(185, 203, 226, .13);
    --rf-border-strong: rgba(185, 203, 226, .24);
    --rf-text: #f4f7fb;
    --rf-muted: #9aa8bb;
    --rf-accent: #ed3440;
    --rf-accent-hover: #ff4b56;
    --rf-success: #23a95b;
    --rf-warning: #d58b13;
    --rf-danger: #d92935;
    --rf-focus: #69a8ff;
    --rf-shadow-1: 0 8px 26px rgba(0, 0, 0, .28);
    --rf-shadow-2: 0 22px 58px rgba(0, 0, 0, .46);
    --rf-radius-sm: 8px;
    --rf-radius-md: 12px;
    --rf-radius-lg: 16px;
    --rf-radius-xl: 24px;
    --rf-space-1: 4px;
    --rf-space-2: 8px;
    --rf-space-3: 12px;
    --rf-space-4: 16px;
    --rf-space-6: 24px;
    --rf-space-8: 32px;
    --rf-space-12: 48px;
    --rf-shell-width: 1480px;
    --rf-header-height: 68px;
    --rf-motion-fast: 160ms;
    --rf-motion-normal: 220ms;
    --rf-font-sans: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

html { max-width: 100%; overflow-x: clip; scroll-padding-top: calc(var(--rf-header-height) + var(--rf-space-4)); color-scheme: dark; }
body,
body.pushable,
body.pushable > .pusher {
    max-width: 100%;
    overflow-x: clip;
    color: var(--rf-text);
    background-color: var(--rf-bg) !important;
    font-family: var(--rf-font-sans);
}

body.redful-nav-locked { overflow: hidden !important; }
body.pushable > .pusher.redful-page-shell { min-height: 100vh; transform: none !important; }
#wrapper { display: flex; min-height: 100vh; flex-direction: column; margin-bottom: 0 !important; }
#redful-main-content { flex: 1 0 auto; }

h1, h2, h3, h4, h5, h6,
.ui.header { color: var(--rf-text); font-family: var(--rf-font-sans); text-wrap: balance; }
p, li { text-wrap: pretty; }

a, button, input, select, textarea, summary { -webkit-tap-highlight-color: transparent; }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid color-mix(in srgb, var(--rf-focus) 78%, transparent) !important;
    outline-offset: 3px !important;
}

.redful-skip-link {
    position: fixed; z-index: 10020; top: var(--rf-space-3); left: var(--rf-space-3);
    padding: var(--rf-space-3) var(--rf-space-4); border-radius: var(--rf-radius-sm);
    color: #fff !important; background: var(--rf-accent); box-shadow: var(--rf-shadow-2);
    font-weight: 800; transform: translateY(calc(-100% - 24px)); transition: transform var(--rf-motion-fast) ease;
}
.redful-skip-link:focus { transform: translateY(0); }

.redful-site-header {
    position: sticky; z-index: 1000; top: 0; min-height: var(--rf-header-height);
    border-bottom: 1px solid var(--rf-border);
    background: linear-gradient(180deg, rgba(var(--rf-bg-rgb), .9), rgba(var(--rf-bg-rgb), .72));
    box-shadow: 0 10px 32px rgba(0, 0, 0, .06);
    backdrop-filter: blur(18px) saturate(135%);
    -webkit-backdrop-filter: blur(18px) saturate(135%);
}
.redful-header-inner.ui.container {
    display: flex; width: min(var(--rf-shell-width), calc(100% - 32px)) !important;
    min-height: var(--rf-header-height); align-items: center; gap: var(--rf-space-4); margin: 0 auto !important;
}
.redful-wordmark {
    display: inline-flex; min-width: max-content; min-height: 48px; align-items: center; gap: 10px;
    color: var(--rf-text) !important; text-decoration: none;
}
.redful-wordmark-mark {
    display: grid !important; width: 38px; height: 38px; place-items: center; flex: 0 0 auto;
    border: 1px solid rgba(255, 98, 108, .72); border-radius: 10px;
    color: #fff; background: linear-gradient(145deg, #ff4652 0%, #b20d1a 72%);
    box-shadow: inset 0 1px rgba(255,255,255,.32), 0 0 24px rgba(237,52,64,.28);
    font-size: 1.28rem; font-weight: 950; line-height: 1;
}
.redful-wordmark-text { color: var(--rf-text); font-size: 1.3rem; font-weight: 950; letter-spacing: -.055em; line-height: 1; }
.redful-wordmark-text b { color: var(--rf-accent); }
.redful-wordmark-text span { color: var(--rf-text); }

.redful-primary-navigation { display: flex; min-width: 0; flex: 1; align-items: center; gap: var(--rf-space-3); }
.redful-primary-links { display: flex; min-width: 0; align-items: center; gap: 2px; }
.redful-nav-link,
.redful-nav-group > summary {
    position: relative; display: inline-flex; min-height: 44px; align-items: center; gap: 7px;
    padding: 0 11px; border: 0; border-radius: var(--rf-radius-sm); cursor: pointer;
    color: var(--rf-muted) !important; background: transparent; font-size: .87rem; font-weight: 750;
    list-style: none; text-decoration: none; transition: color var(--rf-motion-fast) ease, background var(--rf-motion-fast) ease;
}
.redful-nav-group > summary::-webkit-details-marker,
.redful-user-menu > summary::-webkit-details-marker { display: none; }
.redful-nav-link:hover,
.redful-nav-link.active,
.redful-nav-group > summary:hover,
.redful-nav-group.active > summary { color: var(--rf-text) !important; background: color-mix(in srgb, var(--rf-text) 6%, transparent); }
.redful-nav-link.active::after,
.redful-nav-group.active > summary::after {
    position: absolute; right: 11px; bottom: 2px; left: 11px; height: 2px;
    border-radius: 999px; background: var(--rf-accent); content: "";
}
.redful-nav-link > .icon,
.redful-nav-group > summary > .icon { margin: 0 !important; }
.redful-nav-group { position: relative; }
.redful-nav-group > summary .chevron.icon { margin-left: 2px !important; font-size: .7em; transition: transform var(--rf-motion-fast) ease; }
.redful-nav-group[open] > summary .chevron.icon { transform: rotate(180deg); }
.redful-nav-submenu,
.redful-user-popover {
    position: absolute; top: calc(100% + 10px); min-width: 220px; padding: 8px;
    border: 1px solid var(--rf-border); border-radius: var(--rf-radius-md);
    color: var(--rf-text); background: color-mix(in srgb, var(--rf-surface-elevated) 94%, transparent);
    box-shadow: var(--rf-shadow-2); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
}
.redful-nav-submenu a,
.redful-user-popover a {
    display: flex; min-height: 44px; align-items: center; gap: 10px; padding: 9px 11px;
    border-radius: var(--rf-radius-sm); color: var(--rf-text) !important; text-decoration: none;
}
.redful-nav-submenu a:hover,
.redful-user-popover a:hover { background: color-mix(in srgb, var(--rf-accent) 10%, transparent); }
.redful-nav-separator,
.redful-user-separator { display: block; height: 1px; margin: 6px 4px; background: var(--rf-border); }

.redful-nav-cta {
    color: #fff !important; background: linear-gradient(135deg, var(--rf-accent), #a8111c) !important;
    box-shadow: 0 8px 22px rgba(217, 41, 53, .22);
}
.redful-nav-cta:hover { color: #fff !important; background: linear-gradient(135deg, var(--rf-accent-hover), var(--rf-accent)) !important; }
.redful-nav-cta::after { display: none; }

.redful-nav-tools { display: flex; min-width: max-content; align-items: center; gap: 10px; margin-left: auto; }
.redful-language-switcher { display: inline-flex; min-height: 44px; align-items: center; gap: 6px; padding: 0 9px; border-radius: var(--rf-radius-sm); }
.redful-language-switcher a { color: var(--rf-muted) !important; font-size: .76rem; font-weight: 850; letter-spacing: .04em; text-decoration: none; }
.redful-language-switcher a.active { color: var(--rf-accent) !important; }
.redful-account-actions { display: flex; align-items: center; gap: 6px; }
.redful-user-menu { position: relative; }
.redful-icon-trigger,
.redful-account-trigger,
.redful-account-link {
    display: inline-flex; min-width: 44px; min-height: 44px; align-items: center; justify-content: center; gap: 8px;
    padding: 7px 11px; border: 1px solid var(--rf-border); border-radius: var(--rf-radius-sm);
    color: var(--rf-text) !important; background: color-mix(in srgb, var(--rf-surface) 68%, transparent);
    cursor: pointer; font-weight: 750; list-style: none; text-decoration: none;
}
.redful-account-trigger img,
.redful-icon-trigger img { width: 30px !important; height: 30px !important; margin: 0 !important; border-radius: 7px; object-fit: cover; }
.redful-user-popover { right: 0; z-index: 5; }
.redful-user-popover > strong { display: block; padding: 8px 11px; color: var(--rf-muted); font-size: .74rem; letter-spacing: .06em; text-transform: uppercase; }
.redful-register-link { border-color: transparent; color: #fff !important; background: var(--rf-accent); }
.redful-nav-toggle,
.redful-nav-close { display: none; min-width: 44px; min-height: 44px; border: 1px solid var(--rf-border); border-radius: var(--rf-radius-sm); color: var(--rf-text); background: var(--rf-surface); cursor: pointer; }
.redful-nav-toggle { flex-direction: column; align-items: center; justify-content: center; gap: 5px; margin-left: auto; }
.redful-nav-toggle > span { width: 20px; height: 2px; border-radius: 2px; background: currentColor; }
.redful-nav-drawer-head,
.redful-nav-backdrop { display: none; }

.redful-site-footer.ui.segment {
    flex: 0 0 auto; margin: 0 !important; padding: 46px 0 34px !important;
    border: 0 !important; border-top: 1px solid var(--rf-border) !important;
    color: var(--rf-muted) !important;
    background: linear-gradient(180deg, rgba(var(--rf-bg-rgb), .3), rgba(var(--rf-bg-rgb), .8)) !important;
    box-shadow: none !important; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
}
.redful-site-footer .ui.header { color: var(--rf-text) !important; }
.redful-site-footer .ui.inverted.link.list .item,
.redful-site-footer a { color: var(--rf-muted) !important; }
.redful-site-footer .ui.link.list > a.item { display: flex; min-height: 44px; align-items: center; }
.redful-site-footer .ui.divided.grid > .column:not(.row) { box-shadow: -1px 0 0 0 var(--rf-border); }
.redful-site-footer a:hover,
.redful-site-footer .redful-footer-languages a.active { color: var(--rf-text) !important; }

@media (max-width: 1180px) {
    .redful-nav-link, .redful-nav-group > summary { padding-right: 8px; padding-left: 8px; font-size: .8rem; }
    .redful-nav-link > .icon, .redful-nav-group > summary > .icon { display: none; }
    .redful-wordmark-text { font-size: 1.15rem; }
}

@media (max-width: 1023px) {
    .redful-header-inner.ui.container { width: calc(100% - 24px) !important; flex-wrap: wrap; }
    html.rf-shell-ready .redful-header-inner.ui.container { flex-wrap: nowrap; }
    html.rf-shell-ready .redful-nav-toggle,
    html.rf-shell-ready .redful-nav-close { display: inline-flex; }
    .redful-nav-drawer-head { display: flex; min-height: 56px; align-items: center; justify-content: space-between; padding: 4px 4px 12px; border-bottom: 1px solid var(--rf-border); }
    .redful-nav-drawer-title { color: var(--rf-text); font-size: 1.05rem; font-weight: 850; }
    .redful-primary-navigation {
        width: 100%; flex-direction: column; align-items: stretch; padding: 14px 0 8px;
    }
    .redful-primary-links, .redful-nav-tools, .redful-account-actions { width: 100%; flex-direction: column; align-items: stretch; }
    .redful-nav-tools { margin: 8px 0 0; padding-top: 12px; border-top: 1px solid var(--rf-border); }
    .redful-nav-link, .redful-nav-group > summary { width: 100%; min-height: 48px; padding: 0 13px; font-size: .94rem; }
    .redful-nav-link > .icon, .redful-nav-group > summary > .icon { display: inline-block; }
    .redful-nav-link.active::after, .redful-nav-group.active > summary::after { top: 9px; right: auto; bottom: 9px; left: 2px; width: 3px; height: auto; }
    .redful-nav-submenu, .redful-user-popover { position: static; min-width: 0; margin: 4px 0 8px 14px; box-shadow: none; }
    .redful-language-switcher { justify-content: flex-start; padding-left: 13px; }
    .redful-icon-trigger, .redful-account-trigger, .redful-account-link { width: 100%; justify-content: flex-start; }
    .redful-user-popover { margin-left: 14px; }

    /* Without JavaScript the single navigation remains in normal flow as a usable fallback. */
    html.rf-shell-ready .redful-primary-navigation {
        position: fixed; z-index: 10012; top: 0; right: 0; bottom: 0; width: min(88vw, 380px);
        overflow-y: auto; overscroll-behavior: contain; padding: 14px;
        border-left: 1px solid var(--rf-border); background: color-mix(in srgb, var(--rf-surface-elevated) 96%, transparent);
        box-shadow: var(--rf-shadow-2); transform: translateX(105%); visibility: hidden;
        transition: transform var(--rf-motion-normal) ease, visibility 0s linear var(--rf-motion-normal);
    }
    html.rf-shell-ready .redful-site-header.redful-nav-open .redful-primary-navigation {
        transform: translateX(0); visibility: visible; transition-delay: 0s;
    }
    html.rf-shell-ready .redful-nav-backdrop {
        position: fixed; z-index: 10011; inset: 0; width: 100%; height: 100%;
        border: 0; background: rgba(2, 5, 9, .68); opacity: 0; visibility: hidden;
        transition: opacity var(--rf-motion-normal) ease, visibility 0s linear var(--rf-motion-normal);
    }
    html.rf-shell-ready .redful-site-header.redful-nav-open .redful-nav-backdrop {
        display: block; opacity: 1; visibility: visible; transition-delay: 0s;
    }
}

@media (max-width: 430px) {
    :root { --rf-header-height: 62px; }
    .redful-header-inner.ui.container { width: calc(100% - 16px) !important; }
    .redful-wordmark-mark { width: 34px; height: 34px; }
    .redful-wordmark-text { font-size: 1.08rem; }
    .redful-site-footer.ui.segment { padding-top: 34px !important; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

@supports not (backdrop-filter: blur(1px)) {
    .redful-site-header, .redful-site-footer.ui.segment { background: rgb(var(--rf-bg-rgb)) !important; }
}