/* ========================================================================== fcmc brand layer — Full Chain Materials Company (富宸材料國際股份有限公司) Loaded LAST on every page. Replaces the former static override layer. This file is the single hand-edited source: no build step, edit in place. Stylesheets removed during the rebrand cleanup (and how to re-add them): see wp-content/CSS-CLEANUP.md. Direction: Swiss industrial print / engineering spec sheet. Four material colours, one accent (Molten Orange), hairline rules, sharp corners, 60° slanted cuts, the hidden "1" as texture. Sections 01 Tokens 02 Elementor kit overrides (global colours + typography) 03 Base + browser surfaces 04 Header / navigation 05 Buttons 06 Headings, eyebrows, body copy 07 Heroes 08 Cards, tiles, spec sheets 09 News list + articles 10 Forms 11 Contact bands (class-based blocks) 12 Footer 13 Motion 14 Responsive 15 Standalone documents (vendor.html) 16 Homepage About (01) + ESG (02) sections ========================================================================== */ /* 01 — Tokens ------------------------------------------------------------- */ :root { /* Brand colours: exact, from the material itself */ --fcmc-orange: #E94C25; /* Molten Orange — 熔融, the single accent */ --fcmc-navy: #213C62; /* Crystal Navy — 晶體, primary brand surface */ --fcmc-white: #F7F7F7; /* Clean White — 潔淨, light substrate */ --fcmc-carbon: #131E26; /* Carbon Black — 碳, dark surfaces / text */ /* Derived — orange press state, navy depth */ --fcmc-orange-press: #C83E1C; --fcmc-navy-deep: #1A3152; /* Greys, all tinted toward Navy (one family) */ --fcmc-ink-800: #22303D; --fcmc-ink-700: #33445A; /* body text on light (≈9:1 on white) */ --fcmc-ink-600: #4A5A6F; /* secondary text (≈6.6:1) */ --fcmc-ink-500: #5E6E83; /* meta text (≈4.9:1) */ --fcmc-ink-300: #A7B2C1; /* input borders, dim rules */ --fcmc-ink-200: #CDD4DD; /* hairline rules */ --fcmc-ink-100: #E4E8ED; /* panel fills */ --fcmc-ink-50: #EEF1F4; --fcmc-paper: #FFFFFF; /* raised sheet on the Clean White substrate */ --fcmc-on-accent: #FFFFFF; /* text on Molten Orange / Navy / Carbon */ --fcmc-error: var(--fcmc-error); /* form error (not a brand colour; function only) */ --fcmc-scrim-navy: rgba(33, 60, 98, 0.96); --fcmc-scrim-navy-90: rgba(26, 49, 82, 0.9); --fcmc-scrim-navy-72: rgba(33, 60, 98, 0.72); --fcmc-scrim-carbon: rgba(19, 30, 38, 0.38); --fcmc-plate-white: rgba(247, 247, 247, 0.94); --fcmc-tint-on-dark: rgba(247, 247, 247, 0.05); --fcmc-on-dark: #F7F7F7; --fcmc-on-dark-2: #B9C4D2; /* secondary text on Navy / Carbon (≥6:1) */ --fcmc-rule-on-dark: rgba(247, 247, 247, 0.14); /* Type */ --fcmc-font-sans: "Outfit", "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui, sans-serif; --fcmc-font-cjk: "Noto Sans TC", "Outfit", "PingFang TC", "Microsoft JhengHei", system-ui, sans-serif; --fcmc-font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace; --fcmc-fs-label: 0.75rem; /* 12px eyebrow / meta */ --fcmc-fs-small: 0.875rem; /* 14px */ --fcmc-fs-body: 1rem; /* 16px */ --fcmc-fs-lead: 1.125rem; /* 18px */ --fcmc-fs-button: 1.1875rem; /* 19px = WCAG large text at 700 */ --fcmc-fs-h4: 1.25rem; --fcmc-fs-h3: clamp(1.375rem, 1.1rem + 0.9vw, 1.75rem); --fcmc-fs-h2: clamp(1.75rem, 1.2rem + 2vw, 2.75rem); --fcmc-fs-h1: clamp(2.25rem, 1.3rem + 3.6vw, 4.25rem); --fcmc-lh-body: 1.65; --fcmc-lh-cjk: 1.85; --fcmc-track-label: 0.16em; --fcmc-track-tight: -0.02em; /* Space (4px base) */ --fcmc-s-1: 4px; --fcmc-s-2: 8px; --fcmc-s-3: 12px; --fcmc-s-4: 16px; --fcmc-s-5: 24px; --fcmc-s-6: 32px; --fcmc-s-7: 48px; --fcmc-s-8: 64px; --fcmc-s-9: 96px; --fcmc-gutter: clamp(16px, 4vw, 48px); /* Geometry */ --fcmc-rule: 1px; --fcmc-rule-strong: 2px; --fcmc-radius: 0px; --fcmc-angle: 60deg; --fcmc-slant: 0.57735; /* 1 / tan(60°): horizontal run per unit of height */ --fcmc-measure: 68ch; /* Motion: short, mechanical */ --fcmc-ease: cubic-bezier(0.2, 0.7, 0.2, 1); --fcmc-dur: 180ms; --fcmc-dur-slow: 420ms; /* z-index scale */ --fcmc-z-header: 50; --fcmc-z-dropdown: 60; --fcmc-header-h: 72px; /* "Hidden 1" texture — authored SVG, hand-maintained here. Glyph (the brand "1": stem + 60° flag), 14×28 box: M6 0H12V28H6V7L2.4 13.2V6.2Z Tile: 6 columns × 4 rows, 40px column pitch, 46px row pitch, each row shifted 13px left; orange glyphs at (row,col) (0,1) (1,4) (2,0) (3,3). "-row" is a single row (orange at cols 1 and 4) for edge bands. */ --fcmc-pattern-one-carbon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='184' viewBox='0 0 240 184'%3E%3Cpath transform='translate(13 9)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(53 9)' fill='%23E94C25' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(93 9)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(133 9)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(173 9)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(213 9)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(0 55)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(40 55)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(80 55)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(120 55)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(160 55)' fill='%23E94C25' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(200 55)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(227 101)' fill='%23E94C25' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(-13 101)' fill='%23E94C25' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(27 101)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(67 101)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(107 101)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(147 101)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(187 101)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(214 147)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(14 147)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(54 147)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(94 147)' fill='%23E94C25' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(134 147)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(174 147)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3C/svg%3E"); --fcmc-pattern-one-navy: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='184' viewBox='0 0 240 184'%3E%3Cpath transform='translate(13 9)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(53 9)' fill='rgba(233,76,37,0.75)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(93 9)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(133 9)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(173 9)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(213 9)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(0 55)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(40 55)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(80 55)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(120 55)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(160 55)' fill='rgba(233,76,37,0.75)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(200 55)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(227 101)' fill='rgba(233,76,37,0.75)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(-13 101)' fill='rgba(233,76,37,0.75)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(27 101)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(67 101)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(107 101)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(147 101)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(187 101)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(214 147)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(14 147)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(54 147)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(94 147)' fill='rgba(233,76,37,0.75)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(134 147)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(174 147)' fill='rgba(247,247,247,0.08)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3C/svg%3E"); --fcmc-pattern-one-light: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='184' viewBox='0 0 240 184'%3E%3Cpath transform='translate(13 9)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(53 9)' fill='rgba(233,76,37,0.3)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(93 9)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(133 9)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(173 9)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(213 9)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(0 55)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(40 55)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(80 55)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(120 55)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(160 55)' fill='rgba(233,76,37,0.3)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(200 55)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(227 101)' fill='rgba(233,76,37,0.3)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(-13 101)' fill='rgba(233,76,37,0.3)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(27 101)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(67 101)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(107 101)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(147 101)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(187 101)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(214 147)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(14 147)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(54 147)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(94 147)' fill='rgba(233,76,37,0.3)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(134 147)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(174 147)' fill='rgba(33,60,98,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3C/svg%3E"); --fcmc-pattern-one-carbon-row: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='46' viewBox='0 0 240 46'%3E%3Cpath transform='translate(13 9)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(53 9)' fill='rgba(233,76,37,0.55)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(93 9)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(133 9)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(173 9)' fill='rgba(233,76,37,0.55)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(213 9)' fill='%23263440' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3C/svg%3E"); --fcmc-pattern-one-navy-soft: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='184' viewBox='0 0 240 184'%3E%3Cpath transform='translate(13 9)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(53 9)' fill='rgba(233,76,37,0.5)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(93 9)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(133 9)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(173 9)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(213 9)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(0 55)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(40 55)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(80 55)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(120 55)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(160 55)' fill='rgba(233,76,37,0.5)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(200 55)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(227 101)' fill='rgba(233,76,37,0.5)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(-13 101)' fill='rgba(233,76,37,0.5)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(27 101)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(67 101)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(107 101)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(147 101)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(187 101)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(214 147)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(14 147)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(54 147)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(94 147)' fill='rgba(233,76,37,0.5)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(134 147)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3Cpath transform='translate(174 147)' fill='rgba(247,247,247,0.07)' d='M6 0H12V28H6V7L2.4 13.2V6.2Z'/%3E%3C/svg%3E"); } /* 02 — Elementor kit overrides ------------------------------------------- Every widget on the site reads these variables, so the palette and type change propagates without per-widget patches. Same selector as post-20.css and loaded later, so these win at every breakpoint. */ .elementor-kit-20 { --e-global-color-primary: var(--fcmc-navy); /* was #6EC1E4 */ --e-global-color-secondary: var(--fcmc-ink-700); /* was #54595F (body copy) */ --e-global-color-text: var(--fcmc-ink-600); /* was #7A7A7A */ --e-global-color-accent: var(--fcmc-orange); /* was #ED7051 */ --e-global-color-dea41e4: var(--fcmc-carbon); --e-global-color-a185853: var(--fcmc-orange); --e-global-color-308e809: var(--fcmc-ink-100); /* was #EDF1FC (blue tint) */ --e-global-color-a291686: var(--fcmc-paper); --e-global-color-91455cb: var(--fcmc-navy); /* hero + band surfaces → Crystal Navy */ --e-global-color-8c84c6a: var(--fcmc-carbon); --e-global-color-57a2dd9: var(--fcmc-orange); /* was #B63B1D gradient end → flat accent */ --e-global-typography-primary-font-family: "Outfit", "Noto Sans TC"; --e-global-typography-secondary-font-family: "Outfit", "Noto Sans TC"; --e-global-typography-text-font-family: "Outfit", "Noto Sans TC"; --e-global-typography-accent-font-family: "Outfit", "Noto Sans TC"; --e-global-typography-b2ce6af-font-family: "Outfit", "Noto Sans TC"; --e-global-typography-b2ce6af-font-size: var(--fcmc-fs-body); --e-global-typography-b2ce6af-line-height: var(--fcmc-lh-body); --e-global-typography-69c152f-font-family: "Outfit", "Noto Sans TC"; --e-global-typography-69c152f-font-size: 15px; --e-global-typography-69c152f-line-height: 1.6; --e-global-typography-520c191-font-family: "Outfit", "Noto Sans TC"; --e-global-typography-520c191-font-size: 14px; --e-global-typography-520c191-font-weight: 500; --e-global-typography-583e54c-font-family: "Outfit", "Noto Sans TC"; --e-global-typography-583e54c-font-size: var(--fcmc-fs-h1); --e-global-typography-583e54c-line-height: 1.04; --e-global-typography-583e54c-letter-spacing: var(--fcmc-track-tight); --e-global-typography-5d167aa-font-family: "Outfit", "Noto Sans TC"; --e-global-typography-5d167aa-font-size: var(--fcmc-fs-h2); --e-global-typography-5d167aa-line-height: 1.12; --e-global-typography-d3dae9a-font-family: "Outfit", "Noto Sans TC"; --e-global-typography-d3dae9a-font-size: var(--fcmc-fs-h3); --e-global-typography-d3dae9a-line-height: 1.25; --e-global-typography-83682a1-font-family: "Outfit", "Noto Sans TC"; --e-global-typography-83682a1-font-size: var(--fcmc-fs-h4); --e-global-typography-83682a1-line-height: 1.35; --e-global-typography-7044a64-font-family: "Outfit", "Noto Sans TC"; --e-global-typography-7044a64-font-size: 1.0625rem; --e-global-typography-7044a64-line-height: 1.45; --e-global-typography-84ca66e-font-family: "Outfit", "Noto Sans TC"; --e-global-typography-84ca66e-font-size: var(--fcmc-fs-label); --e-global-typography-84ca66e-line-height: 1.3; --e-global-typography-112b6c4-font-family: "Outfit", "Noto Sans TC"; --e-global-typography-112b6c4-font-size: 13px; --e-global-typography-112b6c4-font-weight: 400; color: var(--fcmc-ink-700); } .elementor-kit-20 a { color: var(--fcmc-carbon); } .elementor-kit-20 a:hover { color: var(--fcmc-orange-press); } .elementor-kit-20 e-page-transition { background-color: var(--fcmc-navy); } /* GeneratePress theme palette */ :root { --contrast: var(--fcmc-carbon); --contrast-2: var(--fcmc-ink-600); --contrast-3: var(--fcmc-ink-300); --base: var(--fcmc-ink-100); --base-2: var(--fcmc-white); --base-3: var(--fcmc-paper); --accent: var(--fcmc-orange); } /* 03 — Base + browser surfaces ------------------------------------------ */ html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; } body { background-color: var(--fcmc-white); color: var(--fcmc-ink-700); font-family: var(--fcmc-font-sans); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-feature-settings: "tnum" 0; overflow-x: clip; } :lang(zh) body, html[lang^="zh"] body { font-family: var(--fcmc-font-cjk); } /* One family everywhere: overrides the hard-coded Montserrat / Heebo / Roboto / Noto (!important) declarations left in per-post CSS. Icon fonts are set on their own elements and are not touched. */ body :is(h1, h2, h3, h4, h5, h6, p, li, dt, dd, blockquote, figcaption, label, .elementor-heading-title, .elementor-button, .elementor-item, .elementor-field, .elementor-field-textual, .elementor-icon-list-text, .elementskit-info-box-title, .elementskit-btn, .eael-entry-title, .eael-grid-post-excerpt, .elementor-post-info__item) { font-family: var(--fcmc-font-sans) !important; } html[lang^="zh"] body :is(h1, h2, h3, h4, h5, h6, p, li, label, .elementor-heading-title, .elementor-button, .elementor-item, .elementskit-info-box-title, .elementskit-btn) { font-family: var(--fcmc-font-sans) !important; /* Outfit for Latin, Noto Sans TC picks up CJK glyphs */ } ::selection { background: var(--fcmc-orange); color: var(--fcmc-on-accent); } html { caret-color: var(--fcmc-orange); accent-color: var(--fcmc-orange); scrollbar-color: var(--fcmc-ink-300) var(--fcmc-white); } a { text-underline-offset: 0.2em; text-decoration-thickness: 1px; } :focus { outline: none; } :focus-visible { outline: 2px solid var(--fcmc-orange); outline-offset: 2px; border-radius: 0; } img { border-radius: 0 !important; } time, .fcmc-num, td, .elementor-post-info__item--type-date { font-variant-numeric: tabular-nums; } /* Skip link: visible on keyboard focus */ .skip-link.screen-reader-text:focus { clip: auto !important; clip-path: none; width: auto; height: auto; position: fixed; top: 8px; left: 8px; z-index: 100000; background: var(--fcmc-carbon); color: var(--fcmc-on-dark); padding: 12px 16px; font: 600 14px/1 var(--fcmc-font-sans); outline: 2px solid var(--fcmc-orange); } /* Shared primitive: the 60° parallelogram marker */ .fcmc-bar, .fcmc-slogan__dash { display: inline-block; width: 2.75em; height: 0.42em; background: var(--fcmc-orange); clip-path: polygon(calc(0.42em * var(--fcmc-slant)) 0, 100% 0, calc(100% - 0.42em * var(--fcmc-slant)) 100%, 0 100%); vertical-align: middle; } /* 04 — Header / navigation ---------------------------------------------- */ .elementor-location-header > .elementor-top-section { background-color: var(--fcmc-carbon) !important; /* solid at every scroll position */ border-bottom: 1px solid var(--fcmc-rule-on-dark); box-shadow: none !important; } .elementor-location-header > .elementor-top-section > .elementor-motion-effects-container > .elementor-motion-effects-layer, .elementor-location-header > .elementor-top-section > .elementor-background-overlay { opacity: 1 !important; background-color: var(--fcmc-carbon) !important; background-image: none !important; } .elementor-location-header > .elementor-top-section > .elementor-container { min-height: 72px; } /* Logo: crisp, sized by height, breathing room on every viewport */ .elementor-location-header img[src*="fcmc-logo"] { height: 40px !important; width: auto !important; max-width: 100%; padding: 0; object-fit: contain; } .elementor-location-header .elementor-widget-image a { display: inline-block; padding: 14px 0; } /* Desktop menu: small tracked labels, orange 60° bar as the active/hover mark */ .elementor-location-header .elementor-nav-menu--main .elementor-item { position: relative; color: var(--fcmc-on-dark) !important; font-size: 14px !important; font-weight: 500 !important; letter-spacing: 0.02em !important; padding: 26px 0 !important; margin: 0 10px; white-space: nowrap; } .elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu { flex-wrap: nowrap; } .elementor-location-header .elementor-nav-menu--main .elementor-item::after { content: ""; position: absolute; left: 0; right: 0; bottom: 18px; height: 4px; background: var(--fcmc-orange); clip-path: polygon(2.3px 0, 100% 0, calc(100% - 2.3px) 100%, 0 100%); transform: scaleX(0); transform-origin: left center; transition: transform var(--fcmc-dur) var(--fcmc-ease); opacity: 1 !important; display: block !important; width: auto !important; top: auto !important; } .elementor-location-header .elementor-nav-menu--main .elementor-item:hover::after, .elementor-location-header .elementor-nav-menu--main .elementor-item:focus-visible::after, .elementor-location-header .elementor-nav-menu--main .elementor-item.elementor-item-active::after { transform: scaleX(1); } .elementor-location-header .elementor-nav-menu--main .elementor-item:hover, .elementor-location-header .elementor-nav-menu--main .elementor-item.elementor-item-active { color: var(--fcmc-on-accent) !important; } /* Header CTA never wraps */ .elementor-location-header .elementor-button { white-space: nowrap; } /* Header widgets never add Elementor's 20px stacking margin: the bar keeps one height (--fcmc-header-h) that the mobile dropdown can rely on. */ .elementor-location-header .elementor-widget:not(:last-child) { margin-block-end: 0 !important; } .elementor-location-header > .elementor-top-section > .elementor-container { min-height: var(--fcmc-header-h); } /* EN header (post-63) kept Elementor's 10px column padding, TW (post-586) has 0: zero both so EN and 中文 bars are the same height and the logo aligns */ .elementor-location-header > .elementor-top-section > .elementor-container > .elementor-column > .elementor-widget-wrap { padding: 0 !important; } @media (max-width: 1311px) { /* container is 1280px wide: below 1312px it would touch the viewport edge */ .elementor-location-header > .elementor-top-section > .elementor-container { padding-inline: 16px; } } /* Columns size to content instead of Elementor's 3 × 33% (all widths): the menu takes the free middle space, so it can never run into the CTA */ @media all { .elementor-location-header > .elementor-top-section > .elementor-container { flex-wrap: nowrap; gap: 16px; } .elementor-location-header > .elementor-top-section > .elementor-container > .elementor-column { width: auto !important; } .elementor-location-header > .elementor-top-section > .elementor-container > .elementor-column:nth-child(1) { flex: 0 0 auto; } .elementor-location-header > .elementor-top-section > .elementor-container > .elementor-column:nth-child(2) { flex: 1 1 auto; min-width: 0; } .elementor-location-header > .elementor-top-section > .elementor-container > .elementor-column:nth-child(3) { flex: 0 0 auto; } .elementor-location-header > .elementor-top-section > .elementor-container > .elementor-column:nth-child(3) > .elementor-widget-wrap { display: flex; flex-wrap: nowrap; align-items: center; gap: 12px; } .elementor-location-header > .elementor-top-section > .elementor-container > .elementor-column:nth-child(3) .elementor-widget { width: auto !important; margin: 0 !important; position: static !important; } .elementor-location-header .elementor-button { --fcmc-btn-cut: 11px; padding-inline: 14px 22px !important; } .elementor-location-header .cpel-switcher__lang a { padding: 6px 8px !important; } } /* 1280–1365: full menu, tightened so Careers keeps ≥16px from the CTA */ @media (min-width: 1280px) and (max-width: 1365px) { .elementor-location-header .elementor-nav-menu--main .elementor-item { margin: 0 7px; font-size: 13.5px !important; } } .elementor-location-header .elementor-nav-menu--dropdown, .elementor-location-header .elementor-nav-menu--dropdown .elementor-nav-menu { border-radius: 0 !important; } /* ≤1279: hamburger layout (Elementor's own switch is at 1024; extended here because logo + 7 items + CTA + language do not fit below 1280px). Order: logo | CTA + language | menu toggle */ @media (max-width: 1279px) { .elementor-location-header > .elementor-top-section > .elementor-container > .elementor-column:nth-child(1) { flex: 1 1 auto; min-width: 0; } .elementor-location-header > .elementor-top-section > .elementor-container > .elementor-column:nth-child(2) { flex: 0 0 auto; order: 3; } } @media (min-width: 1025px) and (max-width: 1279px) { .elementor-location-header .elementor-nav-menu--dropdown-tablet .elementor-nav-menu--main { display: none !important; } .elementor-location-header .elementor-nav-menu--dropdown-tablet .elementor-menu-toggle { display: flex !important; } .elementor-location-header .elementor-nav-menu--dropdown-tablet .elementor-nav-menu--dropdown { display: block !important; } } /* Language switcher: label pair, always horizontal */ .elementor-location-header .cpel-switcher__list { gap: 0; align-items: center; display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; } .elementor-location-header .cpel-switcher__lang { white-space: nowrap; } .elementor-location-header .cpel-switcher__lang a { font-family: var(--fcmc-font-sans) !important; font-size: 13px !important; font-weight: 500 !important; letter-spacing: 0.04em; color: var(--fcmc-on-dark-2) !important; padding: 6px 10px !important; } .elementor-location-header .cpel-switcher__lang + .cpel-switcher__lang a { border-left: 1px solid var(--fcmc-rule-on-dark); } .elementor-location-header .cpel-switcher__lang--active a { color: var(--fcmc-on-accent) !important; } .elementor-location-header .cpel-switcher__lang a:hover { color: var(--fcmc-orange) !important; } /* Mobile toggle + dropdown */ .elementor-location-header .elementor-menu-toggle { color: var(--fcmc-on-dark) !important; background: transparent !important; border: 1px solid var(--fcmc-rule-on-dark) !important; border-radius: 0 !important; width: 44px; height: 44px; font-size: 22px !important; align-items: center; justify-content: center; } .elementor-location-header .elementor-menu-toggle svg { fill: currentColor; } .elementor-location-header .elementor-menu-toggle.elementor-active { border-color: var(--fcmc-orange) !important; } .elementor-location-header .elementor-nav-menu--dropdown { background: var(--fcmc-carbon) !important; border-top: 2px solid var(--fcmc-orange); z-index: var(--fcmc-z-dropdown); max-width: 100vw; } .elementor-location-header .elementor-nav-menu--dropdown .elementor-item { color: var(--fcmc-on-dark) !important; background: transparent !important; font-size: 16px !important; font-weight: 500 !important; padding: 16px var(--fcmc-gutter) !important; border-bottom: 1px solid var(--fcmc-rule-on-dark) !important; display: flex !important; align-items: center; gap: 12px; } .elementor-location-header .elementor-nav-menu--dropdown .elementor-item::before { content: ""; flex: none; position: static !important; display: block !important; opacity: 1 !important; width: 18px; height: 5px; background: var(--fcmc-ink-600); clip-path: polygon(2.9px 0, 100% 0, calc(100% - 2.9px) 100%, 0 100%); } .elementor-location-header .elementor-nav-menu--dropdown .elementor-item.elementor-item-active::before, .elementor-location-header .elementor-nav-menu--dropdown .elementor-item:hover::before { background: var(--fcmc-orange); } .elementor-location-header .elementor-nav-menu--dropdown .elementor-item.elementor-item-active { color: var(--fcmc-on-accent) !important; } .elementor-location-header .M-lang-eng, li.M-lang-eng { border-top: 0 !important; } /* Open dropdown: full-width sheet pinned directly under the header bar */ @media (max-width: 1279px) { .elementor-location-header .elementor-nav-menu--dropdown.elementor-nav-menu__container { position: fixed !important; top: var(--fcmc-header-h, 72px) !important; left: 0 !important; right: 0 !important; width: 100% !important; margin: 0 !important; } .elementor-location-header .elementor-menu-toggle.elementor-active + .elementor-nav-menu--dropdown { max-height: calc(100dvh - var(--fcmc-header-h, 72px)) !important; overflow-y: auto !important; } } /* Closed dropdown must not widen the page on mobile */ .elementor-location-header .elementor-nav-menu--dropdown[aria-hidden="true"] { overflow: hidden; } .elementor-location-header .elementor-widget-nav-menu { min-width: 0; } /* 05 — Buttons ------------------------------------------------------------- Solid Molten Orange, square, right edge cut at 60°. Hover wipes a darker orange in along the same 60° line. Contrast: white on #E94C25 is 3.80:1, so every label is WCAG *large text* (19px / 700). The 60° shape is drawn on ::after, not with clip-path on the element, so the focus outline sits outside the shape and is never clipped. */ .elementor-kit-20 .elementor-button, .elementor-kit-20 button[type="submit"], .elementskit-infobox.text-center .elementskit-btn, .eael-post-elements-readmore-btn, .fcmc-btn { --fcmc-btn-cut: 13px; position: relative; isolation: isolate; display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 11px calc(22px + var(--fcmc-btn-cut) * 0.6) 11px 20px !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--fcmc-on-accent) !important; font-family: var(--fcmc-font-sans) !important; font-size: var(--fcmc-fs-button) !important; font-weight: 700 !important; letter-spacing: 0.01em !important; line-height: 1.2 !important; text-transform: none !important; white-space: nowrap; box-shadow: none !important; clip-path: none !important; text-decoration: none !important; /* Elementor animates "all": the focus ring must appear at full offset at once */ transition: color var(--fcmc-dur) linear !important; } .elementor-kit-20 .elementor-button::after, .elementor-kit-20 button[type="submit"]::after, .elementskit-infobox.text-center .elementskit-btn::after, .eael-post-elements-readmore-btn::after, .fcmc-btn::after { content: ""; position: absolute; inset: 0; z-index: -1; background-color: var(--fcmc-orange); background-image: linear-gradient(120deg, var(--fcmc-orange-press) 0 50%, transparent 50%); background-size: 260% 100%; background-position: 100% 0; clip-path: polygon(0 0, 100% 0, calc(100% - var(--fcmc-btn-cut)) 100%, 0 100%); transition: background-position var(--fcmc-dur-slow) var(--fcmc-ease); } .elementskit-infobox.text-center .elementskit-btn::before { display: none !important; } .elementor-kit-20 .elementor-button:is(:hover, :focus-visible)::after, .elementor-kit-20 button[type="submit"]:is(:hover, :focus-visible)::after, .elementskit-infobox.text-center .elementskit-btn:is(:hover, :focus-visible)::after, .eael-post-elements-readmore-btn:is(:hover, :focus-visible)::after, .fcmc-btn:is(:hover, :focus-visible)::after { background-position: 0 0; } .elementor-kit-20 .elementor-button:hover, .elementor-kit-20 button[type="submit"]:hover, .elementskit-infobox.text-center .elementskit-btn:hover, .eael-post-elements-readmore-btn:hover, .fcmc-btn:hover { color: var(--fcmc-on-accent) !important; } .elementor-kit-20 .elementor-button:focus-visible, .elementor-kit-20 button[type="submit"]:focus-visible, .elementskit-infobox.text-center .elementskit-btn:focus-visible, .eael-post-elements-readmore-btn:focus-visible, .fcmc-btn:focus-visible { outline: 2px solid var(--fcmc-focus-ring, var(--fcmc-carbon)) !important; outline-offset: 3px !important; } /* On dark surfaces the ring flips to Clean White */ :is(.elementor-location-header, .elementor-location-footer, .fcmc-hero, .fcmc-band--navy) :is(.elementor-button, button[type="submit"]) { --fcmc-focus-ring: var(--fcmc-on-dark); } /* Rare : no pseudo-elements possible, keep a flat block */ .elementor-kit-20 input[type="submit"] { background: var(--fcmc-orange) !important; color: var(--fcmc-on-accent) !important; border: 0 !important; border-radius: 0 !important; font: 700 var(--fcmc-fs-button)/1.2 var(--fcmc-font-sans) !important; min-height: 48px; padding: 11px 22px !important; } .elementor-button .elementor-button-text { font: inherit; } .elementor-kit-20 .elementor-button.elementor-size-lg { min-height: 52px; } .elementor-kit-20 button[disabled]::after, .elementor-kit-20 .elementor-button[aria-disabled="true"]::after { background-color: var(--fcmc-ink-300); background-image: none; } .elementor-kit-20 button[disabled] { cursor: not-allowed; } /* 06 — Headings, eyebrows, body copy ------------------------------------- */ .elementor-widget-heading :is(h1, h2, h3).elementor-heading-title { font-weight: 700 !important; letter-spacing: var(--fcmc-track-tight) !important; text-wrap: balance; } html[lang^="zh"] .elementor-widget-heading :is(h1, h2, h3).elementor-heading-title { letter-spacing: 0.01em !important; } /* zh per-post CSS hard-codes 40–48px headings at every width: put 中文 on the same token scale as EN */ html[lang^="zh"] .elementor-widget-heading h2.elementor-heading-title { font-size: var(--fcmc-fs-h2) !important; line-height: 1.2 !important; } html[lang^="zh"] .elementor-widget-heading h3.elementor-heading-title { font-size: var(--fcmc-fs-h3) !important; line-height: 1.3 !important; } html[lang^="zh"] .elementor-widget-heading h4.elementor-heading-title { font-size: var(--fcmc-fs-h4) !important; line-height: 1.4 !important; } html[lang^="zh"] .elementor-widget-heading h5.elementor-heading-title { font-size: 1.0625rem !important; line-height: 1.5 !important; } .elementor-widget-heading h2.elementor-heading-title { line-height: 1.12 !important; } .elementor-widget-heading :is(h4, h5).elementor-heading-title { font-weight: 600 !important; letter-spacing: 0 !important; } /* Eyebrow label: orange 60° parallelogram + small tracked label, as in the brand deck ("▰ 品牌色彩"). Label stays Carbon/ink for contrast; orange is only the marker. */ .elementor-widget-heading h6.elementor-heading-title, .fcmc-eyebrow { display: inline-flex; align-items: center; gap: 12px; font-size: var(--fcmc-fs-label) !important; font-weight: 600 !important; letter-spacing: var(--fcmc-track-label) !important; text-transform: uppercase !important; line-height: 1.3 !important; color: var(--fcmc-ink-600) !important; } html[lang^="zh"] .elementor-widget-heading h6.elementor-heading-title { letter-spacing: 0.12em !important; font-size: 13px !important; } .elementor-widget-heading h6.elementor-heading-title::before, .fcmc-eyebrow::before { content: ""; flex: none; width: 34px; height: 7px; background: var(--fcmc-orange); clip-path: polygon(4px 0, 100% 0, calc(100% - 4px) 100%, 0 100%); } .elementor-widget-heading.elementor-widget__width-auto h6, .elementor-widget-heading [style*="center"] h6 { justify-content: center; } /* Body copy */ .elementor-widget-text-editor { font-size: var(--fcmc-fs-body); line-height: var(--fcmc-lh-body); } .elementor-widget-text-editor p { text-wrap: pretty; } html[lang^="zh"] .elementor-widget-text-editor, html[lang^="zh"] .elementor-widget-text-editor p { line-height: var(--fcmc-lh-cjk) !important; } .elementor-widget-text-editor strong { color: var(--fcmc-carbon); font-weight: 600; } .elementor-widget-text-editor ul { padding-left: 1.1em; } .elementor-widget-text-editor ul li::marker { color: var(--fcmc-orange); } /* Eyebrow inside a Navy hero (policy pages): on-dark label, and only one orange bar — the h6 marker replaces the h1 bar. */ .fcmc-hero .elementor-widget-heading h6.elementor-heading-title { color: var(--fcmc-on-dark-2) !important; } .elementor-1400 .fcmc-hero:has(h6.elementor-heading-title) h1.elementor-heading-title::before { display: none !important; } /* Old raster "1" texture overlays (bg_img*.png) -> authored SVG pattern */ [data-dce-background-overlay-image-url*="bg_img"] > .elementor-background-overlay { background-image: var(--fcmc-pattern-one-light) !important; background-size: 360px auto !important; background-repeat: repeat !important; opacity: 1 !important; /* only the empty upper-left corner (above the heading, left of the text) */ -webkit-mask-image: linear-gradient(90deg, #000 0, transparent 30%), linear-gradient(180deg, #000 0, transparent 120px); -webkit-mask-composite: source-in; mask-image: linear-gradient(90deg, #000 0, transparent 30%), linear-gradient(180deg, #000 0, transparent 120px); mask-composite: intersect; } /* 07 — Heroes ------------------------------------------------------------- The first section of every page. Crystal Navy surface; inner pages carry the "hidden 1" texture and a 60° diagonal cut into the photograph. */ .fcmc-hero { position: relative; isolation: isolate; } /* Inner-page hero (Navy text column + photo column) */ .fcmc-hero > .elementor-background-overlay { background-image: var(--fcmc-pattern-one-navy) !important; background-size: 360px auto !important; background-repeat: repeat !important; background-position: 0 0 !important; opacity: 1 !important; -webkit-mask-image: linear-gradient(180deg, #000 0, rgba(0,0,0,0.5) 22%, transparent 42%); mask-image: linear-gradient(180deg, #000 0, rgba(0,0,0,0.5) 22%, transparent 42%); } .fcmc-hero .elementor-widget-image img { clip-path: polygon(calc(var(--fcmc-hero-h, 80vh) * var(--fcmc-slant) * 0.35) 0, 100% 0, 100% 100%, 0 100%); filter: brightness(0.82) saturate(0.85) !important; } .fcmc-hero h1.elementor-heading-title { color: var(--fcmc-on-accent) !important; font-size: var(--fcmc-fs-h1) !important; line-height: 1.04 !important; } .fcmc-hero h1.elementor-heading-title::before { content: ""; display: block; width: 56px; height: 9px; margin-bottom: 28px; background: var(--fcmc-orange); clip-path: polygon(5.2px 0, 100% 0, calc(100% - 5.2px) 100%, 0 100%); } .fcmc-hero :is(h4, h5).elementor-heading-title, .fcmc-hero .elementor-widget-text-editor { color: var(--fcmc-on-dark-2) !important; font-weight: 400 !important; max-width: 40ch; } .fcmc-hero :is(h4, h5).elementor-heading-title { font-size: var(--fcmc-fs-lead) !important; line-height: 1.55 !important; } /* Home hero (photo background): diagonal Navy panel cuts across the photo at 60°, so the headline always sits on a solid brand surface. */ .fcmc-hero--photo > .elementor-background-overlay { -webkit-mask-image: none; mask-image: none; background-color: transparent !important; background-image: linear-gradient(120deg, var(--fcmc-scrim-navy) 0 52%, var(--fcmc-scrim-carbon) 52% 100%) !important; background-size: 100% 100% !important; } .fcmc-hero--photo::after { /* orange 60° cut line riding the panel edge, like the business card */ content: ""; position: absolute; z-index: 1; pointer-events: none; left: 0; bottom: 0; width: min(46vw, 640px); height: 8px; background: var(--fcmc-orange); clip-path: polygon(0 0, 100% 0, calc(100% - 4.6px) 100%, 0 100%); } .fcmc-hero--photo .elementor-widget-text-editor { color: var(--fcmc-on-dark) !important; } .fcmc-hero--photo h1.elementor-heading-title { max-width: 12ch; } /* Article hero (single post): title over the featured image */ .fcmc-hero--article > .elementor-background-overlay { -webkit-mask-image: none; mask-image: none; background-color: var(--fcmc-scrim-navy-90) !important; background-image: none !important; opacity: 1 !important; } .fcmc-hero--article h1.elementor-heading-title { font-size: clamp(1.875rem, 1.2rem + 2.6vw, 3.25rem) !important; line-height: 1.1 !important; max-width: 24ch; margin-inline: auto; } .fcmc-hero--article h1.elementor-heading-title::before { margin-inline: auto; } /* 08 — Cards, tiles, spec sheets ------------------------------------------ */ /* Product / solution tiles ("Know More"): hairline sheet + index number */ .elementor-top-section:has(.elementskit-infobox.text-center .elementskit-btn) { counter-reset: fcmc-tile; } .elementskit-infobox.text-center:has(.elementskit-btn) { counter-increment: fcmc-tile; position: relative; background: var(--fcmc-paper) !important; border: 1px solid var(--fcmc-ink-200) !important; border-radius: 0 !important; box-shadow: none !important; padding: 56px 28px 32px !important; transition: border-color var(--fcmc-dur) linear; overflow: hidden; } .elementskit-infobox.text-center:has(.elementskit-btn)::before { content: counter(fcmc-tile, decimal-leading-zero); position: absolute; top: 16px; left: 18px; font: 500 12px/1 var(--fcmc-font-mono); letter-spacing: 0.08em; color: var(--fcmc-ink-500); font-variant-numeric: tabular-nums; } .elementskit-infobox.text-center:has(.elementskit-btn)::after { /* orange 60° bar wipes in along the top edge on hover */ content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--fcmc-orange); transform: scaleX(0); transform-origin: left; transition: transform var(--fcmc-dur-slow) var(--fcmc-ease); } .elementskit-infobox.text-center:has(.elementskit-btn):hover { border-color: var(--fcmc-carbon) !important; } .elementskit-infobox.text-center:has(.elementskit-btn):hover::after, .elementskit-infobox.text-center:has(.elementskit-btn):focus-within::after { transform: scaleX(1); } .elementskit-infobox.text-center:has(.elementskit-btn) .elementskit-info-box-title { color: var(--fcmc-carbon) !important; font-size: 1.125rem !important; font-weight: 600 !important; letter-spacing: 0 !important; } .elementskit-infobox.text-center:has(.elementskit-btn) .elementskit-info-box-icon img { width: 72px !important; height: 72px !important; object-fit: contain; } .elementskit-infobox .icon-hover { display: none !important; } .elementskit-infobox.text-center .elementskit-btn { --fcmc-btn-cut: 12px; min-height: 44px; padding: 9px 28px 9px 18px !important; } /* Info boxes without a button (contact details, features): flat sheets */ .elementskit-infobox { box-shadow: none !important; } .elementskit-infobox.text-center:not(:has(.elementskit-btn)) { background: var(--fcmc-paper) !important; border: 1px solid var(--fcmc-ink-200) !important; border-radius: 0 !important; } /* Feature / mission boxes (icon-left text boxes) */ .elementskit-infobox:not(.text-center) { border-radius: 0 !important; box-shadow: none !important; } .elementskit-info-box-icon { border-radius: 0 !important; } .elementskit-infobox:not(.text-center) .elementskit-info-box-title { font-weight: 600 !important; color: var(--fcmc-carbon) !important; letter-spacing: 0 !important; } /* Gas spec cards (special-gas): engineering spec sheet */ .elementskit-infobox.icon-lef-right-aligin:has(.elementskit-info-box-icon svg) { background: var(--fcmc-paper) !important; border: 1px solid var(--fcmc-ink-200) !important; border-radius: 0 !important; box-shadow: none !important; padding: 20px 20px 18px !important; height: 100%; } .elementskit-infobox.icon-lef-right-aligin:has(.elementskit-info-box-icon svg) .elementskit-info-box-title { font-size: 1.25rem !important; font-weight: 700 !important; color: var(--fcmc-carbon) !important; padding-bottom: 10px; margin-bottom: 10px !important; border-bottom: 1px solid var(--fcmc-ink-200); } .elementskit-infobox.icon-lef-right-aligin:has(.elementskit-info-box-icon svg) .box-body p { font-family: var(--fcmc-font-mono) !important; font-size: 13px !important; line-height: 1.75 !important; color: var(--fcmc-ink-700) !important; font-variant-numeric: tabular-nums; letter-spacing: 0; } /* Generic white "sheet" containers: Elementor drew them with soft drop shadows; on the spec-sheet grid they become flat sheets with a hairline. */ .elementor-element > .elementor-element-populated, .elementor-section.elementor-element, .elementor-widget-container { box-shadow: none !important; border-radius: 0 !important; } /* About: text sitting over the dotted world map gets a Clean White backing */ @media (min-width: 768px) { [data-dce-background-overlay-image-url*="dot_map"] :is(.elementor-widget-heading, .elementor-widget-text-editor) .elementor-widget-container { display: inline-block; background: var(--fcmc-plate-white); padding: 6px 14px; } } /* Policy pages (sustainability, workplace statement — post-1400.css) */ .elementor-1400 :is(.pol-doc-more, .pol-article-num, .pol-conduct b, .pol-contact-item em, .pol-contact-item strong, .pol-sign-date, .pol-sign-date span, [class^="pol-sign"], [class*=" pol-sign"]) { font-family: var(--fcmc-font-sans) !important; } .elementor-1400 :is(a.pol-doc, .pol-doc-icon, .pol-conduct li, .pol-conduct i, .pol-contact, .pol-contact-item, .pol-contact-item i, .pol-callout) { border-radius: 0 !important; } .elementor-1400 :is(a.pol-doc, .pol-conduct li):hover { box-shadow: none !important; transform: none !important; border-color: var(--fcmc-carbon) !important; } /* small orange text on light -> darker press orange (≥4.5:1) */ .elementor-1400 .pol-doc-more { color: var(--fcmc-orange-press) !important; border-bottom-color: currentColor !important; } .elementor-1400 .pol-article-num { color: var(--fcmc-orange-press) !important; font-variant-numeric: tabular-nums; } /* small orange label on Navy -> on-dark text, orange stays in the icon */ .elementor-1400 .pol-contact-item em { color: var(--fcmc-on-dark-2) !important; letter-spacing: 0.12em; } /* 09 — News list + articles ------------------------------------------------ */ .eael-post-grid-container { --fcmc-card-pad: 22px; } .eael-grid-post-holder { background: var(--fcmc-paper) !important; border: 1px solid var(--fcmc-ink-200) !important; border-radius: 0 !important; box-shadow: none !important; transition: border-color var(--fcmc-dur) linear; } .eael-grid-post-holder:hover { border-color: var(--fcmc-carbon) !important; } .eael-grid-post .eael-entry-media img { border-radius: 0 !important; aspect-ratio: 16 / 10; object-fit: cover; } .eael-grid-post .eael-entry-overlay { background: var(--fcmc-scrim-navy-72) !important; } .eael-grid-post .eael-entry-title, .eael-grid-post .eael-entry-title a { font-size: 1.125rem !important; font-weight: 600 !important; line-height: 1.3 !important; letter-spacing: -0.005em !important; color: var(--fcmc-carbon) !important; text-wrap: balance; } .eael-grid-post .eael-entry-title a:hover { color: var(--fcmc-orange-press) !important; } .eael-grid-post .eael-grid-post-excerpt p { color: var(--fcmc-ink-600) !important; font-size: 14px !important; line-height: 1.65 !important; } .eael-grid-post .eael-entry-meta, .eael-grid-post .eael-posted-on, .eael-grid-post .eael-entry-meta * { font-family: var(--fcmc-font-mono) !important; font-size: 12px !important; letter-spacing: 0.06em; text-transform: uppercase; color: var(--fcmc-ink-500) !important; font-variant-numeric: tabular-nums; } html[lang^="zh"] .eael-grid-post .eael-grid-post-excerpt p { line-height: 1.85 !important; } /* Article body: readable measure */ .elementor-widget-theme-post-content { max-width: var(--fcmc-measure); margin-inline: auto; font-size: 1.0625rem; line-height: 1.75; color: var(--fcmc-ink-700); } html[lang^="zh"] .elementor-widget-theme-post-content { line-height: var(--fcmc-lh-cjk); max-width: 40em; } .elementor-widget-theme-post-content p { margin-bottom: 1.15em; text-wrap: pretty; } .elementor-widget-theme-post-content :is(h2, h3, h4) { color: var(--fcmc-carbon); font-weight: 700; letter-spacing: -0.01em; margin: 2em 0 0.6em; line-height: 1.25; } .elementor-widget-theme-post-content p > strong:only-child, .elementor-widget-theme-post-content p > b:only-child { display: block; margin-top: 2.2em; padding-top: 14px; border-top: 1px solid var(--fcmc-ink-200); font-size: 1.1875rem; color: var(--fcmc-carbon); letter-spacing: -0.005em; } .elementor-widget-theme-post-content :is(ul, ol) { padding-left: 1.2em; margin-bottom: 1.2em; } .elementor-widget-theme-post-content li::marker { color: var(--fcmc-orange); } .elementor-widget-theme-post-content a { color: var(--fcmc-navy); text-decoration: underline; } .elementor-widget-theme-post-featured-image img { width: 100%; border: 1px solid var(--fcmc-ink-200); } .elementor-widget-post-info .elementor-icon-list-text, .elementor-widget-post-info .elementor-post-info__item { font-family: var(--fcmc-font-mono) !important; font-size: 12px !important; letter-spacing: 0.08em; text-transform: uppercase; color: var(--fcmc-on-dark-2) !important; } .elementor-widget-post-info .elementor-icon-list-icon { color: var(--fcmc-orange) !important; } .elementor-share-btn { border-radius: 0 !important; background-color: var(--fcmc-carbon) !important; } .elementor-share-btn:hover { background-color: var(--fcmc-orange) !important; } /* 10 — Forms --------------------------------------------------------------- */ .elementor-kit-20 .elementor-form .elementor-field-label, .elementor-field-group > label { font-size: 12px !important; font-weight: 600 !important; letter-spacing: 0.12em !important; text-transform: uppercase; color: var(--fcmc-ink-700) !important; margin-bottom: 8px !important; } .elementor-kit-20 input:not([type="button"]):not([type="submit"]):not([type="checkbox"]):not([type="radio"]), .elementor-kit-20 textarea, .elementor-kit-20 select, .elementor-kit-20 .elementor-field-textual { background-color: var(--fcmc-paper) !important; color: var(--fcmc-carbon) !important; border: 1px solid var(--fcmc-ink-300) !important; border-radius: 0 !important; min-height: 48px; padding: 12px 14px !important; font-size: 15px !important; box-shadow: none !important; transition: border-color var(--fcmc-dur) linear, box-shadow var(--fcmc-dur) linear; } .elementor-kit-20 input::placeholder, .elementor-kit-20 textarea::placeholder { color: var(--fcmc-ink-500); opacity: 1; } .elementor-kit-20 input:not([type="button"]):not([type="submit"]):not([type="checkbox"]):not([type="radio"]):hover, .elementor-kit-20 textarea.elementor-field:hover, .elementor-kit-20 select.elementor-field:hover { border-color: var(--fcmc-ink-600) !important; } /* Focus: Carbon border + Molten Orange underline bar; keyboard focus adds a ring. Selectors mirror the base rule's specificity so they win. */ .elementor-kit-20 input:not([type="button"]):not([type="submit"]):not([type="checkbox"]):not([type="radio"]):focus, .elementor-kit-20 textarea.elementor-field:not([type="button"]):not([type="submit"]):not([type="checkbox"]):focus, .elementor-kit-20 select.elementor-field:not([type="button"]):not([type="submit"]):not([type="checkbox"]):focus { border-color: var(--fcmc-carbon) !important; box-shadow: inset 0 -3px 0 var(--fcmc-orange) !important; background-color: var(--fcmc-on-accent) !important; outline: none !important; } .elementor-kit-20 input:not([type="button"]):not([type="submit"]):not([type="checkbox"]):not([type="radio"]):focus-visible, .elementor-kit-20 textarea.elementor-field:not([type="button"]):not([type="submit"]):not([type="checkbox"]):focus-visible, .elementor-kit-20 select.elementor-field:not([type="button"]):not([type="submit"]):not([type="checkbox"]):focus-visible { outline: 2px solid var(--fcmc-orange) !important; outline-offset: 2px !important; } .elementor-field-group .elementor-select-wrapper::before { color: var(--fcmc-carbon) !important; } .elementor-form .elementor-field-type-submit .elementor-button { width: 100%; --fcmc-btn-cut: 16px; } .elementor-message.elementor-message-danger, .elementor-field-group .elementor-message-danger { color: var(--fcmc-error) !important; } .elementor-message.elementor-message-success { color: var(--fcmc-navy) !important; } .elementor-kit-20 .elementor-field-group.elementor-error :is(input, textarea, select).elementor-field:not([type="button"]):not([type="submit"]):not([type="checkbox"]):not([type="radio"]) { border-color: var(--fcmc-error) !important; } /* 11 — Contact bands (class-based replacements for former inline blocks) ---- */ .fcmc-band { padding: clamp(56px, 8vw, 96px) var(--fcmc-gutter); position: relative; } .fcmc-band--navy { /* Carbon, not Navy: this band sits directly above the Navy footer CTA */ background-color: var(--fcmc-carbon); color: var(--fcmc-on-dark); } .fcmc-band--light { background: var(--fcmc-white); border-top: 1px solid var(--fcmc-ink-200); } .fcmc-contact__inner { max-width: 1180px; margin: 0 auto; } .fcmc-contact__head { display: grid; gap: 16px; margin-bottom: clamp(32px, 5vw, 56px); max-width: 640px; } .fcmc-band--navy .fcmc-eyebrow { color: var(--fcmc-on-dark-2) !important; } .fcmc-contact__title { margin: 0; font-size: var(--fcmc-fs-h2); font-weight: 700; line-height: 1.12; letter-spacing: var(--fcmc-track-tight); color: inherit; text-wrap: balance; } .fcmc-band--navy .fcmc-contact__title { color: var(--fcmc-on-accent); } .fcmc-band--light .fcmc-contact__title { color: var(--fcmc-carbon); } .fcmc-contact__lead { margin: 0; color: var(--fcmc-on-dark-2); font-size: var(--fcmc-fs-lead); line-height: 1.6; max-width: 52ch; } .fcmc-contact__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0; border-top: 1px solid var(--fcmc-rule-on-dark); border-left: 1px solid var(--fcmc-rule-on-dark); } .fcmc-contact__card { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 16px; row-gap: 6px; align-items: start; padding: 28px 24px; border-right: 1px solid var(--fcmc-rule-on-dark); border-bottom: 1px solid var(--fcmc-rule-on-dark); color: inherit; text-decoration: none !important; position: relative; transition: background-color var(--fcmc-dur) linear; } a.fcmc-contact__card:hover { background-color: var(--fcmc-tint-on-dark); } a.fcmc-contact__card::after { content: ""; position: absolute; left: 0; bottom: -1px; height: 3px; width: 100%; background: var(--fcmc-orange); transform: scaleX(0); transform-origin: left; transition: transform var(--fcmc-dur-slow) var(--fcmc-ease); } a.fcmc-contact__card:hover::after, a.fcmc-contact__card:focus-visible::after { transform: scaleX(1); } .fcmc-contact__icon { grid-row: 1 / span 2; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; border: 1px solid currentColor; color: var(--fcmc-orange); } .fcmc-contact__icon svg { width: 20px; height: 20px; stroke: currentColor; } .fcmc-contact__label { margin: 0; font-size: 12px !important; font-weight: 600 !important; letter-spacing: 0.14em !important; text-transform: uppercase; color: var(--fcmc-on-dark-2) !important; line-height: 1.4 !important; } .fcmc-contact__value { margin: 0; font-size: 16px; line-height: 1.55; color: var(--fcmc-on-accent); font-weight: 500; } .fcmc-contact__value--num { font-family: var(--fcmc-font-mono) !important; font-size: 15px; font-variant-numeric: tabular-nums; } .fcmc-contact__arrow { display: none; } /* Light variant (contact page "Get in touch") */ .fcmc-band--light .fcmc-contact__inner { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(32px, 6vw, 80px); align-items: center; } .fcmc-band--light .fcmc-contact__head { margin-bottom: 0; } .fcmc-band--light .fcmc-contact__grid { grid-template-columns: 1fr; border-color: var(--fcmc-ink-200); } .fcmc-band--light .fcmc-contact__card { border-color: var(--fcmc-ink-200); background: var(--fcmc-paper); align-items: center; grid-template-columns: auto 1fr auto; } .fcmc-band--light a.fcmc-contact__card:hover { background: var(--fcmc-paper); } .fcmc-band--light .fcmc-contact__label { color: var(--fcmc-ink-600) !important; } .fcmc-band--light .fcmc-contact__value { color: var(--fcmc-carbon); } .fcmc-band--light .fcmc-contact__arrow { display: block; grid-row: 1 / span 2; grid-column: 3; color: var(--fcmc-carbon); transition: transform var(--fcmc-dur) var(--fcmc-ease); } .fcmc-band--light a.fcmc-contact__card:hover .fcmc-contact__arrow { transform: translateX(4px); color: var(--fcmc-orange-press); } .fcmc-band--light .fcmc-contact__rule { width: 56px; height: 9px; background: var(--fcmc-orange); clip-path: polygon(5.2px 0, 100% 0, calc(100% - 5.2px) 100%, 0 100%); } @media (max-width: 860px) { .fcmc-band--light .fcmc-contact__inner { grid-template-columns: 1fr; } } /* 12 — Footer --------------------------------------------------------------- CTA band (Navy, diagonal cut) + Carbon Black base with the hidden "1" texture, reverse logo lockup and the slogan. */ .elementor-location-footer > .elementor-top-section:first-child { background-color: var(--fcmc-navy) !important; background-image: linear-gradient(120deg, transparent 0 62%, var(--fcmc-navy-deep) 62% 100%) !important; padding-block: clamp(48px, 6vw, 72px) !important; border-top: 0; } .elementor-location-footer > .elementor-top-section:first-child h2.elementor-heading-title { color: var(--fcmc-on-accent) !important; font-size: var(--fcmc-fs-h2) !important; } .elementor-location-footer > .elementor-top-section:first-child .elementor-widget-text-editor { color: var(--fcmc-on-dark-2) !important; } .elementor-location-footer > .elementor-top-section:last-child { background-color: var(--fcmc-carbon) !important; /* one whole row of "1"s in the top padding band; nothing clipped at edges */ background-image: var(--fcmc-pattern-one-carbon-row) !important; background-size: 240px 46px !important; background-repeat: repeat-x !important; background-position: 0 14px !important; padding-block: 72px 40px !important; } .elementor-location-footer > .elementor-top-section:last-child > .elementor-background-overlay { display: none !important; } .elementor-location-footer > .elementor-top-section:last-child > .elementor-container { background: var(--fcmc-carbon); padding: clamp(28px, 4vw, 48px) clamp(20px, 4vw, 48px); } .elementor-location-footer img[src*="fcmc-logo"] { width: min(380px, 100%) !important; height: auto !important; padding: 0; box-sizing: border-box; } .elementor-location-footer > .elementor-top-section:last-child .elementor-widget-text-editor { color: var(--fcmc-on-dark-2) !important; } .elementor-location-footer > .elementor-top-section:last-child .elementor-widget-text-editor p { max-width: 60ch; margin-inline: auto; } .elementor-location-footer > .elementor-top-section:last-child .elementor-widget-heading .elementor-heading-title { color: var(--fcmc-ink-300) !important; font-family: var(--fcmc-font-mono) !important; font-size: 12px !important; letter-spacing: 0.08em !important; text-transform: uppercase; font-weight: 400 !important; padding-top: 20px; border-top: 1px solid var(--fcmc-rule-on-dark); line-height: 1.6 !important; } .fcmc-slogan { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 4px 0 0; font-family: var(--fcmc-font-cjk) !important; font-size: clamp(1.125rem, 0.9rem + 1vw, 1.5rem) !important; font-weight: 700 !important; letter-spacing: 0.12em; color: var(--fcmc-on-accent); line-height: 1.3; } .fcmc-slogan__dash { width: 2.1em; height: 0.36em; } /* 13 — Motion --------------------------------------------------------------- Elementor's entrance animations, retuned: short travel, quick ease-out, always from an already-legible state. Same names, defined later = wins. */ @keyframes fadeIn { from { opacity: 0.001; } to { opacity: 1; } } @keyframes fadeInDown { from { opacity: 0.001; transform: translate3d(0, -14px, 0); } to { opacity: 1; transform: none; } } @keyframes fadeInUp { from { opacity: 0.001; transform: translate3d(0, 14px, 0); } to { opacity: 1; transform: none; } } @keyframes fadeInLeft { from { opacity: 0.001; transform: translate3d(-8px, 14px, 0); } to { opacity: 1; transform: none; } } @keyframes fadeInRight { from { opacity: 0.001; transform: translate3d(8px, 14px, 0); } to { opacity: 1; transform: none; } } .elementor-element.animated { animation-duration: 520ms !important; animation-timing-function: var(--fcmc-ease) !important; } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; scroll-behavior: auto !important; } .elementor-invisible { visibility: visible !important; opacity: 1 !important; } } /* Responsive ---------------------------------------------------------------- */ @media (max-width: 767px) { :root { --fcmc-header-h: 64px; } .elementor-location-header > .elementor-top-section > .elementor-container { min-height: 64px; padding-inline: 16px; } .elementor-location-header img[src*="fcmc-logo"] { height: 30px !important; } .elementor-location-header .elementor-widget-image a { padding: 10px 0; } .fcmc-hero .elementor-widget-image img { clip-path: none; } .fcmc-hero:not(.fcmc-hero--photo):not(.fcmc-hero--article) > .elementor-background-overlay { background-image: none !important; } .fcmc-hero > .elementor-background-overlay { -webkit-mask-image: none; mask-image: none; } .fcmc-hero--photo > .elementor-background-overlay { background-image: linear-gradient(180deg, var(--fcmc-scrim-navy-90) 0 100%) !important; } .fcmc-hero--photo::after { width: 62vw; } .elementor-location-footer > .elementor-top-section:first-child { background-image: none !important; } .elementskit-infobox.text-center:has(.elementskit-btn) { padding: 48px 20px 28px !important; } .fcmc-slogan { letter-spacing: 0.08em; gap: 10px; } .elementor-location-footer > .elementor-top-section:last-child { padding-top: 48px !important; background-position: 0 4px !important; } .elementor-location-footer > .elementor-top-section:last-child .elementor-widget-text-editor, .elementor-location-footer > .elementor-top-section:last-child .elementor-widget-text-editor p { font-size: 14px !important; line-height: 1.6 !important; } .elementor-location-footer > .elementor-top-section:last-child .elementor-widget-heading .elementor-heading-title { font-size: 12px !important; } [data-dce-background-overlay-image-url*="bg_img"] > .elementor-background-overlay { background-image: none !important; } } /* 15 — Standalone documents (vendor.html: Supplier Code of Conduct) --------- The page keeps its own layout; its local variables are remapped to the brand palette in its inline