/* ========================================================= INESC Core — design tokens The shared token palette for the INESC content listings (events + news): colors, fonts, fluid font sizes, spacing, radii and external-margin gutters. Single source of truth: the namespaced --ip-* family, with the legacy events names (--green, --text-24, --font-main, …) kept as ALIASES that resolve to the same --ip-* value, so both modules share one definition of every font/size. Scoped to the consumer wrapper classes (NOT :root), so nothing leaks into the theme. Consumer plugins enqueue the `inesc-tokens` handle as a dependency of their layout stylesheets. ========================================================= */ .inesc-events, .inesc-event-single, .inesc-event-related, .inesc-event-card, .inesc-post-single, .inesc-post-related, .inesc-news-listing, .inesc-news-card, .inesc-latest-news, .inesc-people, .inesc-listing, .inesc-filter-tabs, .inesc-pagination, .inesc-share { /* Fluid tokens below scale between a 48rem (768px) and 85.375rem (1366px) viewport. The preferred value is expressed as ` + ` (precomputed) rather than a length-by-length calc() division, which is invalid per the CSS spec and rejected by Firefox (right operand of `/` must be a number). */ /* ---- Canonical colors ---- */ --ip-blue: #005f80; --ip-dark-blue: #004d6d; --ip-green: #97ca3d; --ip-green-dark: #84b62f; --ip-gray: #6a858e; --ip-text: #2c3338; --ip-text-light: #ffffff; --ip-placeholder-bg: #d9d9d9; /* ---- Canonical font family ---- */ --ip-font: "Titillium Web", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; /* ---- Canonical font weights ---- */ --ip-fw-light: 300; --ip-fw-regular: 400; --ip-fw-medium: 500; --ip-fw-semi: 600; --ip-fw-bold: 700; /* ---- Card radius ---- */ --ip-radius-card: clamp(0.85714rem, -0.51892rem + 2.86678vw, 1.9286rem); /* ---- Canonical fluid font sizes (union of both modules) ---- */ --ip-text-11: clamp(0.625rem, 0.54473rem + 0.16722vw, 0.6875rem); --ip-text-12: clamp(0.625rem, 0.46446rem + 0.33445vw, 0.75rem); --ip-text-14: clamp(0.75rem, 0.58946rem + 0.33445vw, 0.875rem); --ip-text-16: clamp(0.84375rem, 0.64308rem + 0.41806vw, 1rem); --ip-text-17: clamp(0.90625rem, 0.70558rem + 0.41806vw, 1.0625rem); --ip-text-17-5: clamp(0.90625rem, 0.66545rem + 0.50167vw, 1.09375rem); --ip-text-18: clamp(0.9375rem, 0.69670rem + 0.50167vw, 1.125rem); --ip-text-19: clamp(1rem, 0.75920rem + 0.50167vw, 1.1875rem); --ip-text-19-5: clamp(1rem, 0.71906rem + 0.58528vw, 1.21875rem); --ip-text-20: clamp(0.9375rem, 0.53616rem + 0.83612vw, 1.25rem); --ip-text-21: clamp(1.09375rem, 0.81281rem + 0.58528vw, 1.3125rem); --ip-text-22: clamp(1.15625rem, 0.87531rem + 0.58528vw, 1.375rem); --ip-text-22-5: clamp(1.1875rem, 0.90656rem + 0.58528vw, 1.40625rem); --ip-text-24: clamp(1.3125rem, 1.07170rem + 0.50167vw, 1.5rem); --ip-text-25: clamp(1.34375rem, 1.06281rem + 0.58528vw, 1.5625rem); --ip-text-26: clamp(1.40625rem, 1.12531rem + 0.58528vw, 1.625rem); --ip-text-27-5: clamp(0.9375rem, -0.06584rem + 2.09030vw, 1.71875rem); --ip-text-30: clamp(1.6875rem, 1.44670rem + 0.50167vw, 1.875rem); --ip-text-33: clamp(0.9375rem, -0.50732rem + 3.01003vw, 2.0625rem); --ip-text-35: clamp(1.84375rem, 1.40228rem + 0.91973vw, 2.1875rem); --ip-text-36: clamp(1.5625rem, 0.67956rem + 1.83946vw, 2.25rem); --ip-text-38: clamp(2rem, 1.51839rem + 1.00334vw, 2.375rem); --ip-text-49: clamp(2.59375rem, 1.99174rem + 1.25418vw, 3.0625rem); /* ---- Unified external margin / layout (base Posts) ---- */ --ip-container: 84.125rem; /* 1346px */ --ip-gutter: clamp(1rem, 10vw, 5rem); /* matches WPBakery row gutter */ --ip-news-gutter: clamp(1rem, 5vw, 5rem); /* ---- Spacing scale (events) ---- */ --spacing-xs: clamp(0.25rem, 0.16973rem + 0.16722vw, 0.3125rem); --spacing-sm: clamp(0.375rem, 0.21446rem + 0.33445vw, 0.5rem); --spacing-md: clamp(0.75rem, 0.42893rem + 0.66890vw, 1rem); --spacing-lg: clamp(1rem, 0.35786rem + 1.33779vw, 1.5rem); --spacing-xl: clamp(1.5rem, 0.85786rem + 1.33779vw, 2rem); --spacing-2xl: clamp(2rem, 0.71572rem + 2.67559vw, 3rem); --spacing-3xl: clamp(2rem, -19.19064rem + 44.14716vw, 18.5rem); /* ---- Misc events-only tokens (no posts equivalent) ---- */ --accent-color: #ff6b35; --text-dark: #000000; --border-color: #e0e0e0; --bg-light: #f5f5f5; --dark-gray: #5a5d55; --menu-height: 136px; --breakpoint-tablet: 48rem; --breakpoint-mobile: 30rem; --offset: 5%; --inner-padding: 5.5vw; --radius-sm: 0.2143rem; --radius-md: 0.2857rem; --radius-lg: var(--ip-radius-card); --radius-xl: clamp(1.1071rem, -0.22316rem + 2.77137vw, 2.1429rem); /* ================================================================ Events-compat aliases → canonical --ip-* (single source of truth). These let the events layout CSS keep its original token names while resolving to exactly the same value the posts layout uses. ================================================================ */ --primary-color: var(--ip-blue); --secondary-color: var(--ip-green); --blue: var(--ip-blue); --dark-blue: var(--ip-dark-blue); --green: var(--ip-green); --gray: var(--ip-gray); --text-light: var(--ip-text-light); --font-main: var(--ip-font); --font-heading: var(--ip-font); --extra-light: 200; --light: 300; --normal: 400; --semi-bold: 600; --bold: 700; --text-11: var(--ip-text-11); --text-12: var(--ip-text-12); --text-14: var(--ip-text-14); --text-16: var(--ip-text-16); --text-17: var(--ip-text-17); --text-17-5: var(--ip-text-17-5); --text-18: var(--ip-text-18); --text-19: var(--ip-text-19); --text-19-5: var(--ip-text-19-5); --text-20: var(--ip-text-20); --text-21: var(--ip-text-21); --text-22: var(--ip-text-22); --text-22-5: var(--ip-text-22-5); --text-24: var(--ip-text-24); --text-25: var(--ip-text-25); --text-26: var(--ip-text-26); --text-27-5: var(--ip-text-27-5); --text-30: var(--ip-text-30); --text-33: var(--ip-text-33); --text-35: var(--ip-text-35); --text-36: var(--ip-text-36); --text-38: var(--ip-text-38); --text-49: var(--ip-text-49); --container-width: var(--ip-container); }