.elementor-103485 .elementor-element.elementor-element-ea1f875{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-103485 .elementor-element.elementor-element-ea1f875.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-103485 .elementor-element.elementor-element-8badd19{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-103485 .elementor-element.elementor-element-8badd19.e-con{--flex-grow:0;--flex-shrink:0;}@media(min-width:768px){.elementor-103485 .elementor-element.elementor-element-ea1f875{--width:100%;}.elementor-103485 .elementor-element.elementor-element-8badd19{--width:100%;}}/* Start custom CSS */@import url("https://fonts.googleapis.com"); @import url("https://fonts.googleapis.com/css2?family=Anton&family=Poppins:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400;1,600;1,700;1,800&family=Cormorant+Garamond:ital,wght@0,500;0,600;1,400;1,500&display=swap"); /* --- scoped reset (no bare tag body.elementor-page-103485s) --- */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa, .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa *, .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa *::before, .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa *::after { box-sizing: border-box !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa * { margin: 0 !important; padding: 0 !important; border: 0 !important; font: inherit !important; color: inherit !important; background: transparent !important; list-style: none !important; text-decoration: none !important; font-style: normal !important; vertical-align: baseline !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa ::selection { background: #D6F612 !important; color: #000 !important; } /* --- root: base typography + KAMAN + Orientana-bridge tokens --- */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa { font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif !important; font-weight: 400 !important; font-size: 16px !important; line-height: 1.55 !important; color: #000000 !important; background: #FFFFFF !important; -webkit-font-smoothing: antialiased !important; text-align: left !important; /* ------------------------------------------------------------------ COLORS — primary palette (from Brand book) ------------------------------------------------------------------ */ --kaman-lime: #D6F612 !important; /* Pantone 13-0630 TN — hero accent */ --kaman-black: #000000 !important; /* Process Black C */ --kaman-white: #FFFFFF !important; /* Supplementary palette */ --kaman-purple: #6600CD !important; /* Pantone 266 C */ --kaman-gray: #D7D5D7 !important; /* Pantone Cool Gray 2 C */ --kaman-navy: #050027 !important; /* Pantone 5395 C — near-black w/ blue */ /* Practical extensions (derived for UI surfaces; not in brand book) */ --kaman-bg-dark: #0E0E10 !important; /* canvas dark — slightly softer than pure black */ --kaman-bg-dark-2: #1A1A1D !important; /* card on dark */ --kaman-bg-light: #F2F1ED !important; /* canvas light — warm off-white seen in posts */ --kaman-bg-light-2: #FFFFFF !important; /* card on light */ --kaman-line-dark: #2A2A2E !important; /* hairline on dark */ --kaman-line-light: #E3E1DC !important; /* hairline on light */ /* Lime tints / shades — for hover, marker highlight */ --kaman-lime-marker: #E8FA7A !important; /* softer lime for text-highlight bg */ --kaman-lime-hover: #C2DF0F !important; --kaman-lime-press: #A8C30A; /* Signature gradient — purple → white → lime (three-stop, white midpoint) */ --kaman-gradient: linear-gradient(135deg, var(--kaman-purple) 0%, var(--kaman-white) 50%, var(--kaman-lime) 100%) !important; /* ------------------------------------------------------------------ SEMANTIC COLOR TOKENS — dark surface (default for KAMAN) ------------------------------------------------------------------ */ --bg: var(--kaman-bg-dark) !important; --bg-elevated: var(--kaman-bg-dark-2); --fg: var(--kaman-white); --fg-muted: #B7B5B0; /* the slightly desaturated gray on dark posts */ --fg-subtle: #6E6C68 !important; --accent: var(--kaman-lime); --accent-fg: var(--kaman-black); /* text ON lime is always black */ --hairline: var(--kaman-line-dark) !important; /* ------------------------------------------------------------------ TYPOGRAPHY — families ------------------------------------------------------------------ */ --font-display: "Anton", "Impact", "Oswald", system-ui, sans-serif !important; --font-sans: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif; --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace; /* Type scale (px) — tuned for the editorial / poster look of KAMAN posts */ --fs-xs: 12px !important; --fs-sm: 14px; --fs-base: 16px; --fs-md: 18px; --fs-lg: 22px; --fs-xl: 28px; --fs-2xl: 36px; --fs-3xl: 48px; --fs-4xl: 64px; --fs-5xl: 84px; --fs-6xl: 112px; /* Line heights */ --lh-tight: 1.04 !important; --lh-snug: 1.15; --lh-normal: 1.35; --lh-relaxed: 1.55; /* Letter spacing */ --tracking-tight: -0.02em !important; --tracking-normal: 0; --tracking-wide: 0.06em; --tracking-xwide: 0.18em; /* small-caps eyebrows like "MARKETING E-COMMERCE" */ /* Weights */ --fw-regular: 400 !important; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700; --fw-extra: 800; /* ------------------------------------------------------------------ SPACING — 4-pt scale ------------------------------------------------------------------ */ --s-0: 0 !important; --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px; --s-10: 128px; /* ------------------------------------------------------------------ RADII — slightly squarish; KAMAN cards/buttons use soft-but-firm corners ------------------------------------------------------------------ */ --r-xs: 4px !important; --r-sm: 8px; --r-md: 12px; /* default card */ --r-lg: 18px !important; /* CTA square arrow button */ --r-xl: 28px !important; --r-pill: 999px; /* pill CTAs */ /* ------------------------------------------------------------------ ELEVATION ------------------------------------------------------------------ */ --shadow-sm: 0 1px 2px rgba(0,0,0,0.08) !important; --shadow-md: 0 6px 18px rgba(0,0,0,0.18); --shadow-lg: 0 18px 48px rgba(0,0,0,0.28); --shadow-lime: 0 8px 28px rgba(214,246,18,0.35); /* Motion */ --ease-out: cubic-bezier(.16,.84,.32,1) !important; --ease-snap: cubic-bezier(.2,.7,.2,1.1); --t-fast: 120ms; --t-base: 200ms; --t-slow: 360ms; --bg: var(--kaman-bg-light-2); --bg-dark: var(--kaman-bg-dark); --bg-deep: var(--kaman-bg-dark-2); --bg-cream: var(--kaman-bg-light-2); --bg-cream-deep: var(--kaman-line-light); --text: var(--kaman-black); --text-muted: #5C5A55; --text-soft: #8C8A85; --text-on-dark: var(--kaman-white); --text-on-dark-muted: var(--fg-muted); --citron: var(--kaman-lime); --citron-deep: var(--kaman-lime-hover); --citron-soft: var(--kaman-lime-marker); /* Brand Orientana — zostaje TYLKO w .klient-visual */ --orient-green: #1F3A2C !important; --orient-peach: #E89561; --orient-peach-deep: #C66932; --orient-cream: #FBE8D9; /* Funkcyjne kolory redukowane do KAMAN */ --critical: var(--kaman-black) !important; --critical-bg: var(--kaman-line-light); --warning: #5C5A55; --warning-bg: var(--kaman-line-light); --success: var(--accent); --success-bg: var(--kaman-lime-marker); --border: var(--kaman-line-light); --border-dark: var(--kaman-line-light); --border-on-dark: var(--kaman-line-dark); --display: var(--font-sans); /* Poppins ExtraBold do nagłówków */ --sans: var(--font-sans) !important; --serif: 'Cormorant Garamond', Georgia, serif; } /* =========================================================== KAMAN! — Design Tokens Brand book sources: assets/Brand book.pdf Fonts: Anton (display, logotype), Poppins (UI/body) =========================================================== */ /* Light theme — applied on .theme-light or a light section */ /* ================================================================== SEMANTIC TYPE — apply to real elements ================================================================== */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .k-display, .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .k-h1 { font-family: var(--font-sans) !important; font-weight: var(--fw-extra) !important; font-size: var(--fs-4xl) !important; line-height: var(--lh-tight) !important; letter-spacing: var(--tracking-tight) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .k-logotype { font-family: var(--font-display) !important; font-weight: var(--fw-regular) !important; letter-spacing: 0 !important; text-transform: uppercase !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .k-h2 { font-family: var(--font-sans) !important; font-weight: var(--fw-bold) !important; font-size: var(--fs-3xl) !important; line-height: var(--lh-snug) !important; letter-spacing: var(--tracking-tight) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .k-h3 { font-family: var(--font-sans) !important; font-weight: var(--fw-bold) !important; font-size: var(--fs-2xl) !important; line-height: var(--lh-snug) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .k-h4 { font-family: var(--font-sans) !important; font-weight: var(--fw-semibold) !important; font-size: var(--fs-xl) !important; line-height: var(--lh-snug) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .k-subtitle { font-family: var(--font-sans) !important; font-weight: var(--fw-semibold) !important; font-size: var(--fs-lg) !important; line-height: var(--lh-normal) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .k-body { font-family: var(--font-sans) !important; font-weight: var(--fw-regular) !important; font-size: var(--fs-base) !important; line-height: var(--lh-relaxed) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .k-body-lg { font-family: var(--font-sans) !important; font-weight: var(--fw-regular) !important; font-size: var(--fs-md) !important; line-height: var(--lh-relaxed) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .k-small { font-family: var(--font-sans) !important; font-weight: var(--fw-regular) !important; font-size: var(--fs-sm) !important; line-height: var(--lh-normal) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .k-eyebrow { font-family: var(--font-sans) !important; font-weight: var(--fw-medium) !important; font-size: var(--fs-sm) !important; letter-spacing: var(--tracking-xwide) !important; text-transform: uppercase !important; color: var(--fg-muted) !important; } /* The signature "lime word highlight" — wrap inline */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .k-accent { color: var(--accent) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .k-marker { background: var(--accent) !important; color: var(--accent-fg) !important; padding: 0 0.18em !important; box-decoration-break: clone !important; -webkit-box-decoration-break: clone !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .k-marker-soft { background: var(--kaman-lime-marker) !important; color: var(--kaman-black) !important; padding: 0 0.18em !important; box-decoration-break: clone !important; -webkit-box-decoration-break: clone !important; } /* ========================================================== CASE STUDY · Orientana UX audit — KAMAN-aligned Buduje na tokenach z ../../KAMAN! Design System/colors_and_type.css Bridge layer mapuje tokeny Orientana (--citron, --bg-cream, --orient-peach itp.) na odpowiedniki KAMAN-owe. Tokeny --orient-* zostają — reprezentują brand Orientana w `.co-klient-visual` (artefakt klienta, nie strony case'a). ========================================================== */ /* === Bridge layer === */ /* === Reset === */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-container { max-width: 1280px !important; margin: 0 auto !important; padding: 0 40px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-container-wide { max-width: 1440px !important; margin: 0 auto !important; padding: 0 40px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-container-narrow { max-width: 920px !important; margin: 0 auto !important; padding: 0 40px !important; } /* === HERO === */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero { background: var(--kaman-bg-dark) !important; color: var(--kaman-white) !important; padding: 96px 0 96px !important; position: relative !important; overflow: hidden !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-meta { display: flex !important; align-items: center !important; gap: 16px !important; font-family: var(--font-sans) !important; font-weight: var(--fw-medium) !important; font-size: var(--fs-xs) !important; letter-spacing: var(--tracking-xwide) !important; text-transform: uppercase !important; color: var(--fg-muted) !important; margin-bottom: 32px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-meta-divider { width: 32px !important; height: 1px !important; background: var(--kaman-line-dark) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-meta-tag { display: inline-block !important; background: var(--kaman-black) !important; color: var(--accent) !important; padding: 5px 12px !important; border-radius: var(--r-pill) !important; font-weight: var(--fw-semibold) !important; font-size: 10.5px !important; letter-spacing: 0.12em !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-title { font-family: var(--font-sans) !important; font-weight: var(--fw-extra) !important; font-size: clamp(48px, 7.5vw, 108px) !important; line-height: 0.95 !important; letter-spacing: var(--tracking-tight) !important; color: var(--kaman-white) !important; margin-bottom: 32px !important; max-width: 14ch !important; } /* Em w nagłówku — accent na ciemnym tle */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-title-em { font-style: normal !important; font-weight: var(--fw-extra) !important; color: var(--accent) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-title .co-strike { position: relative !important; display: inline-block !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-title .co-strike::after { content: '' !important; position: absolute !important; left: -2% !important; right: -2% !important; top: 52% !important; height: 6px !important; background: var(--accent) !important; transform: rotate(-2deg) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-subtitle { font-size: clamp(18px, 1.6vw, 22px) !important; line-height: 1.5 !important; color: var(--fg-muted) !important; max-width: 720px !important; margin-bottom: 56px !important; font-weight: var(--fw-regular) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-subtitle-strong { color: var(--accent) !important; font-weight: var(--fw-semibold) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-meta-grid { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 0 !important; border-top: 1px solid var(--kaman-line-dark) !important; border-bottom: 1px solid var(--kaman-line-dark) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-meta-card { padding: 24px 28px 24px 0 !important; border-right: 1px solid var(--kaman-line-dark) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-meta-card:not(:first-child) { padding-left: 28px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-meta-card:last-child { border-right: none !important; padding-right: 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-meta-card-label { font-family: var(--font-sans) !important; font-weight: var(--fw-medium) !important; font-size: 10px !important; letter-spacing: var(--tracking-xwide) !important; text-transform: uppercase !important; color: var(--fg-muted) !important; margin-bottom: 10px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-meta-card-value { font-family: var(--font-sans) !important; font-weight: var(--fw-semibold) !important; font-size: var(--fs-md) !important; color: var(--kaman-white) !important; line-height: 1.3 !important; } /* === DISCLAIMER (nowy — wzorem Resibo/Vianek) === */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-disclaimer { background: var(--kaman-bg-light-2) !important; border-top: 1px solid var(--kaman-line-light) !important; border-bottom: 1px solid var(--kaman-line-light) !important; padding: 32px 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-disclaimer-row { max-width: 1280px !important; margin: 0 auto !important; padding: 0 40px !important; display: flex !important; gap: 20px !important; align-items: flex-start !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-disclaimer-icon { width: 36px !important; height: 36px !important; border: 1.5px solid var(--kaman-black) !important; background: transparent !important; color: var(--kaman-black) !important; border-radius: var(--r-pill) !important; display: flex !important; align-items: center !important; justify-content: center !important; font-family: var(--font-sans) !important; font-weight: var(--fw-bold) !important; font-size: 18px !important; flex-shrink: 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-disclaimer-text { font-size: var(--fs-sm) !important; line-height: 1.6 !important; color: #5C5A55 !important; max-width: 920px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-disclaimer-text-strong { font-weight: var(--fw-bold) !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-disclaimer-text-em { font-style: italic !important; color: var(--kaman-black) !important; } /* === STATS STRIP === */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stats-strip { background: var(--kaman-bg-light-2) !important; border-bottom: 1px solid var(--kaman-line-light) !important; padding: 96px 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stats-strip-header { text-align: center !important; margin-bottom: 56px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stats-strip-eyebrow { font-family: var(--font-sans) !important; font-weight: var(--fw-medium) !important; font-size: var(--fs-xs) !important; letter-spacing: var(--tracking-xwide) !important; text-transform: uppercase !important; color: #5C5A55 !important; margin-bottom: 16px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stats-strip-title { font-family: var(--font-sans) !important; font-weight: var(--fw-extra) !important; font-size: clamp(28px, 3.5vw, 44px) !important; line-height: 1.15 !important; letter-spacing: var(--tracking-tight) !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stats-strip-title-em { font-style: normal !important; background-color: transparent !important; background-image: linear-gradient( transparent 58%, var(--kaman-lime-marker) 58%, var(--kaman-lime-marker) 95%, transparent 95% ) !important; padding: 0 0.06em !important; box-decoration-break: clone !important; -webkit-box-decoration-break: clone !important; color: var(--kaman-black) !important; font-weight: var(--fw-extra) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stats-grid { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 0 !important; border-left: 1px solid var(--kaman-line-light) !important; border-radius: 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stat-card { padding: 36px 28px !important; border-right: 1px solid var(--kaman-line-light) !important; border-top: 1px solid var(--kaman-line-light) !important; border-bottom: 1px solid var(--kaman-line-light) !important; position: relative !important; background: var(--kaman-bg-light-2) !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stat-card.co-accent { background: var(--accent) !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stat-card.co-dark { background: var(--kaman-bg-dark) !important; color: var(--kaman-white) !important; border-color: var(--kaman-line-dark) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stat-num { font-family: var(--font-display) !important; /* Anton — duże liczby */ font-weight: var(--fw-regular) !important; font-size: clamp(56px, 6.5vw, 88px) !important; line-height: 0.9 !important; letter-spacing: 0 !important; margin-bottom: 12px !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stat-card.co-dark .co-stat-num { color: var(--accent) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stat-card.co-accent .co-stat-num { color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stat-num .co-small { font-family: var(--font-sans) !important; font-size: 0.4em !important; vertical-align: 0.5em !important; margin-left: 4px !important; font-weight: var(--fw-extra) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stat-num .co-pct { font-family: var(--font-sans) !important; font-size: 0.4em !important; vertical-align: 0.6em !important; margin-left: 2px !important; font-weight: var(--fw-extra) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stat-label { font-size: 13.5px !important; line-height: 1.4 !important; color: var(--kaman-black) !important; font-weight: var(--fw-semibold) !important; letter-spacing: -0.005em !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stat-card.co-dark .co-stat-label { color: var(--kaman-white) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stat-card.co-accent .co-stat-label { color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stat-meta { font-size: 11.5px !important; color: #5C5A55 !important; margin-top: 10px !important; letter-spacing: 0.02em !important; font-weight: var(--fw-regular) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stat-card.co-dark .co-stat-meta { color: var(--fg-muted) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stat-card.co-accent .co-stat-meta { color: rgba(0,0,0,0.65) !important; } /* === SECTION === */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .section { padding: 120px 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .section.co-compact { padding: 80px 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .section.co-cream { background: var(--kaman-bg-light-2) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .section.co-dark { background: var(--kaman-bg-dark) !important; color: var(--kaman-white) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-section-header { margin-bottom: 64px !important; max-width: 920px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-section-header.co-center { text-align: center !important; margin-left: auto !important; margin-right: auto !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-section-eyebrow { display: inline-flex !important; align-items: center !important; gap: 12px !important; font-family: var(--font-sans) !important; font-weight: var(--fw-medium) !important; font-size: var(--fs-xs) !important; letter-spacing: var(--tracking-xwide) !important; text-transform: uppercase !important; color: #5C5A55 !important; margin-bottom: 20px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-section-eyebrow::before { content: '' !important; width: 28px !important; height: 2px !important; background: var(--accent) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .section.co-dark .co-section-eyebrow { color: var(--fg-muted) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .section.co-dark .co-section-eyebrow::before { background: var(--accent) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-section-title { font-family: var(--font-sans) !important; font-weight: var(--fw-extra) !important; font-size: clamp(36px, 4.8vw, 64px) !important; line-height: 1.05 !important; letter-spacing: var(--tracking-tight) !important; margin-bottom: 24px !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .section.co-dark .co-section-title { color: var(--kaman-white) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-section-title-em { font-style: normal !important; font-weight: var(--fw-extra) !important; background-color: transparent !important; background-image: linear-gradient( transparent 58%, var(--kaman-lime-marker) 58%, var(--kaman-lime-marker) 95%, transparent 95% ) !important; padding: 0 0.06em !important; box-decoration-break: clone !important; -webkit-box-decoration-break: clone !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .section.co-dark .co-section-title-em { background: transparent !important; color: var(--accent) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-section-lead { font-size: 19px !important; line-height: 1.6 !important; color: #5C5A55 !important; max-width: 720px !important; font-weight: var(--fw-regular) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .section.co-dark .co-section-lead { color: var(--fg-muted) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-section-lead-strong { color: var(--kaman-black) !important; font-weight: var(--fw-bold) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .section.co-dark .co-section-lead-strong { color: var(--kaman-white) !important; } /* === KLIENT === */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-grid { display: grid !important; grid-template-columns: 1fr 1.4fr !important; gap: 64px !important; align-items: flex-start !important; } /* .co-klient-visual zachowuje brand Orientana (zielony+peach+cream) */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-visual { aspect-ratio: 1 !important; background: var(--orient-cream) !important; border-radius: var(--r-md) !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; position: relative !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-visual::before { content: '' !important; position: absolute !important; inset: 24px !important; border: 1px solid rgba(31, 58, 44, 0.12) !important; border-radius: var(--r-xs) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-visual-content { position: relative !important; z-index: 1 !important; text-align: center !important; color: var(--orient-peach-deep) !important; font-family: var(--serif) !important; font-style: italic !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-visual-flower { font-size: 80px !important; color: var(--orient-green) !important; font-style: normal !important; line-height: 1 !important; margin-bottom: 24px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-visual-name { font-size: 56px !important; line-height: 1 !important; letter-spacing: -0.015em !important; color: var(--orient-green) !important; margin-bottom: 12px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-visual-tagline { font-family: var(--font-sans) !important; font-style: normal !important; font-size: 11px !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; font-weight: var(--fw-medium) !important; color: var(--orient-peach-deep) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-text { padding-top: 8px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-text-p { font-size: var(--fs-md) !important; line-height: 1.65 !important; margin-bottom: 16px !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-text-p-strong { font-weight: var(--fw-bold) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-facts { display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 0 !important; margin-top: 32px !important; border-top: 1px solid var(--kaman-line-light) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-fact { padding: 18px 0 !important; border-bottom: 1px solid var(--kaman-line-light) !important; padding-right: 16px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-fact:nth-child(odd) { border-right: 1px solid var(--kaman-line-light) !important; padding-right: 16px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-fact:nth-child(even) { padding-left: 24px !important; padding-right: 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-fact-label { font-family: var(--font-sans) !important; font-weight: var(--fw-medium) !important; font-size: 10.5px !important; letter-spacing: var(--tracking-xwide) !important; text-transform: uppercase !important; color: #5C5A55 !important; margin-bottom: 6px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-fact-value { font-family: var(--font-sans) !important; font-size: 17px !important; font-weight: var(--fw-semibold) !important; line-height: 1.3 !important; color: var(--kaman-black) !important; } /* === DIAGNOZA / PROBLEMS === */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-problems-list { display: grid !important; gap: 0 !important; border-top: 1px solid var(--kaman-line-light) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-problem { display: grid !important; grid-template-columns: 80px 120px 1fr 200px !important; gap: 32px !important; padding: 36px 8px !important; border-bottom: 1px solid var(--kaman-line-light) !important; align-items: flex-start !important; transition: background var(--t-base) var(--ease-out) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-problem-num { font-family: var(--font-display) !important; font-weight: var(--fw-regular) !important; font-size: 64px !important; line-height: 0.85 !important; letter-spacing: 0 !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-problem-priority { display: flex !important; flex-direction: column !important; gap: 8px !important; align-items: flex-start !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-pri-pill { display: inline-block !important; padding: 4px 10px !important; border-radius: var(--r-pill) !important; font-family: var(--font-sans) !important; font-size: 10.5px !important; letter-spacing: var(--tracking-xwide) !important; text-transform: uppercase !important; font-weight: var(--fw-semibold) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-pri-pill.co-crit { background: var(--kaman-black) !important; color: var(--accent) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-pri-pill.co-high { background: var(--kaman-black) !important; color: var(--kaman-white) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-pri-pill.co-med { background: transparent !important; color: #5C5A55 !important; border: 1px solid #8C8A85 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-pri-ref { font-family: var(--font-sans) !important; font-size: 10.5px !important; color: #5C5A55 !important; font-weight: var(--fw-medium) !important; letter-spacing: 0.06em !important; background: var(--kaman-bg-light-2) !important; padding: 3px 8px !important; border-radius: var(--r-xs) !important; border: 1px solid var(--kaman-line-light) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-problem-content { padding-top: 4px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-problem-title { font-family: var(--font-sans) !important; font-size: 22px !important; font-weight: var(--fw-extra) !important; line-height: 1.25 !important; letter-spacing: var(--tracking-tight) !important; margin-bottom: 10px !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-problem-desc { font-size: 14.5px !important; line-height: 1.6 !important; color: #5C5A55 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-problem-desc-strong { color: var(--kaman-black) !important; font-weight: var(--fw-bold) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-problem-desc-em { font-style: italic !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-problem-stage { text-align: right !important; padding-top: 8px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-problem-stage-label { font-family: var(--font-sans) !important; font-weight: var(--fw-medium) !important; font-size: 10px !important; letter-spacing: var(--tracking-xwide) !important; text-transform: uppercase !important; color: #8C8A85 !important; margin-bottom: 6px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-problem-stage-value { font-family: var(--font-sans) !important; font-size: 15px !important; font-weight: var(--fw-semibold) !important; color: var(--kaman-black) !important; } /* === BEFORE / AFTER === */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-section { margin-top: 64px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-section + .co-ba-section { margin-top: 96px !important; padding-top: 96px !important; border-top: 1px solid var(--kaman-line-light) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-section-head { display: grid !important; grid-template-columns: auto 1fr !important; gap: 40px !important; align-items: flex-start !important; margin-bottom: 40px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-section-num { font-family: var(--font-display) !important; font-weight: var(--fw-regular) !important; font-size: 96px !important; line-height: 0.85 !important; letter-spacing: 0 !important; color: var(--kaman-line-light) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-section-meta { padding-top: 8px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-section-eyebrow { font-family: var(--font-sans) !important; font-weight: var(--fw-medium) !important; font-size: var(--fs-xs) !important; letter-spacing: var(--tracking-xwide) !important; text-transform: uppercase !important; color: #5C5A55 !important; margin-bottom: 14px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-section-title { font-family: var(--font-sans) !important; font-weight: var(--fw-extra) !important; font-size: clamp(32px, 4vw, 52px) !important; line-height: 1.05 !important; letter-spacing: var(--tracking-tight) !important; margin-bottom: 16px !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-section-title-em { font-style: normal !important; font-weight: var(--fw-extra) !important; background-color: transparent !important; background-image: linear-gradient( transparent 58%, var(--kaman-lime-marker) 58%, var(--kaman-lime-marker) 95%, transparent 95% ) !important; padding: 0 0.06em !important; box-decoration-break: clone !important; -webkit-box-decoration-break: clone !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-section-lead { font-size: 17px !important; line-height: 1.6 !important; color: #5C5A55 !important; max-width: 760px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-section-lead-strong { color: var(--kaman-black) !important; font-weight: var(--fw-bold) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-pair { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 20px !important; margin-bottom: 40px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-side { position: relative !important; min-width: 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-frame .co-ba-frame-img { width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: top center !important; display: block !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-label { display: flex !important; align-items: center !important; justify-content: space-between !important; font-family: var(--font-sans) !important; font-size: 11px !important; letter-spacing: var(--tracking-xwide) !important; text-transform: uppercase !important; font-weight: var(--fw-bold) !important; margin-bottom: 14px !important; padding: 0 4px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-label .co-tag { display: inline-flex !important; align-items: center !important; gap: 8px !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-label .co-tag::before { content: '' !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: var(--kaman-black) !important; } /* Before — muted; After — lime accent */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-label.co-before .co-tag { color: #5C5A55 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-label.co-before .co-tag::before { background: #5C5A55 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-label.co-after .co-tag { color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-label.co-after .co-tag::before { background: var(--accent) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-label .co-meta { font-family: var(--font-sans) !important; font-size: 10px !important; color: #5C5A55 !important; letter-spacing: 0.06em !important; text-transform: none !important; font-weight: var(--fw-medium) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-frame { position: relative !important; background: var(--kaman-bg-light-2) !important; border: 1px solid var(--kaman-line-light) !important; border-radius: var(--r-md) !important; overflow: hidden !important; aspect-ratio: 1456 / 950 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-frame.co-after { border-color: var(--accent) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-frame .co-ba-frame-iframe { width: 100% !important; height: 100% !important; border: none !important; display: block !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-frame .co-frame-tag { position: absolute !important; top: 12px !important; right: 12px !important; z-index: 2 !important; background: var(--kaman-black) !important; color: var(--kaman-white) !important; padding: 5px 11px !important; border-radius: var(--r-pill) !important; font-family: var(--font-sans) !important; font-size: 10.5px !important; font-weight: var(--fw-semibold) !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-frame.co-after .co-frame-tag { background: var(--accent) !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-changes { background: var(--kaman-bg-light-2) !important; border: 1px solid var(--kaman-line-light) !important; border-radius: var(--r-md) !important; padding: 32px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-changes-title { font-family: var(--font-sans) !important; font-size: var(--fs-md) !important; font-weight: var(--fw-extra) !important; letter-spacing: var(--tracking-tight) !important; margin-bottom: 20px !important; display: flex !important; align-items: center !important; gap: 12px !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-changes-title::before { content: '' !important; width: 28px !important; height: 2px !important; background: var(--accent) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-changes-list { display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 18px 36px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-change { display: grid !important; grid-template-columns: auto 1fr !important; gap: 14px !important; align-items: flex-start !important; font-size: 14.5px !important; line-height: 1.5 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-change-ref { font-family: var(--font-sans) !important; font-weight: var(--fw-semibold) !important; font-size: 10.5px !important; letter-spacing: 0.06em !important; color: var(--kaman-black) !important; background: var(--kaman-bg-light-2) !important; border: 1px solid var(--kaman-line-light) !important; padding: 3px 8px !important; border-radius: var(--r-xs) !important; white-space: nowrap !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-change-text-strong { font-weight: var(--fw-bold) !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-change-text-em { font-style: italic !important; } /* === CHECKOUT BEFORE MOCKUP (zachowany visual brand Orientana) === */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock { background: white !important; width: 100% !important; height: 100% !important; padding: 16px 22px !important; font-family: var(--font-sans) !important; font-size: 11px !important; color: #1a1a1a !important; overflow: hidden !important; display: flex !important; flex-direction: column !important; gap: 10px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-head { border-bottom: 1px solid #e5e0d8 !important; padding-bottom: 8px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-logo { font-family: var(--serif) !important; font-style: italic !important; font-size: 16px !important; color: #1a1a1a !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-cart { width: 18px !important; height: 18px !important; background: #f0ede6 !important; border-radius: 4px !important; position: relative !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-cart::after { content: '1' !important; position: absolute !important; top: -4px !important; right: -4px !important; background: var(--orient-green) !important; color: white !important; width: 12px !important; height: 12px !important; border-radius: 50% !important; font-size: 8px !important; font-weight: var(--fw-semibold) !important; display: flex !important; align-items: center !important; justify-content: center !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-grid { display: grid !important; grid-template-columns: 1.5fr 1fr !important; gap: 16px !important; flex: 1 !important; min-height: 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-form { display: flex !important; flex-direction: column !important; gap: 10px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-summary { background: #faf8f4 !important; padding: 12px !important; border-radius: 6px !important; display: flex !important; flex-direction: column !important; gap: 8px !important; font-size: 10px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-express { display: flex !important; gap: 4px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-express-btn { flex: 1 !important; height: 24px !important; border-radius: 3px !important; font-size: 9px !important; font-weight: var(--fw-bold) !important; display: flex !important; align-items: center !important; justify-content: center !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-express-btn.co-shop { background: #5A31F4 !important; color: #fff !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-express-btn.co-paypal { background: #003087 !important; color: #fff !important; font-style: italic !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-express-btn.co-gpay { background: #fff !important; color: #5F6368 !important; border: 1px solid #ddd !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-divider { text-align: center !important; font-size: 8px !important; letter-spacing: 0.14em !important; color: #888 !important; text-transform: uppercase !important; margin: 4px 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-section-title { font-size: 11px !important; font-weight: var(--fw-semibold) !important; margin-top: 4px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-input { background: #fff !important; border: 1px solid #d5cfc4 !important; border-radius: 3px !important; padding: 5px 8px !important; font-size: 10px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-row { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 6px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-checkbox { display: flex !important; align-items: center !important; gap: 6px !important; font-size: 9px !important; color: #888 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-checkbox::before { content: '' !important; width: 12px !important; height: 12px !important; border: 1px solid #d5cfc4 !important; border-radius: 2px !important; background: #fff !important; flex-shrink: 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-radio-group { display: flex !important; flex-direction: column !important; gap: 4px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-radio { display: flex !important; align-items: center !important; gap: 6px !important; padding: 5px 8px !important; border: 1px solid #d5cfc4 !important; border-radius: 3px !important; font-size: 9px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-radio.co-selected { border-color: var(--orient-green) !important; background: #f5f9f7 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-radio-dot { width: 10px !important; height: 10px !important; border: 1px solid #d5cfc4 !important; border-radius: 50% !important; flex-shrink: 0 !important; position: relative !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-radio.co-selected .co-ck-mock-radio-dot { border-color: var(--orient-green) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-radio.co-selected .co-ck-mock-radio-dot::after { content: '' !important; position: absolute !important; inset: 2px !important; background: var(--orient-green) !important; border-radius: 50% !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-radio .co-price { margin-left: auto !important; font-weight: var(--fw-semibold) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-summary-item { display: flex !important; gap: 6px !important; padding-bottom: 6px !important; border-bottom: 1px solid #ebe5d8 !important; align-items: flex-start !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-summary-thumb { width: 32px !important; height: 32px !important; background: #fbe8d9 !important; border-radius: 3px !important; flex-shrink: 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-summary-info { flex: 1 !important; min-width: 0 !important; font-size: 9px !important; line-height: 1.3 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-summary-info-strong { font-weight: var(--fw-bold) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-promo { display: flex !important; gap: 0 !important; border: 1px solid #d5cfc4 !important; border-radius: 3px !important; overflow: hidden !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-promo-input { flex: 1 !important; border: none !important; padding: 4px 6px !important; font-size: 9px !important; background: transparent !important; font-family: var(--font-sans) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-promo-btn { background: transparent !important; color: #1a1a1a !important; border-left: 1px solid #d5cfc4 !important; padding: 0 8px !important; font-size: 8px !important; font-weight: var(--fw-semibold) !important; text-transform: uppercase !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-totals { display: flex !important; flex-direction: column !important; gap: 3px !important; font-size: 9px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-totals-row { display: flex !important; justify-content: space-between !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-totals-row.co-total { font-size: 11px !important; font-weight: var(--fw-bold) !important; padding-top: 6px !important; border-top: 1px solid #ebe5d8 !important; margin-top: 4px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-cta { background: var(--orient-green) !important; color: #fff !important; padding: 8px !important; border-radius: 4px !important; text-align: center !important; font-size: 10px !important; font-weight: var(--fw-bold) !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; margin-top: 6px !important; position: relative !important; } /* Critical annotation overlay — LIME zamiast czerwonej */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-annotate { position: absolute !important; border: 2px dashed var(--accent) !important; background: rgba(214, 246, 18, 0.10) !important; border-radius: 4px !important; pointer-events: none !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ck-mock-annotate-label { position: absolute !important; top: -10px !important; right: -8px !important; background: var(--kaman-black) !important; color: var(--accent) !important; padding: 2px 7px !important; border-radius: var(--r-pill) !important; font-family: var(--font-sans) !important; font-size: 8px !important; font-weight: var(--fw-bold) !important; letter-spacing: 0.05em !important; white-space: nowrap !important; } /* === CTA BLOCK === */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block { background: var(--kaman-bg-dark) !important; color: var(--kaman-white) !important; padding: 120px 0 !important; position: relative !important; overflow: hidden !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block-inner { position: relative !important; z-index: 1 !important; text-align: center !important; max-width: 880px !important; margin: 0 auto !important; padding: 0 40px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block-eyebrow { font-family: var(--font-sans) !important; font-weight: var(--fw-medium) !important; font-size: var(--fs-xs) !important; letter-spacing: var(--tracking-xwide) !important; text-transform: uppercase !important; color: var(--fg-muted) !important; margin-bottom: 24px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block-title { font-family: var(--font-sans) !important; font-weight: var(--fw-extra) !important; font-size: clamp(36px, 5vw, 64px) !important; line-height: 1.05 !important; letter-spacing: var(--tracking-tight) !important; margin-bottom: 24px !important; color: var(--kaman-white) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block-title-em { font-style: normal !important; font-weight: var(--fw-extra) !important; color: var(--accent) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block-lead { font-size: var(--fs-md) !important; line-height: 1.6 !important; color: var(--fg-muted) !important; margin-bottom: 48px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block-lead-em { font-style: italic !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block-row { display: flex !important; gap: 16px !important; justify-content: center !important; flex-wrap: wrap !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block-btn { display: inline-flex !important; align-items: center !important; gap: 12px !important; padding: 20px 32px !important; border-radius: var(--r-pill) !important; font-family: var(--font-sans) !important; font-weight: var(--fw-bold) !important; font-size: var(--fs-base) !important; letter-spacing: 0 !important; text-decoration: none !important; border: 1px solid transparent !important; transition: all var(--t-fast) var(--ease-out) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block-btn.co-primary { background: var(--accent) !important; color: var(--accent-fg) !important; box-shadow: var(--shadow-lime) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block-btn.co-primary:hover { background: var(--kaman-lime-hover) !important; transform: translateY(-2px) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block-btn.co-primary:active { background: var(--kaman-lime-press) !important; transform: scale(0.97) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block-btn.co-secondary { background: transparent !important; color: var(--kaman-white) !important; border-color: var(--kaman-white) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block-btn.co-secondary:hover { background: var(--kaman-line-dark) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block-btn-svg { width: 20px !important; height: 20px !important; } /* === MOKOSH BENCHMARK === */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-grid { display: grid !important; grid-template-columns: 1fr 1.5fr !important; gap: 64px !important; align-items: flex-start !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-card { background: var(--kaman-bg-light-2) !important; border: 1px solid var(--kaman-line-light) !important; border-radius: var(--r-md) !important; padding: 32px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-card-eyebrow { font-family: var(--font-sans) !important; font-weight: var(--fw-medium) !important; font-size: 10.5px !important; letter-spacing: var(--tracking-xwide) !important; text-transform: uppercase !important; color: #5C5A55 !important; margin-bottom: 14px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-card-name { font-family: var(--font-sans) !important; font-size: 36px !important; font-weight: var(--fw-extra) !important; letter-spacing: var(--tracking-tight) !important; margin-bottom: 14px !important; line-height: 1 !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-card-desc { font-size: 14px !important; line-height: 1.55 !important; color: #5C5A55 !important; margin-bottom: 24px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-card-desc-strong { font-weight: var(--fw-bold) !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-list { list-style: none !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-list-li { padding: 16px 0 !important; border-top: 1px solid var(--kaman-line-light) !important; display: grid !important; grid-template-columns: auto 1fr !important; gap: 14px !important; align-items: flex-start !important; font-size: 14.5px !important; line-height: 1.5 !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-list-li:last-child { padding-bottom: 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-list-li-strong { font-weight: var(--fw-bold) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-list-li-em { font-style: italic !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-check { width: 22px !important; height: 22px !important; border-radius: 50% !important; background: var(--accent) !important; color: var(--kaman-black) !important; display: flex !important; align-items: center !important; justify-content: center !important; font-weight: var(--fw-extra) !important; flex-shrink: 0 !important; font-size: 12px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-takeaway { background: var(--kaman-bg-light-2) !important; border-radius: var(--r-md) !important; padding: 36px 40px !important; margin-top: 40px !important; border: 1px solid var(--kaman-line-light) !important; border-left: 4px solid var(--accent) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-takeaway-label { font-family: var(--font-sans) !important; font-weight: var(--fw-semibold) !important; font-size: 10.5px !important; letter-spacing: var(--tracking-xwide) !important; text-transform: uppercase !important; color: #5C5A55 !important; margin-bottom: 12px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-takeaway-text { font-family: var(--font-sans) !important; font-size: var(--fs-lg) !important; line-height: 1.5 !important; font-weight: var(--fw-semibold) !important; color: var(--kaman-black) !important; font-style: normal !important; letter-spacing: var(--tracking-tight) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-takeaway-text-strong { font-weight: var(--fw-extra) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-takeaway-text-em { font-style: italic !important; } /* === IMPACT === */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-impact-grid { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 0 !important; border-left: 1px solid var(--kaman-line-light) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-impact-card { padding: 40px 32px !important; border-right: 1px solid var(--kaman-line-light) !important; border-top: 1px solid var(--kaman-line-light) !important; border-bottom: 1px solid var(--kaman-line-light) !important; background: var(--kaman-bg-light-2) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-impact-card.co-feature { background: var(--accent) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-impact-card-ref { display: inline-block !important; font-family: var(--font-sans) !important; font-size: 10.5px !important; font-weight: var(--fw-semibold) !important; letter-spacing: 0.06em !important; color: #5C5A55 !important; margin-bottom: 16px !important; background: var(--kaman-bg-light-2) !important; border: 1px solid var(--kaman-line-light) !important; padding: 3px 8px !important; border-radius: var(--r-xs) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-impact-card.co-feature .co-impact-card-ref { background: var(--kaman-black) !important; color: var(--accent) !important; border-color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-impact-card-title { font-family: var(--font-sans) !important; font-weight: var(--fw-extra) !important; font-size: var(--fs-md) !important; line-height: 1.2 !important; letter-spacing: var(--tracking-tight) !important; margin-bottom: 18px !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-impact-card-num { font-family: var(--font-display) !important; /* Anton */ font-weight: var(--fw-regular) !important; font-size: 64px !important; line-height: 1 !important; letter-spacing: 0 !important; margin-bottom: 14px !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-impact-card-num .co-pre { font-family: var(--font-sans) !important; font-size: 0.35em !important; vertical-align: 0.85em !important; margin-right: 6px !important; font-weight: var(--fw-extra) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-impact-card-num .co-pct { font-family: var(--font-sans) !important; font-size: 0.4em !important; vertical-align: 0.55em !important; margin-left: 2px !important; font-weight: var(--fw-extra) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-impact-card-meta { font-size: 12.5px !important; line-height: 1.55 !important; color: #5C5A55 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-impact-card-meta-em { font-style: italic !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-impact-card.co-feature .co-impact-card-meta { color: rgba(0,0,0,0.7) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-impact-disclaimer { margin-top: 32px !important; padding: 22px 24px !important; background: var(--kaman-bg-light-2) !important; border: 1px solid var(--kaman-line-light) !important; border-left: 3px solid var(--accent) !important; border-radius: var(--r-sm) !important; font-size: 13px !important; line-height: 1.6 !important; color: #5C5A55 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-impact-disclaimer-strong { color: var(--kaman-black) !important; font-weight: var(--fw-bold) !important; } /* === METHODOLOGY === */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-method-grid { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 32px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-method-card { padding: 28px 0 !important; border-top: 2px solid var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-method-card-num { font-family: var(--font-sans) !important; font-size: 14px !important; font-weight: var(--fw-bold) !important; letter-spacing: 0.06em !important; color: #5C5A55 !important; margin-bottom: 14px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-method-card-title { font-family: var(--font-sans) !important; font-size: 22px !important; font-weight: var(--fw-extra) !important; letter-spacing: var(--tracking-tight) !important; margin-bottom: 12px !important; line-height: 1.2 !important; color: var(--kaman-black) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-method-card-text { font-size: 14.5px !important; line-height: 1.6 !important; color: #5C5A55 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-method-card-text-strong { color: var(--kaman-black) !important; font-weight: var(--fw-bold) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-method-card-text-em { font-style: italic !important; } /* === RESPONSIVE === */ @media (max-width: 1100px) { .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-container, .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-container-wide, .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-container-narrow { padding: 0 24px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-disclaimer-row { padding: 0 24px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-meta-grid { grid-template-columns: 1fr 1fr !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-meta-card { padding: 20px 20px 20px 0 !important; border-right: none !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero-meta-card:nth-child(odd) { border-right: 1px solid var(--kaman-line-dark) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stats-grid { grid-template-columns: 1fr 1fr !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-klient-grid { grid-template-columns: 1fr !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-pair { grid-template-columns: 1fr !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-changes-list { grid-template-columns: 1fr !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-impact-grid { grid-template-columns: 1fr !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-method-grid { grid-template-columns: 1fr !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mokosh-grid { grid-template-columns: 1fr !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-problem { grid-template-columns: 60px 100px 1fr !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-problem-stage { display: none !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-section-head { grid-template-columns: 1fr !important; gap: 16px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-ba-section-num { font-size: 64px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .section, .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-stats-strip, .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-cta-block { padding: 80px 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-hero { padding: 64px 0 !important; } } /* === MINI CTA pod screenami w sekcji Rozwiązanie === */ .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mini-cta { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 32px !important; padding: 28px 32px !important; background: var(--kaman-bg-light-2) !important; border: 1px solid var(--kaman-line-light) !important; border-radius: var(--r-md) !important; margin-top: 48px !important; flex-wrap: wrap !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mini-cta-text { font-family: var(--font-sans) !important; font-weight: var(--fw-semibold) !important; font-size: var(--fs-md) !important; color: var(--kaman-black) !important; letter-spacing: var(--tracking-tight) !important; line-height: 1.3 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mini-cta-text .co-mini-cta-sub { display: block !important; font-weight: var(--fw-regular) !important; font-size: var(--fs-sm) !important; color: #5C5A55 !important; letter-spacing: 0 !important; margin-top: 4px !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mini-cta-btn { display: inline-flex !important; align-items: center !important; gap: 10px !important; padding: 14px 26px !important; background: var(--accent) !important; color: var(--accent-fg) !important; font-family: var(--font-sans) !important; font-weight: var(--fw-bold) !important; font-size: var(--fs-sm) !important; letter-spacing: 0 !important; text-decoration: none !important; border-radius: var(--r-pill) !important; border: 1px solid transparent !important; transition: all var(--t-fast) var(--ease-out) !important; white-space: nowrap !important; flex-shrink: 0 !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mini-cta-btn:hover { background: var(--kaman-lime-hover) !important; transform: translateY(-1px) !important; } .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mini-cta-btn:active { background: var(--kaman-lime-press) !important; transform: scale(0.97) !important; } @media (max-width: 768px) { .kfs4-scope-leadowy-50be79e9 #case-orientana-uxa .co-mini-cta { flex-direction: column !important; align-items: flex-start !important; } }/* End custom CSS */