/* PropNova global visual and motion foundation.
   Canonical authority: docs/website/WEBSITE_VISUAL_MOTION_AUTHORITY.md */

:root {
    color-scheme: dark light;

    /* Real-logo-derived production palette */
    --pn-navy-950: #08131f;
    --pn-navy-900: #13202f;
    --pn-navy-800: #182b38;
    --pn-navy-700: #233b49;
    --pn-cyan-500: #00dbfc;
    --pn-cyan-400: #3de5fa;
    --pn-cyan-200: #a2f3fc;
    --pn-gold-500: #f0be30;
    --pn-gold-400: #f7ce58;
    --pn-gold-200: #fbe5a7;
    --pn-ivory-100: #f6f1e7;
    --pn-ivory-50: #fbf8f0;
    --pn-austria-red: #c8102e;
    --pn-ink: #111a20;
    --pn-rule-dark: rgb(246 241 231 / 16%);
    --pn-rule-light: rgb(8 19 31 / 18%);

    /* Shared motion grammar */
    --pn-motion-fast: 180ms;
    --pn-motion-standard: 620ms;
    --pn-motion-cinematic: 1100ms;
    --pn-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --pn-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

    /* Surface-state contract */
    --pn-nav-foreground: var(--pn-ivory-50);
    --pn-nav-background: rgb(8 19 31 / 92%);
    --pn-nav-rule: var(--pn-rule-dark);
}

::selection {
    color: var(--pn-navy-950);
    background: var(--pn-gold-400);
}

html {
    scrollbar-color: var(--pn-gold-500) var(--pn-navy-950);
    scrollbar-width: thin;
}

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--pn-navy-950); }
::-webkit-scrollbar-thumb { background: var(--pn-gold-500); border: 3px solid var(--pn-navy-950); }

:focus-visible {
    outline-color: var(--pn-gold-400) !important;
    outline-offset: 4px;
}

/* Real-brand lockup: horizontal by default, exact extracted mark on compact navigation. */
.pn-brand-picture {
    display: inline-flex;
    flex: none;
    line-height: 0;
}

.site-nav__brand,
.public-nav .brand {
    display: inline-flex;
    align-items: center;
    flex: none;
    min-width: 0;
    line-height: 0;
}

.site-nav__logo,
.brand .public-nav__logo {
    display: block;
    width: clamp(8rem, 11vw, 10.25rem);
    height: auto;
    object-fit: contain;
}

.site-footer__logo,
.public-footer__logo {
    display: block;
    width: clamp(10rem, 18vw, 14rem);
    height: auto;
    margin: 0 0 1.25rem;
    object-fit: contain;
}

/* Navigation fields can change state without per-section color invention. */
.site-nav,
.public-nav {
    color: var(--pn-nav-foreground);
    border-color: var(--pn-nav-rule);
    transition:
        color var(--pn-motion-fast) ease,
        background-color var(--pn-motion-fast) ease,
        border-color var(--pn-motion-fast) ease,
        backdrop-filter var(--pn-motion-fast) ease;
}

.site-nav[data-visual-theme="dark"],
.public-nav[data-visual-theme="dark"] {
    --pn-nav-foreground: var(--pn-ivory-50);
    --pn-nav-background: rgb(8 19 31 / 94%);
    --pn-nav-rule: var(--pn-rule-dark);
    color: var(--pn-nav-foreground);
    background: var(--pn-nav-background);
}

.site-nav[data-visual-theme="light"],
.public-nav[data-visual-theme="light"] {
    --pn-nav-foreground: var(--pn-navy-950);
    --pn-nav-background: rgb(251 248 240 / 94%);
    --pn-nav-rule: var(--pn-rule-light);
    color: var(--pn-nav-foreground);
    background: var(--pn-nav-background);
}

.site-nav[data-visual-theme="transparent"] {
    --pn-nav-foreground: var(--pn-ivory-50);
    color: var(--pn-nav-foreground);
    background-color: transparent;
}

.site-nav__link::after,
.nav-links a::after {
    background-color: currentColor;
    transition: transform var(--pn-motion-fast) var(--pn-ease-out);
}

.site-nav__link--cta,
.calendar-link {
    border-color: var(--pn-gold-400) !important;
}

.calendar-link {
    background-color: var(--pn-navy-950) !important;
}

.calendar-link:hover,
.calendar-link:focus-visible {
    color: var(--pn-navy-950) !important;
    background-color: var(--pn-gold-400) !important;
}

.site-footer,
.public-footer {
    color: var(--pn-ivory-100);
    background-color: var(--pn-navy-950);
    border-color: var(--pn-rule-dark);
}

/* Motion primitives are visible by default; scripts opt in via data-pn-motion="ready". */
.pn-mask-reveal { overflow: clip; }
.pn-mask-reveal > * {
    clip-path: inset(0 0 0 0);
    transform: translateY(0);
    transition: clip-path var(--pn-motion-standard) var(--pn-ease-out), transform var(--pn-motion-standard) var(--pn-ease-out);
}
[data-pn-motion="ready"] .pn-mask-reveal:not(.is-visible) > * {
    clip-path: inset(0 0 100% 0);
    transform: translateY(105%);
}

.pn-connection-path {
    stroke-dasharray: var(--pn-path-length, 1);
    stroke-dashoffset: 0;
    transition: stroke-dashoffset var(--pn-motion-cinematic) var(--pn-ease-in-out);
}
[data-pn-motion="ready"] .pn-connection-path:not(.is-drawn) {
    stroke-dashoffset: var(--pn-path-length, 1);
}

.pn-parallax-layer {
    transform: translate3d(0, var(--pn-parallax-y, 0), 0);
    will-change: transform;
}

.pn-state-crossfade { display: grid; }
.pn-state-crossfade > * {
    grid-area: 1 / 1;
    opacity: 0;
    transition: opacity var(--pn-motion-standard) var(--pn-ease-in-out);
}
.pn-state-crossfade > .is-active { opacity: 1; }

.pn-field-transition {
    clip-path: inset(var(--pn-field-top, 0) 0 var(--pn-field-bottom, 0) 0);
    transition: clip-path var(--pn-motion-cinematic) var(--pn-ease-in-out), background-color var(--pn-motion-standard) ease;
}

.pn-link-motion {
    position: relative;
    text-decoration: none;
}
.pn-link-motion::after {
    content: '';
    position: absolute;
    right: 0;
    bottom: -0.2em;
    left: 0;
    height: 1px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform var(--pn-motion-fast) var(--pn-ease-out);
}
.pn-link-motion:hover::after,
.pn-link-motion:focus-visible::after {
    transform: scaleX(1);
    transform-origin: left;
}

/* Reusable abstract Austria/Vienna identity fields. Never label as real map data. */
.pn-graphic-field {
    position: relative;
    color: var(--pn-cyan-500);
    isolation: isolate;
    pointer-events: none;
}
.pn-graphic-field[data-human-layer="true"] { color: var(--pn-gold-500); }
.pn-graphic-line { fill: none; stroke: currentColor; vector-effect: non-scaling-stroke; }
.pn-graphic-node { color: var(--pn-gold-500); }
.pn-austria-accent {
    width: min(11.25rem, 36vw);
    height: 1.125rem;
    border-radius: 0.2rem;
    background: linear-gradient(to bottom, var(--pn-austria-red) 0 28%, var(--pn-ivory-50) 28% 72%, var(--pn-austria-red) 72% 100%);
}

/* LEGACY QUARANTINE — obsolete blocks remain in the monolithic home files only
   until their scheduled section redesign. They must not paint or move now. */
body[data-legacy-visuals="suppressed"] .gradient-mesh,
body[data-legacy-visuals="suppressed"] .floating-orb {
    display: none !important;
}

body[data-legacy-visuals="suppressed"] .model-card,
body[data-legacy-visuals="suppressed"] .value-card,
body[data-legacy-visuals="suppressed"] .audience-card {
    filter: none;
}

@media (max-width: 820px) {
    .site-nav__logo,
    .brand .public-nav__logo {
        width: 2.55rem;
        height: 2.55rem;
        aspect-ratio: 1;
    }

    .site-footer__logo,
    .public-footer__logo { width: 10.5rem; }
}

@media (prefers-reduced-motion: reduce) {
    .pn-mask-reveal > *,
    .pn-connection-path,
    .pn-parallax-layer,
    .pn-state-crossfade > *,
    .pn-field-transition,
    .pn-link-motion::after {
        clip-path: none !important;
        stroke-dashoffset: 0 !important;
        transform: none !important;
        transition-duration: 0.01ms !important;
    }
}
