(kogit_blocks_normalize_body_lists);
* keep .kogit-rte-body as fallback for wrappers from render_body().
* Also post/case article content (.kogit-pb__article / .kogit-cb__article).
*/
.kogit-rte-body ul,
.kogit-rte-body ol,
.kogit-pb__article ul,
.kogit-pb__article ol,
.kogit-cb__article ul,
.kogit-cb__article ol,
ul.kogit-rte-list,
ol.kogit-rte-list {
list-style: none !important;
list-style-type: none !important;
margin: 0 0 0.75em;
padding: 0;
display: flex;
flex-direction: column;
align-items: stretch;
}
/* Bullet lists — en-dash + 20px between items */
.kogit-rte-body ul,
.kogit-pb__article ul,
.kogit-cb__article ul,
ul.kogit-rte-list--bullets {
gap: var(--kogit-innerer-abstand-20, 20px);
}
.kogit-rte-body ul > li,
.kogit-pb__article ul > li,
.kogit-cb__article ul > li,
ul.kogit-rte-list--bullets > li {
/* Flex row — en-dash stays on first-line top (no absolute/center drift) */
display: flex;
align-items: flex-start;
/* Figma 861:12980 Item gap */
gap: 10px;
box-sizing: border-box;
margin: 0;
padding: 0;
list-style: none !important;
/* Do not set font-* here — .kogit-type-* on the li must win for marker + text */
}
.kogit-rte-body ul > li::marker,
.kogit-rte-body ol > li::marker,
.kogit-pb__article ul > li::marker,
.kogit-pb__article ol > li::marker,
.kogit-cb__article ul > li::marker,
.kogit-cb__article ol > li::marker,
ul.kogit-rte-list > li::marker,
ol.kogit-rte-list > li::marker {
content: none;
font-size: 0;
}
.kogit-rte-body ul > li::before,
.kogit-pb__article ul > li::before,
.kogit-cb__article ul > li::before,
ul.kogit-rte-list--bullets > li::before {
/* En-dash U+2013 — Figma Lagebild 861:12980 gap 10 after glyph (not 1em slot) */
content: "\2013";
display: block;
flex-shrink: 0;
box-sizing: border-box;
width: auto;
margin: 0;
padding: 0;
font: inherit;
font-size: inherit;
font-weight: inherit;
line-height: inherit;
pointer-events: none;
}
/* TinyMCE wraps li text in — keep Figma-tight stack */
.kogit-rte-body ul > li > p,
.kogit-pb__article ul > li > p,
.kogit-cb__article ul > li > p,
ul.kogit-rte-list--bullets > li > p {
margin: 0;
}
/* Numbered lists — gap ≈ Govern; type size from Style dropdown on li */
.kogit-rte-body ol,
.kogit-pb__article ol,
.kogit-cb__article ol,
ol.kogit-rte-list--numbers {
gap: 40px;
counter-reset: kogit-rte-ol;
}
.kogit-rte-body ol > li,
.kogit-pb__article ol > li,
.kogit-cb__article ol > li,
ol.kogit-rte-list--numbers > li {
display: flex;
align-items: flex-start;
gap: 0.35em;
margin: 0;
padding: 0;
list-style: none !important;
/* Do not set font-* here — .kogit-type-* on the li must win for marker + text */
counter-increment: kogit-rte-ol;
}
.kogit-rte-body ol > li::before,
.kogit-pb__article ol > li::before,
.kogit-cb__article ol > li::before,
ol.kogit-rte-list--numbers > li::before {
content: counter(kogit-rte-ol) ". ";
flex-shrink: 0;
box-sizing: border-box;
min-width: 1.25em;
font: inherit;
font-size: inherit;
font-weight: inherit;
line-height: inherit;
}
.kogit-rte-body ol > li > p,
.kogit-pb__article ol > li > p,
.kogit-cb__article ol > li > p,
ol.kogit-rte-list--numbers > li > p {
margin: 0;
}
/*
* When Style is only on the inner
, still size the li (and thus ::before marker).
* liftTypeClassToListItems mirrors the class onto
- ; this covers edge cases.
*/
.kogit-rte-body li:has(> .kogit-type-h1),
.kogit-rte-body li:has(> .kogit-type-h2),
.kogit-rte-body li:has(> .kogit-type-h3),
.kogit-rte-body li:has(> .kogit-type-h4),
.kogit-rte-body li:has(> .kogit-type-anleser),
.kogit-rte-body li:has(> .kogit-type-copy),
.kogit-rte-body li:has(> .kogit-type-eyebrow),
.kogit-rte-body li:has(> .kogit-type-caption),
.kogit-rte-body li:has(> .kogit-type-copy-head) {
font-size: inherit;
font-weight: inherit;
line-height: inherit;
}
.kogit-rte-body li:has(> .kogit-type-h1) {
font-size: var(--kogit-type-h1-size);
font-weight: var(--kogit-type-h1-weight);
line-height: var(--kogit-type-h1-lh);
}
.kogit-rte-body li:has(> .kogit-type-h2) {
font-size: var(--kogit-type-h2-size);
font-weight: var(--kogit-type-h2-weight);
line-height: var(--kogit-type-h2-lh);
}
.kogit-rte-body li:has(> .kogit-type-h3) {
font-size: var(--kogit-type-h3-size);
font-weight: var(--kogit-type-h3-weight);
line-height: var(--kogit-type-h3-lh);
}
.kogit-rte-body li:has(> .kogit-type-h4) {
font-size: var(--kogit-type-h4-size);
font-weight: var(--kogit-type-h4-weight);
line-height: var(--kogit-type-h4-lh);
}
.kogit-rte-body li:has(> .kogit-type-anleser) {
font-size: var(--kogit-type-anleser-size);
font-weight: var(--kogit-type-anleser-weight);
line-height: var(--kogit-type-anleser-lh);
}
.kogit-rte-body li:has(> .kogit-type-copy),
.kogit-rte-body li:has(> .kogit-type-copy-head) {
font-size: var(--kogit-type-copy-size);
font-weight: var(--kogit-type-copy-weight);
line-height: var(--kogit-type-copy-lh);
}
.kogit-rte-body li:has(> .kogit-type-eyebrow) {
font-size: var(--kogit-type-eyebrow-size);
font-weight: var(--kogit-type-eyebrow-weight);
line-height: var(--kogit-type-eyebrow-lh);
}
.kogit-rte-body li:has(> .kogit-type-caption) {
font-size: var(--kogit-type-caption-size);
font-weight: var(--kogit-type-caption-weight);
line-height: var(--kogit-type-caption-lh);
}
.kogit-rte-body p {
margin: 0 0 0.55em;
}
.kogit-rte-body p:last-child {
margin-bottom: 0;
}
@media (min-width: 1024px) {
span[class*="__muted"]:hover,
span[class*="__accent"]:hover,
[class*="kogit-"] span[class*="__muted"]:hover,
[class*="kogit-"] span[class*="__accent"]:hover,
a[class*="__eyebrow"]:hover,
a.kogit-type-eyebrow:hover {
color: var(--wp--preset--color--orange, #ff3e00);
}
/* Principle intro/outro: Dachzeile size class, not a hoverable label — keyword only */
.kogit-principle__intro.kogit-type-eyebrow:hover,
.kogit-principle__outro.kogit-type-eyebrow:hover {
color: var(--wp--preset--color--black, #0b0b0b);
}
.kogit-principle__intro .kogit-principle__muted:hover,
.kogit-principle__outro .kogit-principle__muted:hover {
color: var(--wp--preset--color--orange, #ff3e00);
}
/* Principles Black list / title — copy only; darker gray permanent, no hover flash */
.kogit-pb .kogit-pb__item-text:hover {
color: var(--wp--preset--color--gray, #9b9b9b);
}
.kogit-pb .kogit-pb__title,
.kogit-pb .kogit-pb__title-lead,
.kogit-pb .kogit-pb__title-muted,
.kogit-pb .kogit-pb__title:hover,
.kogit-pb .kogit-pb__title:focus,
.kogit-pb .kogit-pb__title-lead:hover,
.kogit-pb .kogit-pb__title-lead:focus,
.kogit-pb .kogit-pb__title-muted:hover,
.kogit-pb .kogit-pb__title-muted:focus {
color: var(--wp--preset--color--gray, #9b9b9b) !important;
}
/*
* Eyebrow TYPE on Fließtext / legal / news excerpts — never orange the whole block.
* Real links keep orange via a.kogit-ic__muted / a.kogit-rte-link / a.kogit-ln__cat.
*/
.kogit-ic__heading.kogit-type-eyebrow:hover,
.kogit-ic__body.kogit-type-eyebrow:hover,
.kogit-ic__company-intro.kogit-type-eyebrow:hover,
.kogit-ic__email.kogit-type-eyebrow:hover,
.kogit-ic__details.kogit-type-eyebrow:hover,
.kogit-kc__heading.kogit-type-eyebrow:hover,
.kogit-kc__body.kogit-type-eyebrow:hover,
.kogit-kc__company-intro.kogit-type-eyebrow:hover,
.kogit-kc__email.kogit-type-eyebrow:hover,
.kogit-kc__intro.kogit-type-eyebrow:hover,
.kogit-kc__form-heading.kogit-type-eyebrow:hover {
color: var(--wp--preset--color--dark-black, #202020);
}
.kogit-detect__intro.kogit-type-eyebrow:hover,
.kogit-detect__foot-text.kogit-type-eyebrow:hover,
.kogit-rte-body.kogit-type-eyebrow:hover,
.kogit-ln__excerpt.kogit-type-eyebrow:hover {
color: inherit;
}
/*
* Claim Black body uses eyebrow type — Fließtext, not a link mark.
* Never inherit (section root is white → breaks light layout / flashes white).
*/
.kogit-claim-black .kogit-claim-black__body:hover,
.kogit-claim-black .kogit-claim-black__body.kogit-type-eyebrow:hover,
.kogit-claim-black .kogit-claim-black__heading:hover {
color: var(--wp--preset--color--white, #fff);
}
.kogit-claim-black.kogit-claim-black--light .kogit-claim-black__body:hover,
.kogit-claim-black.kogit-claim-black--light .kogit-claim-black__body.kogit-type-eyebrow:hover,
.kogit-claim-black.kogit-claim-black--light .kogit-claim-black__heading:hover {
color: var(--wp--preset--color--black, #0b0b0b);
}
/* Our Clients Slider body — Dachzeile type, not a hoverable label */
.kogit-ocs__body:hover,
.kogit-ocs__body.kogit-type-eyebrow:hover,
.kogit-ocs__split-body:hover,
.kogit-ocs__split-body.kogit-type-eyebrow:hover {
color: var(--wp--preset--color--black, #0b0b0b);
}
}
/* Tablet/Mobile — Figma Button: px20 py15 · gap20 · type tokens when wrapping */
@media (max-width: 1023px) {
.kogit-button {
gap: 20px;
height: auto;
min-height: 0;
padding: 15px 20px;
align-items: center;
justify-content: flex-start;
font-size: var(--kogit-type-button-size, 16px);
font-weight: var(--kogit-type-button-text-weight, 300);
line-height: 22px; /* multi-line ghost CTA; not Buttontext 14 */
text-align: left;
}
}
/*
* Ghost block CTAs (label + arrow) — Fracktif Light 300 on desktop, tablet, and mobile.
* Beats WP/theme link weight on nested __cta-label spans.
*/
[class*="kogit-"] a[class*="__cta"]:not([class*="__cta-arrow"]):not([class*="__cta-label"]),
[class*="kogit-"] span[class*="__cta"]:not([class*="__cta-arrow"]):not([class*="__cta-label"]),
[class*="kogit-"] [class*="__cta-label"],
.kogit-cta-button__label {
font-weight: var(--kogit-type-button-weight, 300);
}
@media (max-width: 1023px) {
[class*="kogit-"] a[class*="__cta"]:not([class*="__cta-arrow"]):not([class*="__cta-label"]),
[class*="kogit-"] span[class*="__cta"]:not([class*="__cta-arrow"]):not([class*="__cta-label"]),
[class*="kogit-"] [class*="__cta-label"],
.kogit-cta-button__label {
font-weight: var(--kogit-type-button-text-weight, 300);
}
}
/*
* Section eyebrows — Figma h5 Dachzeile (Strategic partner, Innovation Deck, …).
* Tokens switch on :root (D 18/24 · T/M 16/26).
*/
[class*="kogit-"] [class*="__eyebrow"],
.kogit-type-eyebrow,
.kogit-detect__intro,
.kogit-detect__foot-text,
.kogit-principle__intro,
.kogit-principle__outro,
.kogit-claim-black__body {
font-family: var(--kogit-type-family, var(--wp--preset--font-family--fracktif, sans-serif));
font-size: var(--kogit-type-eyebrow-size, 18px);
font-weight: var(--kogit-type-eyebrow-weight, 300);
letter-spacing: var(--kogit-type-eyebrow-tracking, 0);
line-height: var(--kogit-type-eyebrow-lh, 24px);
}
/* Crumbs stay Web/H5 18/24 on D/T/M (Figma Company + Sense — not mobile eyebrow 16) */
.kogit-subpage-hero__crumbs-line {
font-family: var(--kogit-type-family, var(--wp--preset--font-family--fracktif, sans-serif));
font-size: var(--kogit-type-eyebrow-size, 18px);
font-weight: var(--kogit-type-eyebrow-weight, 300);
letter-spacing: var(--kogit-type-eyebrow-tracking, 0);
line-height: var(--kogit-type-eyebrow-lh, 24px);
}
@media (max-width: 1023px) {
.kogit-subpage-hero__crumbs-line {
/* Keep desktop Dachzeile 18/24 on T/M (Figma crumbs) */
font-size: 18px;
line-height: 24px;
}
}
/* -------------------------------------------------------------------------
Header — global site chrome (Startseite + all Unterseiten, D/T/M identical)
Collapsed Figma 82:6600 / 284:5698 · 1728×104 · Head-Nav px 40 · py ~20
logo 216×54 · full-bleed bar (same width as menu-overlay) · tools gap 23
EN Light 25/33 w38 · search ~25×24 · burger ~29×19
Tablet 284:6383 · 834×104 · px 40 · logo 121×31 · search+burger gap 25
Mobile 284:5708 · 394×71 · p 20 · logo 121×31 · search+burger gap 25
Open overlay bar must match 1:1 (burger ↔ X same slot).
Behavior (header.js): hide on scroll down / show on scroll up.
Over first page hero → transparent fixed; past hero → solid white.
Never sticky / never homepage-only — same chrome on every template.
------------------------------------------------------------------------- */
:root {
--kogit-header-height: 104px;
}
html {
/* Reserve scrollbar space so opening the menu does not shift fixed chrome */
scrollbar-gutter: stable;
}
/* Fixed header — hash targets (e.g. Events → #secure-identity-forum) sit below nav */
.kogit-eventbanner[id],
:target {
scroll-margin-top: calc(var(--kogit-header-height, 104px) + 16px);
}
@media (max-width: 599px) {
:root {
--kogit-header-height: 71px;
}
}
/*
* One chrome everywhere: fixed overlay, same sizes/tokens on every template.
* Do not use sticky or page-specific position — that made Unterseiten look different.
*/
.kogit-header,
.kogit-header.has-background,
.kogit-header.has-white-background-color,
.kogit-header.has-light-gray-background-color,
.wp-block-group.kogit-header {
position: fixed;
top: 0;
right: 0;
left: 0;
z-index: 300;
box-sizing: border-box;
width: 100%;
max-width: none;
margin: 0;
background-color: transparent !important;
background-image: none !important;
color: var(--wp--preset--color--black, #0b0b0b);
transform: translateY(0);
transition:
transform 0.35s ease,
background-color 0.2s ease,
color 0.2s ease;
}
/* Scroll down → hide; scroll up → show (see header.js). */
.kogit-header.is-hidden {
transform: translateY(-100%);
pointer-events: none;
}
/*
* WP admin bar is 32px (46px ≤782). Keep the fixed header under it so
* logged-in chrome stays aligned with the hero (guests have no bar).
*/
body.admin-bar .kogit-header,
body.admin-bar .kogit-header.has-background,
body.admin-bar .wp-block-group.kogit-header {
top: 32px;
}
@media screen and (max-width: 782px) {
body.admin-bar .kogit-header,
body.admin-bar .kogit-header.has-background,
body.admin-bar .wp-block-group.kogit-header {
top: 46px;
}
}
/* Left page top (or pages without a page hero): solid bar — transparent only at y≈0 */
.kogit-header.is-past-hero,
.kogit-header.is-past-hero.has-background,
.kogit-header.is-past-hero.has-white-background-color,
.kogit-header.is-past-hero.has-light-gray-background-color,
/* Partner section: always solid white — body class and/or partner-hero present
(flat permalinks like /sailpoint/ still count as Partner pages). */
body.kogit-header-solid .kogit-header,
body.kogit-header-solid .kogit-header.has-background,
body.kogit-header-solid .kogit-header.has-white-background-color,
body.kogit-header-solid .kogit-header.has-light-gray-background-color,
body.kogit-header-solid .wp-block-group.kogit-header,
body:has(.kogit-partner-hero) .kogit-header,
body:has(.kogit-partner-hero) .kogit-header.has-background,
body:has(.kogit-partner-hero) .kogit-header.has-white-background-color,
body:has(.kogit-partner-hero) .kogit-header.has-light-gray-background-color,
body:has(.kogit-partner-hero) .wp-block-group.kogit-header {
background-color: var(--wp--preset--color--white, #ffffff) !important;
}
.kogit-header__logo img,
.kogit-header__icon img {
filter: none;
}
.kogit-header__lang {
text-shadow: none;
}
/*
* No full-bleed page hero under the bar → reserve header height so content
* is not covered (hero pages intentionally sit under the transparent bar).
*/
body:not(:has(.kogit-hero, .kogit-subpage-hero, .kogit-partner-hero, .kogit-ph))
.wp-site-blocks {
padding-top: var(--kogit-header-height);
}
.kogit-header__inner {
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
min-height: var(--kogit-header-height, 104px);
padding: var(--kogit-inner-padding-small, 20px)
var(--wp--custom--layout--desktop-padding-sides, 40px);
}
/* Desktop: row max 1480, at least 125px free on each side. Bar stays full-bleed.
* Hero crumbs use the same left edge: max(125px, (100% - 1480px) / 2). */
@media (min-width: 1024px) {
.kogit-header__inner {
width: min(1480px, calc(100% - (2 * var(--kogit-desktop-padding-sides-xxl, 125px))));
max-width: 1480px;
margin-right: auto;
margin-left: auto;
padding-right: 0;
padding-left: 0;
}
}
.kogit-header__logo {
display: flex;
flex-shrink: 0;
align-items: center;
/* Figma 82:6600 Head-Nav Logo 216×54 — same slot as open menu-overlay */
width: 216px;
height: 54px;
line-height: 0;
text-decoration: none;
}
.kogit-header__logo img {
display: block;
width: 216px;
height: 54px;
max-width: 216px;
max-height: 54px;
}
.kogit-header__tools {
display: flex;
gap: 23px; /* Figma 284:5698: EN→Lupe / Lupe→Burger */
align-items: center;
height: 24px;
}
.kogit-header__lang {
display: inline-flex;
align-items: center;
box-sizing: border-box;
flex-shrink: 0;
width: 38px;
min-width: 38px;
height: 24px;
margin: 0;
overflow: hidden;
font-family: var(--wp--preset--font-family--fracktif, sans-serif);
font-size: 25px;
font-weight: 300; /* Fracktif Light */
/* Figma: 25/33 inside 24px text frame — center the line-box, then nudge
caps down so they optically sit with Lupe/Burger (user said too high). */
line-height: 33px;
transform: translateY(3px);
color: var(--wp--preset--color--black, #0b0b0b);
text-decoration: none;
white-space: nowrap;
}
.kogit-header__lang:hover,
.kogit-header__lang:focus-visible {
color: var(--wp--preset--color--orange, #ff3e00);
}
.kogit-header__icon {
display: inline-flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
padding: 0;
border: 0;
background: transparent;
color: inherit;
cursor: pointer;
line-height: 0;
}
.kogit-header__icon img {
display: block;
width: auto;
height: auto;
max-width: none;
}
/* Figma Lupe 24.758×23.934 · Burger 29.281×18.923 (vertically centered in 24px row) */
.kogit-header__icon--search {
width: 24.758px;
height: 23.934px;
}
.kogit-header__icon--search img {
width: 24.758px;
height: 23.934px;
}
.kogit-header__icon--menu {
width: 29.281px;
height: 18.923px;
}
.kogit-header__icon--menu img {
width: 29.281px;
height: 18.923px;
}
/* Tablet — Menü 284:6383 (834): logo compact, search+burger only */
@media (max-width: 1023px) {
.kogit-header__inner {
min-height: var(--kogit-header-height, 104px);
padding: var(--kogit-inner-padding-small, 20px)
var(--wp--custom--layout--desktop-padding-sides, 40px);
}
.kogit-header__logo {
width: 121px;
height: 31px;
}
.kogit-header__logo img {
width: 121px;
height: 31px;
max-width: 121px;
max-height: 31px;
}
.kogit-header__lang {
display: none;
}
/* Group 178 = 79×26 → search 24.758 + gap 25 + burger 29.281 */
.kogit-header__tools {
gap: 25px;
height: 26px;
}
.kogit-header__icon--search,
.kogit-header__icon--search img {
width: 24.758px;
height: 23.934px;
}
.kogit-header__icon--menu,
.kogit-header__icon--menu img {
width: 29.281px;
height: 18.923px;
}
}
/* Mobile — Mobile Menü 284:5708: bar 71 · p 20 */
@media (max-width: 599px) {
.kogit-header__inner {
min-height: var(--kogit-header-height, 71px);
padding: var(--kogit-inner-padding-small, 20px);
}
.kogit-header__logo {
width: 121px;
height: 31px;
}
.kogit-header__logo img {
width: 121px;
height: 31px;
max-width: 121px;
max-height: 31px;
}
.kogit-header__tools {
gap: 25px;
height: 26px;
}
}
/* -------------------------------------------------------------------------
Footer — Startseite frames
Desktop 290:10981 — py 80 · px sides-xxl 125 · container 1478
nav: pt 40 / pb 160 · 4×1fr gap 35 · type Light 18/40
mid-rule flush after nav · bottom pt 20 / pb 20 · border-b white
address/social 16/22 · legal 16/32 · vertical rule @ col 2|3
Tablet 290:11666 — py 40 · px 40 · container gap 40 · 2×2 gap 40
type 20/40 · bottom border middle-gray · pb20 · legal | social+address(gap20)
Mobile 290:11318 — py 40 · px 20 · container gap 40 · nav stack gap 40
legal → social → address (gaps 40) · bottom rule · type 20/40 · social 18/40
------------------------------------------------------------------------- */
.kogit-footer.wp-block-group,
.kogit-footer.wp-block-group.has-background,
.kogit-footer {
box-sizing: border-box;
width: 100%;
margin: 0 !important;
/* Figma: py innerer-abstand-80 · px desktop-padding-sides-xxl */
padding: 80px
var(--kogit-desktop-padding-sides-xxl, var(--wp--custom--layout--desktop-padding-sides-xxl, 125px)) !important;
background-color: var(--wp--preset--color--black, #0b0b0b);
color: var(--wp--preset--color--light-gray, #f2f2f2);
font-family: var(--wp--preset--font-family--fracktif, sans-serif);
}
.kogit-footer a {
color: inherit;
text-decoration: none;
transition: color 0.35s ease;
}
.kogit-footer a:focus,
.kogit-footer a:focus-visible {
color: var(--wp--preset--color--orange, #ff3e00);
}
.kogit-footer__inner {
display: flex;
flex-direction: column;
gap: 0;
box-sizing: border-box;
width: 100%;
max-width: var(--kogit-content-max, var(--wp--custom--layout--content-max, 1478px));
margin: 0 auto;
}
.kogit-footer__rule {
box-sizing: border-box;
width: 100%;
height: 0;
margin: 0;
padding: 0;
border: 0;
border-top: 1px solid var(--wp--preset--color--light-gray, #f2f2f2);
}
.kogit-footer__nav {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 35px;
align-items: start;
box-sizing: border-box;
width: 100%;
/* Figma Spalte 440: pt40 + content + pb160 */
padding: 40px 0 160px;
}
.kogit-footer__col {
box-sizing: border-box;
min-width: 0;
}
.kogit-footer__heading {
margin: 0;
padding: 0;
color: var(--wp--preset--color--light-gray, #f2f2f2);
font-family: inherit;
font-size: var(--kogit-type-copy-size, 18px);
font-weight: var(--kogit-type-copy-weight, 300);
line-height: 40px; /* footer nav rhythm (Figma), not type-scale lh */
}
.kogit-footer__col--muted .kogit-footer__heading {
color: var(--wp--preset--color--middle-gray, #e8e8e8);
}
.kogit-footer__reg {
font-size: 0.645em;
line-height: 0;
vertical-align: super;
}
.kogit-footer__list {
margin: 0;
padding: 0;
list-style: none;
}
.kogit-footer__list li {
margin: 0;
padding: 0;
}
.kogit-footer__list a {
display: block;
margin: 0;
padding: 0;
color: var(--wp--preset--color--gray, #9b9b9b);
font-size: var(--kogit-type-copy-size, 18px);
font-weight: var(--kogit-type-copy-weight, 300);
line-height: 40px; /* footer nav rhythm */
}
/* Innovation Platform children = light-gray (Figma continuous block) */
.kogit-footer__col--platform .kogit-footer__list a {
color: var(--wp--preset--color--light-gray, #f2f2f2);
}
.kogit-footer__col--muted .kogit-footer__list a {
color: var(--wp--preset--color--gray, #9b9b9b);
}
/*
* All footer links → orange on hover (D/T/M). After rest-color rules so
* platform / muted / legal specificity does not block hover.
*/
.kogit-footer a:hover,
.kogit-footer a:hover *,
.kogit-footer__heading a:hover,
.kogit-footer__heading a:hover *,
.kogit-footer__list a:hover,
.kogit-footer__col--platform .kogit-footer__list a:hover,
.kogit-footer__col--muted .kogit-footer__list a:hover,
.kogit-footer__legal-list a:hover,
.kogit-footer__legal-mobile a:hover,
.kogit-footer__social a:hover {
color: var(--wp--preset--color--orange, #ff3e00);
}
/* Bottom — pt20 · pb20 · 4 cols gap35 · border-b white */
.kogit-footer__bottom {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 35px;
align-items: start;
box-sizing: border-box;
width: 100%;
padding: 20px 0;
border-bottom: 1px solid var(--wp--preset--color--white, #fff);
}
/* Desktop: unwrap so address/social sit in cols 1–2 */
.kogit-footer__meta-stack {
display: contents;
}
.kogit-footer__address {
grid-column: 1;
order: 1;
margin: 0;
padding: 0;
color: var(--wp--preset--color--gray, #9b9b9b);
font-size: var(--kogit-type-caption-size, 16px);
font-weight: var(--kogit-type-caption-weight, 300);
line-height: var(--kogit-type-caption-lh, 22px);
}
.kogit-footer__social {
grid-column: 2;
order: 2;
margin: 0;
padding: 0;
color: var(--wp--preset--color--gray, #9b9b9b);
font-size: var(--kogit-type-caption-size, 16px);
font-weight: var(--kogit-type-caption-weight, 300);
line-height: var(--kogit-type-caption-lh, 22px);
}
.kogit-footer__social a {
color: inherit;
text-decoration: underline;
text-underline-offset: 2px;
text-underline-position: from-font;
cursor: pointer;
}
.kogit-footer__legal-wrap {
position: relative;
grid-column: 3;
order: 3;
display: flex;
gap: 0;
align-items: flex-start;
min-width: 0;
}
/* Vertical rule between social | legal — Figma x≈739 on 1478 (= mid gap) */
.kogit-footer__bottom-rule {
position: absolute;
top: -20px;
left: -17.5px; /* half of gap 35 */
width: 0;
height: calc(100% + 40px); /* pt20 + pb20 */
border: 0;
border-left: 1px solid var(--wp--preset--color--light-gray, #f2f2f2);
}
.kogit-footer__legal-list {
margin: 0;
padding: 0;
list-style: none;
}
.kogit-footer__legal-list li {
margin: 0;
padding: 0;
}
.kogit-footer__legal-list--end {
grid-column: 4;
order: 4;
}
.kogit-footer__legal-list a {
display: block;
margin: 0;
padding: 0;
color: var(--wp--preset--color--gray, #9b9b9b);
font-size: var(--kogit-type-caption-size, 16px);
font-weight: var(--kogit-type-caption-weight, 300);
line-height: 32px; /* footer legal rhythm */
}
.kogit-footer__legal-mobile {
display: none;
}
.kogit-footer__rule--bottom {
display: none;
}
/* -------------------------------------------------------------------------
Tablet — Footer-tablet 290:11666 (834)
py40 px40 · gap40 · nav 2×2 gap40 · bottom border #e8e8e8 · pb20 to line
------------------------------------------------------------------------- */
@media (max-width: 1023px) {
.kogit-footer.wp-block-group,
.kogit-footer.wp-block-group.has-background,
.kogit-footer {
padding: 40px
var(--kogit-tablet-padding-sides, var(--wp--custom--layout--padding-tablet-sides, 40px)) !important;
}
.kogit-footer__inner {
gap: 40px;
}
.kogit-footer__nav {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 40px;
padding: 0;
}
.kogit-footer__heading,
.kogit-footer__list a {
font-size: var(--kogit-type-copy-head-size, 20px);
line-height: 40px;
}
.kogit-footer__bottom {
display: flex;
flex-wrap: nowrap;
gap: 40px;
align-items: flex-start;
/* Space content ↔ bottom line (was 0 — too tight) */
padding: 0 0 20px;
border-bottom: 1px solid var(--wp--preset--color--middle-gray, #e8e8e8);
}
.kogit-footer__legal-wrap,
.kogit-footer__legal-list--end {
display: none;
}
.kogit-footer__legal-mobile {
display: flex;
flex-direction: column;
order: 1;
flex: 1 1 0;
min-width: 0;
max-width: 357px;
margin: 0;
padding: 0;
color: var(--wp--preset--color--gray, #9b9b9b);
font-size: var(--kogit-type-copy-head-size, 20px);
font-weight: var(--kogit-type-copy-head-weight, 300);
line-height: 33px;
}
.kogit-footer__legal-mobile a {
display: block;
margin: 0;
padding: 0;
line-height: 33px;
}
/* Tablet: Kontakt…Datenschutz | gap ~40 | Glossar */
.kogit-footer__legal-mobile-split {
margin-top: 40px;
}
/* Right: social then address · gap 20 */
.kogit-footer__meta-stack {
display: flex;
flex-direction: column-reverse;
gap: 20px;
order: 2;
flex: 1 1 0;
min-width: 0;
max-width: 357px;
}
.kogit-footer__social {
order: 0;
grid-column: auto;
color: var(--wp--preset--color--gray, #9b9b9b);
font-size: var(--kogit-type-copy-size, 18px);
font-weight: var(--kogit-type-copy-weight, 300);
line-height: var(--kogit-type-copy-lh, 24px);
}
.kogit-footer__social-br {
display: inline;
}
.kogit-footer__address {
order: 0;
grid-column: auto;
color: var(--wp--preset--color--gray, #9b9b9b);
font-size: var(--kogit-type-copy-head-size, 20px);
font-weight: var(--kogit-type-copy-head-weight, 300);
line-height: 33px;
letter-spacing: -0.2px;
}
.kogit-footer__rule--bottom {
display: none;
}
}
/* -------------------------------------------------------------------------
Mobile — Footer-Mobile 290:11318 (393)
py40 px20 · gap40 · legal→social→address gaps40 · bottom rule · lh40
------------------------------------------------------------------------- */
@media (max-width: 599px) {
.kogit-footer.wp-block-group,
.kogit-footer.wp-block-group.has-background,
.kogit-footer {
padding: 40px
var(--kogit-mobile-padding-sides, var(--wp--custom--layout--mobile-padding-sides, 20px)) !important;
}
.kogit-footer__nav {
display: flex;
flex-direction: column;
grid-template-columns: none;
gap: 40px;
}
.kogit-footer__bottom {
flex-direction: column;
gap: 40px;
border-bottom: 0;
}
.kogit-footer__legal-mobile {
order: 1;
flex: none;
width: 100%;
max-width: 325px;
font-size: var(--kogit-type-copy-head-size, 20px);
line-height: 40px;
}
.kogit-footer__legal-mobile a {
line-height: 40px;
}
/* Mobile: continuous list — no tablet split gap */
.kogit-footer__legal-mobile-split {
margin-top: 0;
}
.kogit-footer__meta-stack {
order: 2;
flex: none;
width: 100%;
max-width: 325px;
flex-direction: column-reverse;
gap: 40px;
}
.kogit-footer__social {
font-size: var(--kogit-type-copy-size, 18px);
line-height: 40px;
}
.kogit-footer__social-br {
display: none;
}
.kogit-footer__address {
font-size: var(--kogit-type-copy-head-size, 20px);
line-height: 40px;
letter-spacing: -0.2px;
}
.kogit-footer__rule--bottom {
display: block;
order: 3;
width: 100%;
margin: 0;
}
}
/* =============================================================================
* nav-point / Points — also shipped via blocks/src/_shared/points.scss
* Figma 290:10846: gap 10 · inactive 10×1.5 #9B9B9B · active 60×1.5 #202020
* ============================================================================= */
.kogit-points {
display: flex !important;
flex-flow: row nowrap !important;
align-items: center !important;
justify-content: center !important;
gap: 10px !important;
box-sizing: border-box !important;
width: max-content !important;
max-width: 100% !important;
height: 24px !important;
min-height: 24px !important;
margin-inline: auto !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
}
.kogit-points button.kogit-points__dash,
.kogit-points .kogit-points__dash {
all: unset !important;
display: block !important;
box-sizing: border-box !important;
position: relative !important;
flex: 0 0 auto !important;
width: 10px !important;
min-width: 10px !important;
max-width: 10px !important;
height: 24px !important;
min-height: 24px !important;
max-height: 24px !important;
margin: 0 !important;
padding: 0 !important;
border: 0 none transparent !important;
border-radius: 0 !important;
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
box-shadow: none !important;
outline: none !important;
color: transparent !important;
font-size: 0 !important;
line-height: 0 !important;
cursor: pointer !important;
overflow: visible !important;
transition: width 0.2s ease, min-width 0.2s ease, max-width 0.2s ease !important;
}
.kogit-points button.kogit-points__dash.is-active,
.kogit-points .kogit-points__dash.is-active {
width: 60px !important;
min-width: 60px !important;
max-width: 60px !important;
}
.kogit-points__line {
position: absolute !important;
left: 0 !important;
right: 0 !important;
top: 50% !important;
width: 100% !important;
height: 1.5px !important;
margin: 0 !important;
margin-top: -0.75px !important;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background-color: #9b9b9b !important;
pointer-events: none !important;
display: block !important;
}
/* Active: 60px gray track; black fill 0→100% over 3s (.is-filling from view.js) */
.kogit-points__dash.is-active .kogit-points__line {
overflow: hidden !important;
background-color: #9b9b9b !important;
background-image: none !important;
}
.kogit-points__dash.is-active .kogit-points__line::after {
content: '' !important;
position: absolute !important;
left: 0 !important;
top: 0 !important;
width: 100% !important;
height: 100% !important;
background-color: #202020 !important;
transform: scaleX(0);
transform-origin: left center;
}
.kogit-points__dash.is-active.is-filling .kogit-points__line::after {
animation: kogit-points-fill 3s linear forwards;
}
@keyframes kogit-points-fill {
from {
transform: scaleX(0);
}
to {
transform: scaleX(1);
}
}
@media (prefers-reduced-motion: reduce) {
.kogit-points__dash.is-active .kogit-points__line::after,
.kogit-points__dash.is-active.is-filling .kogit-points__line::after {
animation: none;
transform: scaleX(1);
}
}
.kogit-points__dash:focus-visible {
outline: 2px solid var(--wp--preset--color--orange, #ff3e00) !important;
outline-offset: 4px !important;
}
.kogit-points__svg {
display: none !important;
}
/* Team portraits — hover crossfade (describe-team, team-members-*) */
.kogit-photo-flip__scene {
position: relative;
width: 100%;
height: 100%;
}
.kogit-photo-flip__inner {
position: relative;
width: 100%;
height: 100%;
}
.kogit-photo-flip__face {
position: absolute;
inset: 0;
overflow: hidden;
transition:
opacity 0.2s ease,
transform 0.2s ease;
}
.kogit-photo-flip__face--front {
opacity: 1;
transform: scale(1);
z-index: 1;
}
.kogit-photo-flip__face--back {
opacity: 0;
transform: scale(1.04);
}
.kogit-photo-flip:hover .kogit-photo-flip__face--front,
.kogit-photo-flip:focus-within .kogit-photo-flip__face--front {
opacity: 0;
transform: scale(0.98);
}
.kogit-photo-flip:hover .kogit-photo-flip__face--back,
.kogit-photo-flip:focus-within .kogit-photo-flip__face--back {
opacity: 1;
transform: scale(1);
}
@media (prefers-reduced-motion: reduce) {
.kogit-photo-flip__face {
transition: none;
}
.kogit-photo-flip:hover .kogit-photo-flip__face--front,
.kogit-photo-flip:focus-within .kogit-photo-flip__face--front {
opacity: 0;
transform: none;
}
.kogit-photo-flip:hover .kogit-photo-flip__face--back,
.kogit-photo-flip:focus-within .kogit-photo-flip__face--back {
opacity: 1;
transform: none;
}
}
/* -------------------------------------------------------------------------
Cursor — final site-wide pass (ALWAYS last in this file).
ALL text links + nested text must stay pointer; beats block SCSS & grab chrome.
------------------------------------------------------------------------- */
a,
a *,
a:any-link,
a:any-link *,
a[href],
a[href] *,
.wp-site-blocks a,
.wp-site-blocks a *,
.entry-content a,
.entry-content a *,
.wp-block-post-content a,
.wp-block-post-content a *,
[role='link'],
[role='link'] *,
[class*='kogit-'] a,
[class*='kogit-'] a *,
[class*='kogit-'][class*='__cta'],
[class*='kogit-'][class*='__cta'] *,
[class*='kogit-'][class*='__link'],
[class*='kogit-'][class*='__link'] *,
[class*='kogit-'][class*='__crumb'],
[class*='kogit-'][class*='__crumb'] *,
[class*='kogit-'][class*='__crumb--parent'],
[class*='kogit-'][class*='__crumb--parent'] *,
.kogit-button,
.kogit-button *,
.kogit-header__lang,
.kogit-header__icon,
.kogit-footer a,
.kogit-footer a *,
.kogit-menu-overlay a,
.kogit-menu-overlay a *,
span[class*='__muted'],
span[class*='__accent'],
[class*='__muted'],
[class*='__accent'],
a[class*='__eyebrow'],
a.kogit-type-eyebrow,
a.kogit-rte-link,
a.kogit-rte-link * {
cursor: pointer !important;
}
/* Plain section Dachzeile — label only, not a text-link mark */
[class*='kogit-'] [class*='__eyebrow']:not(a),
.kogit-type-eyebrow:not(a) {
cursor: default !important;
}
/* Disabled / non-interactive exceptions (beat pointer !important above) */
:disabled,
[aria-disabled='true'],
[aria-disabled='true'] *,
.is-disabled,
.is-disabled *,
.kogit-govern-challenges__tag,
.kogit-pb__item,
.kogit-pb__item-text,
.kogit-pb__title,
.kogit-pb__title-lead,
.kogit-pb__title-muted {
cursor: default !important;
}
/*
* Eyebrow TYPE on Fließtext / legal / news excerpts — typography only, not a text-link mark.
* Keep pointer on real links inside (phone, email, card link, cat badge).
*/
.kogit-rte-body.kogit-type-eyebrow,
.kogit-ic__heading,
.kogit-ic__body,
.kogit-ic__company-intro,
.kogit-ic__email,
.kogit-ic__details,
.kogit-kc__heading,
.kogit-kc__body,
.kogit-kc__company-intro,
.kogit-kc__email,
.kogit-kc__intro,
.kogit-kc__form-heading,
.kogit-detect__intro,
.kogit-detect__foot-text,
.kogit-claim-black__body,
.kogit-principle__intro,
.kogit-principle__outro,
.kogit-ln__excerpt,
.kogit-ocs__body,
.kogit-ocs__body.kogit-type-eyebrow,
.kogit-ocs__split-body,
.kogit-ocs__split-body.kogit-type-eyebrow,
.kogit-ssc__caption {
cursor: text !important;
}
.kogit-ic a,
.kogit-ic a *,
.kogit-kc a,
.kogit-kc a *,
.kogit-detect__intro a,
.kogit-detect__intro a *,
.kogit-detect__foot-text a,
.kogit-detect__foot-text a *,
.kogit-claim-black__body a,
.kogit-claim-black__body a *,
.kogit-principle__intro a,
.kogit-principle__intro a *,
.kogit-principle__outro a,
.kogit-principle__outro a *,
.kogit-rte-body a,
.kogit-rte-body a *,
.kogit-ln__link,
.kogit-ln__cat,
.kogit-ln__cat * {
cursor: pointer !important;
}
/* Drag surfaces — only the viewport/rail chrome, not links/CTAs inside */
[class*='__viewport'],
[class*='__viewport'].is-dragging,
[class*='kogit-'][class*='__rail'] {
cursor: grab;
}
[class*='__viewport'].is-dragging {
cursor: grabbing;
}
/* Links/CTAs inside drag surfaces — pointer ALWAYS wins over grab */
[class*='__viewport'] a,
[class*='__viewport'] a *,
[class*='__viewport'] [class*='__cta'],
[class*='__viewport'] [class*='__cta'] *,
[class*='__viewport'] [class*='__link'],
[class*='__viewport'] [class*='__link'] *,
[class*='__rail'] a,
[class*='__rail'] a *,
[class*='__rail'] [class*='__cta'],
[class*='__rail'] [class*='__cta'] * {
cursor: pointer !important;
}
/*
* Blog single — solid header (no transparent-over-hero) + clear the fixed bar.
* `.kogit-ph` would otherwise skip the global `:not(:has(…hero…))` pad.
*/
body.single-post .kogit-header,
body.single-post .kogit-header.has-background,
body.single-post .wp-block-group.kogit-header {
background-color: var(--wp--preset--color--white, #fff) !important;
}
body.single-post .wp-site-blocks {
padding-top: var(--kogit-header-height, 104px);
}
/*
* Case and post singles — Latest news is the last content section before the
* footer (Figma 1151:18134 / 658:13555 · kontakt-to-footer).
*/
body.single-kogit_case .kogit-ln,
body.single-post .kogit-ln {
padding-bottom: var(--kogit-desktop-kontakt-to-footer, 240px);
}
@media (max-width: 1023px) {
body.single-kogit_case .kogit-ln,
body.single-post .kogit-ln {
padding-bottom: var(--kogit-tablet-kontakt-to-footer, 120px);
}
}
@media (max-width: 599px) {
body.single-kogit_case .kogit-ln,
body.single-post .kogit-ln {
padding-bottom: var(--kogit-mobile-kontakt-to-footer, 120px);
}
}
/* -------------------------------------------------------------------------
Partner overview page — Figma 1454:17014 (D) / 1454:16958 (T) / 1454:16902 (M)
Built from existing blocks:
- Hero + intro → kogit/latest-news-header (same hero as KOGIT Innovation
Deck) without the category filter → .kogit-lnh.kogit-lnh--partner-hero
- Logo grid → kogit/strategic-partners (layout content)
- Tech-partner intro → kogit/latest-news-header, copy row only
→ .kogit-lnh.kogit-lnh--partner-intro
- Logo strip → kogit/our-clients-slider → .kogit-ocs.kogit-ocs--secondary-partners
Desktop hero needs no override — the block already matches the frame
(crumb 40/80 · container 125/160 · gap 160 · 659|160|659 · bottom 20).
------------------------------------------------------------------------- */
/* Logo grid: hero ↔ grid 180 (Figma Logo Sektion y20 + head slot 160),
grid ↔ tech intro 240. */
.kogit-sp.kogit-sp--partner-overview {
padding-top: 180px;
padding-bottom: var(--kogit-desktop-kontakt-to-footer, 240px);
}
/* Tech-partner intro: copy row only, flush under the logo grid. */
.kogit-lnh.kogit-lnh--partner-intro .kogit-lnh__inner {
padding-top: 0;
}
.kogit-ocs.kogit-ocs--secondary-partners {
overflow-x: clip;
padding-bottom: var(--kogit-desktop-kontakt-to-footer, 240px);
}
/* Default strip: heading lives in the intro block above.
Split layout (heading left, text right) keeps its own head, then the slider. */
.kogit-ocs.kogit-ocs--secondary-partners:not(.kogit-ocs--split) .kogit-ocs__head {
display: none;
}
.kogit-ocs.kogit-ocs--secondary-partners:not(.kogit-ocs--split) .kogit-ocs__slider-wrap {
margin-top: 0;
}
@media (max-width: 1023px) {
/* Hero T 1454:16960 — crumb 40/80 · heading 160 · gap 80 · copy stacked 20 */
.kogit-lnh.kogit-lnh--partner-hero .kogit-lnh__inner {
--lnh-pad-top: var(--kogit-desktop-padding-top-bottom, 160px);
--lnh-stack-gap: var(--kogit-innerer-abstand-80, 80px);
--lnh-crumb-top: var(--kogit-innerer-abstand-80, 80px);
padding-top: var(--lnh-pad-top);
padding-bottom: var(--kogit-innerer-abstand-80, 80px);
gap: var(--lnh-stack-gap);
}
.kogit-lnh.kogit-lnh--partner-hero .kogit-lnh__copy-inner {
flex-direction: column;
gap: var(--kogit-inner-padding-small, 20px);
}
.kogit-lnh.kogit-lnh--partner-hero .kogit-lnh__lead,
.kogit-lnh.kogit-lnh--partner-hero .kogit-lnh__body {
flex: none;
width: 100%;
}
.kogit-sp.kogit-sp--partner-overview {
padding-top: var(--kogit-tablet-sektion-padding, 180px);
padding-bottom: 0;
}
/* Tech intro T 1454:16994 — heading only (Figma drops the copy column). */
.kogit-lnh.kogit-lnh--partner-intro .kogit-lnh__inner {
padding-top: var(--kogit-tablet-sektion-padding, 180px);
padding-bottom: 0;
}
.kogit-lnh.kogit-lnh--partner-intro .kogit-lnh__body {
display: none;
}
.kogit-ocs.kogit-ocs--secondary-partners {
padding-top: var(--kogit-innerer-abstand-80, 80px);
padding-bottom: var(--kogit-tablet-kontakt-to-footer, 120px);
}
}
@media (max-width: 599px) {
/*
* Hero stays in normal flow. A fixed crumb y pulled the label up by
* (pad 104 − crumb 20) even after Abstand oben shrank the padding,
* so the heading painted over the breadcrumb.
* Abstand oben = padding. Dachzeile zu Heading = crumb gap.
*/
.kogit-lnh.kogit-lnh--partner-hero .kogit-lnh__inner {
--lnh-pad-top: var(--sp-m-top, 20px);
--lnh-crumb-top: var(--lnh-pad-top);
--lnh-stack-gap: var(--sp-m-heading, var(--kogit-mobile-sektion-padding-fullframe-to-sektion, 80px));
padding-top: var(--lnh-pad-top);
padding-bottom: var(--kogit-innerer-abstand-80, 80px);
gap: var(--lnh-stack-gap);
}
.kogit-lnh.kogit-lnh--partner-hero .kogit-lnh__eyebrow {
margin-top: 0;
margin-bottom: calc(var(--lnh-crumb-gap, 40px) - var(--lnh-stack-gap, 80px));
}
.kogit-lnh.kogit-lnh--partner-hero .kogit-lnh__copy-inner {
gap: var(--kogit-inner-padding-small, 20px);
}
.kogit-sp.kogit-sp--partner-overview {
padding-top: 0;
padding-bottom: var(--kogit-mobile-sektion-padding, 160px);
}
.kogit-lnh.kogit-lnh--partner-intro .kogit-lnh__inner {
padding-top: 0;
padding-bottom: 0;
}
.kogit-ocs.kogit-ocs--secondary-partners {
padding-top: var(--kogit-innerer-abstand-40, 40px);
padding-bottom: var(--kogit-mobile-kontakt-to-footer, 120px);
}
}
/*
* "Bild KI generiert" — right-aligned, directly under the image (not on it).
* The reserved slot keeps date, title and arrow aligned in every overview
* card, including posts without an AI label.
*/
.kogit-ai-badge-slot {
display: flex;
align-items: flex-start;
box-sizing: border-box;
width: 100%;
min-height: calc(10px + var(--kogit-type-caption-lh, 22px));
}
.kogit-ai-badge {
position: static;
z-index: 1;
display: flex;
align-items: center;
align-self: stretch;
justify-content: flex-end;
box-sizing: border-box;
width: 100%;
max-width: 100%;
margin: 10px 0 0;
color: var(--wp--preset--color--black, #0b0b0b);
white-space: nowrap;
pointer-events: none;
}
/* Full-bleed slider: the photo is the card, so the mark stays at its lower right. */
.kogit-innovation-deck-slider__slide-media > .kogit-ai-badge {
position: absolute;
right: 10px;
bottom: 10px;
width: auto;
max-width: calc(100% - 20px);
margin: 0;
}
/*
* Abstand panel — Standard (Design) on tablet and mobile.
* Only Abstand oben / Abstand unten. Saved --sp-* values stay:
* block rules use !important and a stronger selector.
* Heroes and Ready to Control are separate.
*/
@media (min-width: 600px) and (max-width: 1023px) {
.wp-block-kogit-about-us,
.wp-block-kogit-bausteine,
.wp-block-kogit-big-accordions,
.wp-block-kogit-black-box-academy,
.wp-block-kogit-black-building-blocks,
.wp-block-kogit-case-body,
.wp-block-kogit-case-hero,
.wp-block-kogit-case-related,
.wp-block-kogit-claim-black,
.wp-block-kogit-company-people,
.wp-block-kogit-describe-team,
.wp-block-kogit-detect-what-matters,
.wp-block-kogit-eventbanner,
.wp-block-kogit-example-image,
.wp-block-kogit-faq,
.wp-block-kogit-five-steps,
.wp-block-kogit-govern-challenges,
.wp-block-kogit-human-non-human-managements,
.wp-block-kogit-innovation-deck-slider,
.wp-block-kogit-lagebild,
.wp-block-kogit-latest-news,
.wp-block-kogit-learn-discuss-reply,
.wp-block-kogit-next-step,
.wp-block-kogit-our-clients-slider,
.wp-block-kogit-post-body,
.wp-block-kogit-post-hero,
.wp-block-kogit-principle,
.wp-block-kogit-principles-black,
.wp-block-kogit-section-highlight,
.wp-block-kogit-section-numbers-partner,
.wp-block-kogit-section-quote-block,
.wp-block-kogit-section-shield-content,
.wp-block-kogit-solutions,
.wp-block-kogit-statement,
.wp-block-kogit-strategic-partners,
.wp-block-kogit-team-members-editorial,
.wp-block-kogit-team-members-grid,
.wp-block-kogit-team-members-row,
.wp-block-kogit-author-archive-posts,
.wp-block-kogit-impressum-content,
.wp-block-kogit-kontakt-content,
.wp-block-kogit-cases-archive-posts,
.wp-block-kogit-latest-news-content {
padding-top: 0 !important;
padding-bottom: 180px !important;
}
/*
* Typical Focus: white __wrap owns py 80 — do not strip it.
* Section outer bottom stays 0 (next block owns the gap).
*/
.wp-block-kogit-typical-focus-areas {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.wp-block-kogit-impressum-content .kogit-ic__inner,
.wp-block-kogit-kontakt-content .kogit-kc__inner,
.wp-block-kogit-cases-archive-posts .kogit-cap__inner,
.wp-block-kogit-latest-news-content .kogit-lnc__inner {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.wp-block-kogit-ready-to-control {
padding-top: 0 !important;
padding-bottom: 120px !important;
}
}
@media (max-width: 599px) {
.wp-block-kogit-about-us,
.wp-block-kogit-bausteine,
.wp-block-kogit-big-accordions,
.wp-block-kogit-black-box-academy,
.wp-block-kogit-black-building-blocks,
.wp-block-kogit-case-body,
.wp-block-kogit-case-hero,
.wp-block-kogit-case-related,
.wp-block-kogit-claim-black,
.wp-block-kogit-company-people,
.wp-block-kogit-describe-team,
.wp-block-kogit-detect-what-matters,
.wp-block-kogit-eventbanner,
.wp-block-kogit-example-image,
.wp-block-kogit-faq,
.wp-block-kogit-five-steps,
.wp-block-kogit-govern-challenges,
.wp-block-kogit-human-non-human-managements,
.wp-block-kogit-innovation-deck-slider,
.wp-block-kogit-lagebild,
.wp-block-kogit-latest-news,
.wp-block-kogit-learn-discuss-reply,
.wp-block-kogit-next-step,
.wp-block-kogit-our-clients-slider,
.wp-block-kogit-post-body,
.wp-block-kogit-post-hero,
.wp-block-kogit-principle,
.wp-block-kogit-principles-black,
.wp-block-kogit-section-highlight,
.wp-block-kogit-section-numbers-partner,
.wp-block-kogit-section-quote-block,
.wp-block-kogit-section-shield-content,
.wp-block-kogit-solutions,
.wp-block-kogit-statement,
.wp-block-kogit-strategic-partners,
.wp-block-kogit-team-members-editorial,
.wp-block-kogit-team-members-grid,
.wp-block-kogit-team-members-row,
.wp-block-kogit-author-archive-posts,
.wp-block-kogit-impressum-content,
.wp-block-kogit-kontakt-content,
.wp-block-kogit-cases-archive-posts,
.wp-block-kogit-latest-news-content {
padding-top: 0 !important;
padding-bottom: 160px !important;
}
/* Typical Focus — same as tablet: wrap keeps py, section pb 0. */
.wp-block-kogit-typical-focus-areas {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.wp-block-kogit-impressum-content .kogit-ic__inner,
.wp-block-kogit-kontakt-content .kogit-kc__inner,
.wp-block-kogit-cases-archive-posts .kogit-cap__inner,
.wp-block-kogit-latest-news-content .kogit-lnc__inner {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.wp-block-kogit-ready-to-control {
padding-top: 0 !important;
padding-bottom: 120px !important;
}
}