/* ═══════════════════════════════════════════════════════════
   Montserrat - lokal ausgeliefert
   Fruehere Einbindung ueber fonts.googleapis.com uebertrug bei
   jedem Seitenaufruf die IP-Adresse des Besuchers an Google,
   ohne Einwilligung. Seit dem Umstieg auf lokale Dateien laedt
   die Seite keine Drittanbieter-Ressourcen mehr und kommt ohne
   Cookie-Banner aus.

   Es sind bewusst nur zwei Dateien: Google liefert Montserrat
   als Variable Font aus, eine Datei deckt den gesamten Bereich
   300-800 ab. Die sechs Gewichte einzeln zu laden hiesse, sechs
   mal dieselben Bytes zu holen (637 KB statt 106 KB).

   unicode-range stammt unveraendert aus Googles Stylesheet, der
   Browser laedt latin-ext damit nur bei Bedarf nach.
   Montserrat steht unter der SIL Open Font License 1.1.
═══════════════════════════════════════════════════════════ */

@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 300 800;
    font-display: swap;
    src: url('../fonts/montserrat-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 300 800;
    font-display: swap;
    src: url('../fonts/montserrat-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── Reset & Base ───────────────────────────────────────── */
.fortiva * , .fortiva *::before, .fortiva *::after { box-sizing: border-box; }
.fortiva .wp-block-group,
.fortiva .wp-block-columns,
.fortiva .wp-block-column,
.fortiva .wp-block-image,
.fortiva .wp-block-heading,
.fortiva .wp-block-paragraph,
.fortiva figure { margin: 0; padding: 0; }
.fortiva .wp-block-image img { width: 100%; }
.fortiva { -webkit-font-smoothing: antialiased; overflow-x: hidden; }
.fortiva a { text-decoration: none; color: inherit; }
.fortiva img { display: block; max-width: 100%; }
.fortiva ul { list-style: none; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

/* ── Layout ─────────────────────────────────────────────── */
.fortiva .wrap {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding-left: 3rem;
    padding-right: 3rem;
}

/* ── Eyebrow Labels ─────────────────────────────────────── */
.fortiva .eyebrow {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--wp--preset--color--blue);
    margin-bottom: 1.25rem;
}
.fortiva .eyebrow--dim { color: rgba(255,255,255,0.55); }

/* ── Buttons ────────────────────────────────────────────── */
.fortiva .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.9rem 2rem;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border: none;
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(.16,1,.3,1);
    white-space: nowrap;
}
.fortiva .btn-solid {
    background: var(--wp--preset--color--blue);
    color: var(--wp--preset--color--white);
}
.fortiva .btn-solid:hover {
    background: var(--wp--preset--color--blue-mid);
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(7,46,87,0.4);
    color: var(--wp--preset--color--white);
}
/* Der Ghost-Button stand fest auf Weiss und war dadurch auf jedem hellen
   Grund unsichtbar - betraf "Alle Leistungen im Detail" auf der Startseite
   und "Alle Referenzen ansehen" auf allen vier Leistungsseiten.
   Jetzt ist die dunkle Variante der Standard, weil sie auf hellem Grund
   sicher ist; dunkle Sektionen setzen die Variablen unten selbst um. */
.fortiva .btn-ghost {
    background: transparent;
    color: var(--fortiva-ghost-fg, var(--wp--preset--color--blue));
    border: 1.5px solid var(--fortiva-ghost-border, rgba(7,46,87,0.45));
}
.fortiva .btn-ghost:hover {
    border-color: var(--fortiva-ghost-fg, var(--wp--preset--color--blue));
    background: var(--fortiva-ghost-hover, rgba(7,46,87,0.06));
}
.fortiva .hero,
.fortiva .delivery,
.fortiva .contact,
.fortiva .ref-hero,
.fortiva .ref-cta,
.fortiva .site-footer {
    --fortiva-ghost-fg: var(--wp--preset--color--white);
    --fortiva-ghost-border: rgba(255,255,255,0.45);
    --fortiva-ghost-hover: rgba(255,255,255,0.08);
}

/* ═══════════════════════════════════════════════════════════
   HEADER
═══════════════════════════════════════════════════════════ */
.fortiva .site-header {
    position: fixed;
    top: 0; left: 0;
    width: 100%;
    z-index: 900;
    padding: 1.5rem 0;
    transition: background 0.4s cubic-bezier(.16,1,.3,1),
                box-shadow 0.4s cubic-bezier(.16,1,.3,1),
                padding   0.3s cubic-bezier(.16,1,.3,1);
}
.fortiva .site-header.scrolled {
    background: rgba(255,255,255,0.97);
    backdrop-filter: blur(14px);
    box-shadow: 0 1px 0 rgba(0,0,0,0.07);
    padding: 1rem 0;
}
.fortiva .site-header .wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fortiva .header-logo {
    display: block;
    position: relative;
    height: 38px;
    flex-shrink: 0;
}
.fortiva .header-logo img {
    height: 38px;
    width: auto;
    max-width: none;
    transition: opacity 0.3s cubic-bezier(.16,1,.3,1);
}
.fortiva .site-header:not(.scrolled) .logo-light { opacity: 1; display: block; }
.fortiva .site-header:not(.scrolled) .logo-dark  { opacity: 0; display: none; }
.fortiva .site-header.scrolled .logo-light { opacity: 0; display: none; }
.fortiva .site-header.scrolled .logo-dark  { opacity: 1; display: block; }

.fortiva .header-nav {
    display: flex;
    align-items: center;
    gap: 2.5rem;
}
.fortiva .nav-links {
    display: flex;
    gap: 2.25rem;
}
.fortiva .nav-links a {
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.8);
    transition: color 0.2s;
}
.fortiva .nav-links a:hover { color: var(--wp--preset--color--white); }
.fortiva .site-header.scrolled .nav-links a { color: var(--wp--preset--color--muted); }
.fortiva .site-header.scrolled .nav-links a:hover { color: var(--wp--preset--color--blue); }

/* Hamburger button — hidden on desktop */
.fortiva .nav-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 36px;
    height: 36px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
    flex-shrink: 0;
}
.fortiva .nav-toggle span {
    display: block;
    width: 100%;
    height: 2px;
    background: var(--wp--preset--color--white);
    border-radius: 2px;
    transition: transform 0.3s cubic-bezier(.16,1,.3,1), opacity 0.2s;
    transform-origin: center;
}
.fortiva .site-header.scrolled .nav-toggle span { background: var(--wp--preset--color--blue); }

/* Open state */
.fortiva .site-header.nav-open .nav-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.fortiva .site-header.nav-open .nav-toggle span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.fortiva .site-header.nav-open .nav-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Mobile nav drawer — absolute to header, slides down below it */
.fortiva .mobile-nav {
    display: none;
    position: absolute;
    top: 100%; left: 0; right: 0;
    background: rgba(4,12,24,0.98);
    backdrop-filter: blur(12px);
    padding: 1.5rem 2rem 2rem;
    z-index: 850;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-8px);
    transition: opacity 0.25s cubic-bezier(.16,1,.3,1),
                transform 0.25s cubic-bezier(.16,1,.3,1);
    border-top: 1px solid rgba(255,255,255,0.07);
    box-shadow: 0 16px 40px rgba(0,0,0,0.5);
    /* Das Menue ist 563px hoch und ragt auf Geraeten unter ~650px Hoehe
       unten heraus. Da die Seite dahinter bei offenem Menue gesperrt wird,
       muss es selbst scrollen koennen - sonst waeren die letzten Eintraege
       nicht erreichbar. dvh beruecksichtigt die Browserleisten auf Mobil. */
    max-height: calc(100vh - 86px);
    max-height: calc(100dvh - 86px);
    overflow-y: auto;
    overscroll-behavior: contain;
}

/* Sperrt die Seite hinter dem offenen Menue. overflow auf <body> allein
   greift nicht, wenn <html> der Scroll-Container ist. */
html.fortiva-nav-locked,
html.fortiva-nav-locked body { overflow: hidden; }
.fortiva .mobile-nav.is-open {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}
.fortiva .mobile-nav ul {
    list-style: none;
    margin: 0 0 1.5rem;
    padding: 0;
}
.fortiva .mobile-nav ul li {
    border-bottom: 1px solid rgba(255,255,255,0.07);
}
.fortiva .mobile-nav ul li a {
    display: block;
    padding: 1rem 0;
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.8);
    transition: color 0.2s;
}
.fortiva .mobile-nav ul li a:hover { color: var(--wp--preset--color--white); }
.fortiva .mobile-nav .btn-solid { width: 100%; justify-content: center; }

/* ── Dropdown "Leistungen" ──────────────────────────────── */
.fortiva .nav-links .has-submenu { position: relative; }
.fortiva .nav-caret {
    display: inline-block;
    width: 0; height: 0;
    margin-left: 0.3rem;
    vertical-align: middle;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid currentColor;
    opacity: 0.6;
    transition: transform 0.25s;
}
.fortiva .has-submenu:hover .nav-caret,
.fortiva .has-submenu:focus-within .nav-caret { transform: rotate(180deg); }
.fortiva .submenu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, 8px);
    min-width: 290px;
    padding: 0.5rem 0;
    background: rgba(255,255,255,0.98);
    backdrop-filter: blur(14px);
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 4px;
    box-shadow: 0 18px 44px rgba(7,46,87,0.16);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.22s cubic-bezier(.16,1,.3,1), transform 0.22s cubic-bezier(.16,1,.3,1);
}
/* Unsichtbare Bruecke, damit der Zeiger die Luecke queren kann */
.fortiva .has-submenu::after {
    content: "";
    position: absolute;
    top: 100%; left: 0; right: 0;
    height: 14px;
}
.fortiva .has-submenu:hover .submenu,
.fortiva .has-submenu:focus-within .submenu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate(-50%, 4px);
}
.fortiva .submenu li { display: block; }
.fortiva .submenu a {
    display: flex;
    align-items: baseline;
    gap: 0.625rem;
    padding: 0.6rem 1.25rem;
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    color: var(--wp--preset--color--text);
    white-space: nowrap;
}
.fortiva .site-header .submenu a,
.fortiva .site-header.scrolled .submenu a { color: var(--wp--preset--color--text); }
.fortiva .site-header .submenu a:hover,
.fortiva .site-header.scrolled .submenu a:hover {
    background: var(--wp--preset--color--surface);
    color: var(--wp--preset--color--blue);
}
.fortiva .submenu-num {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--wp--preset--color--muted);
}
.fortiva .submenu .submenu-child a {
    padding-left: 3rem;
    font-weight: 500;
    color: var(--wp--preset--color--muted);
}
.fortiva .submenu .submenu-all {
    margin-top: 0.375rem;
    padding-top: 0.375rem;
    border-top: 1px solid var(--wp--preset--color--border);
}
.fortiva .submenu .submenu-all a {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--wp--preset--color--blue);
}

/* Mobile: Leistungen als aufgeklappte Gruppe */
.fortiva .mobile-nav .mobile-group > ul {
    margin: 0.5rem 0 0.25rem;
    padding-left: 0.875rem;
    border-left: 1px solid rgba(255,255,255,0.16);
}
.fortiva .mobile-nav .mobile-group > ul li a {
    font-size: 0.9375rem;
    font-weight: 500;
    color: rgba(255,255,255,0.62);
    padding: 0.45rem 0;
}
.fortiva .mobile-nav .mobile-group > ul li a:hover { color: var(--wp--preset--color--white); }

/* ═══════════════════════════════════════════════════════════
   HERO
═══════════════════════════════════════════════════════════ */
.fortiva .hero {
    position: relative;
    min-height: 100vh;
    background: var(--wp--preset--color--blue-deep);
    overflow: hidden;
    display: flex;
    align-items: center;
}
.fortiva .hero-visual {
    position: absolute;
    top: 0; right: 0;
    width: 52%;
    height: 100%;
    pointer-events: none;
}
.fortiva .hero-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.45;
}
.fortiva .hero-visual::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(105deg, var(--wp--preset--color--blue-deep) 0%, var(--wp--preset--color--blue-deep) 8%, rgba(3,14,28,0.6) 45%, transparent 80%);
    z-index: 1;
}
.fortiva .hero-visual::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, var(--wp--preset--color--blue-deep) 0%, transparent 30%);
    z-index: 1;
}
.fortiva .hero .wrap {
    position: relative;
    z-index: 2;
    padding-top: 11rem;
    padding-bottom: 8rem;
}
.fortiva .hero-content { max-width: 600px; }
.fortiva .hero-tag {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 2.25rem;
    opacity: 0;
    animation: fortivaFadeUp 0.6s cubic-bezier(.16,1,.3,1) 0.1s forwards;
}
.fortiva .hero-tag::before {
    content: '';
    display: block;
    width: 36px;
    height: 1.5px;
    background: rgba(255,255,255,0.35);
    flex-shrink: 0;
}
.fortiva .hero-tag span {
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.45);
}
.fortiva .hero h1 {
    font-size: clamp(3.25rem, 6vw, 5.75rem);
    font-weight: 800;
    line-height: 0.97;
    letter-spacing: -0.025em;
    color: var(--wp--preset--color--white);
    margin-bottom: 2.25rem;
    opacity: 0;
    animation: fortivaFadeUp 0.7s cubic-bezier(.16,1,.3,1) 0.25s forwards;
}
.fortiva .hero h1 .dim { color: rgba(255,255,255,0.42); }
.fortiva .hero-sub {
    font-size: 1.0625rem;
    font-weight: 400;
    line-height: 1.8;
    color: rgba(255,255,255,0.65);
    max-width: 480px;
    margin-bottom: 2.75rem;
    opacity: 0;
    animation: fortivaFadeUp 0.7s cubic-bezier(.16,1,.3,1) 0.4s forwards;
}
.fortiva .hero-actions {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    opacity: 0;
    animation: fortivaFadeUp 0.7s cubic-bezier(.16,1,.3,1) 0.55s forwards;
}
.fortiva .hero-scroll {
    position: absolute;
    bottom: 3rem;
    left: 3rem;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    opacity: 0;
    animation: fortivaFadeUp 0.6s cubic-bezier(.16,1,.3,1) 1s forwards;
    z-index: 2;
}
.fortiva .hero-scroll span {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.6);
}
.fortiva .scroll-line {
    width: 40px;
    height: 1px;
    background: rgba(255,255,255,0.2);
    position: relative;
    overflow: hidden;
}
.fortiva .scroll-line::after {
    content: '';
    position: absolute;
    top: 0; left: -100%;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,0.7);
    animation: fortivaScrollPulse 2s ease-in-out 1.5s infinite;
}

/* ═══════════════════════════════════════════════════════════
   STATS STRIP
═══════════════════════════════════════════════════════════ */
.fortiva .stats-strip {
    background: var(--wp--preset--color--white);
    border-bottom: 1px solid var(--wp--preset--color--border);
}
.fortiva .stats-inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}
.fortiva .stat-cell {
    padding: 3rem 2rem;
    border-right: 1px solid var(--wp--preset--color--border);
    text-align: center;
}
.fortiva .stat-cell:last-child { border-right: none; }
.fortiva .stat-number {
    display: block;
    font-size: clamp(2.25rem, 3.5vw, 3.25rem);
    font-weight: 800;
    color: var(--wp--preset--color--blue);
    letter-spacing: -0.03em;
    line-height: 1;
    margin-bottom: 0.5rem;
}
.fortiva .stat-label {
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wp--preset--color--muted);
}

/* ═══════════════════════════════════════════════════════════
   CORE SERVICES
═══════════════════════════════════════════════════════════ */
.fortiva .services {
    padding: 8rem 0 7rem;
}
.fortiva .services-head {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: end;
    margin-bottom: 5rem;
    padding-bottom: 3rem;
    border-bottom: 1px solid var(--wp--preset--color--border);
}
.fortiva .services-head h2 {
    font-size: clamp(2rem, 3vw, 2.875rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.025em;
    color: var(--wp--preset--color--black);
    margin: 0;
}
.fortiva .services-head p {
    font-size: 1rem;
    line-height: 1.8;
    color: var(--wp--preset--color--muted);
    margin: 0;
}
.fortiva .service-row {
    display: grid;
    grid-template-columns: 72px 1fr 40px;
    align-items: center;
    gap: 2.5rem;
    padding: 2.25rem 1.5rem;
    border-bottom: 1px solid var(--wp--preset--color--border);
    border-radius: 2px;
    cursor: pointer;
    transition: background 0.28s cubic-bezier(.16,1,.3,1),
                padding   0.28s cubic-bezier(.16,1,.3,1),
                border-color 0.28s;
}
.fortiva .service-row:first-child { border-top: 1px solid var(--wp--preset--color--border); }
.fortiva .service-row:hover {
    background: var(--wp--preset--color--blue);
    border-color: var(--wp--preset--color--blue);
    padding-left: 2.25rem;
    padding-right: 2.25rem;
}
.fortiva .service-row:hover + .service-row { border-top: none; }
.fortiva .service-row:hover .svc-num   { color: rgba(255,255,255,0.25); }
.fortiva .service-row:hover .svc-name  { color: var(--wp--preset--color--white); }
.fortiva .service-row:hover .svc-body  { color: rgba(255,255,255,0.65); }
.fortiva .service-row:hover .svc-arrow { opacity: 1; color: var(--wp--preset--color--white); transform: translateX(5px); }
.fortiva .svc-num {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: var(--wp--preset--color--muted);
    transition: color 0.28s;
}
.fortiva .svc-name {
    font-size: 1.1875rem;
    font-weight: 600;
    color: var(--wp--preset--color--black);
    margin-bottom: 0.35rem;
    transition: color 0.28s;
}
.fortiva .svc-body {
    font-size: 0.9375rem;
    line-height: 1.65;
    color: var(--wp--preset--color--muted);
    transition: color 0.28s;
}
/* Vorher opacity:0 - die vier Leistungszeilen sind die wichtigsten Links
   der Startseite, hatten im Ruhezustand aber keinerlei Klick-Hinweis.
   Auf Touchgeraeten gibt es keinen Hover, dort fehlte er dauerhaft. */
.fortiva .svc-arrow {
    font-size: 1.2rem;
    color: var(--wp--preset--color--blue);
    opacity: 0.45;
    transition: all 0.28s cubic-bezier(.16,1,.3,1);
    text-align: right;
}

/* ═══════════════════════════════════════════════════════════
   DELIVERY MODEL
═══════════════════════════════════════════════════════════ */
.fortiva .delivery {
    background: var(--wp--preset--color--blue);
    overflow: hidden;
}
.fortiva .delivery-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.fortiva .delivery-img {
    position: relative;
    overflow: hidden;
    min-height: 600px;
}
.fortiva .delivery-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    mix-blend-mode: luminosity;
    opacity: 0.35;
    transition: opacity 0.5s;
    position: absolute;
    inset: 0;
}
.fortiva .delivery-img:hover img { opacity: 0.45; }
.fortiva .delivery-img::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, transparent 60%, var(--wp--preset--color--blue) 100%);
    pointer-events: none;
    z-index: 1;
}
.fortiva .delivery-copy {
    padding: 7rem 4rem 7rem 5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.fortiva .delivery-copy h2 {
    font-size: clamp(1.875rem, 2.5vw, 2.625rem);
    font-weight: 700;
    color: var(--wp--preset--color--white);
    line-height: 1.15;
    letter-spacing: -0.02em;
    margin: 0 0 1.5rem;
}
.fortiva .delivery-copy p {
    font-size: 1rem;
    line-height: 1.85;
    color: rgba(255,255,255,0.65);
    margin: 0 0 0.875rem;
}
.fortiva .feat-list { margin-top: 2.25rem; }
.fortiva .feat-list li {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.125rem 0;
    border-top: 1px solid rgba(255,255,255,0.1);
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--wp--preset--color--white);
}
.fortiva .feat-list li .dot {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 1.5px solid rgba(255,255,255,0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 0.6rem;
    color: rgba(255,255,255,0.7);
    margin-top: 1px;
}

/* ═══════════════════════════════════════════════════════════
   SECONDARY SERVICE
═══════════════════════════════════════════════════════════ */
.fortiva .secondary {
    padding: 4.5rem 0;
    border-bottom: 1px solid var(--wp--preset--color--border);
}
.fortiva .secondary .wrap {
    display: flex;
    align-items: center;
    gap: 3.5rem;
}
.fortiva .sec-badge {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--wp--preset--color--surface);
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 2px;
    padding: 0.4rem 0.9rem;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--wp--preset--color--muted);
}
.fortiva .sec-divider {
    width: 1px;
    height: 48px;
    background: var(--wp--preset--color--border);
    flex-shrink: 0;
}
.fortiva .sec-content h3 {
    font-size: 1.1875rem;
    font-weight: 700;
    color: var(--wp--preset--color--black);
    margin: 0 0 0.45rem;
    letter-spacing: -0.01em;
}
.fortiva .sec-content p {
    font-size: 0.9375rem;
    line-height: 1.7;
    color: var(--wp--preset--color--muted);
    max-width: 680px;
    margin: 0;
}

/* ═══════════════════════════════════════════════════════════
   TEAM / ANSPRECHPARTNERIN
═══════════════════════════════════════════════════════════ */
.fortiva .team {
    padding: 5rem 0;
    border-bottom: 1px solid var(--wp--preset--color--border);
}
.fortiva .team-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 4rem;
    align-items: center;
}
.fortiva .team-copy h3 {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--wp--preset--color--black);
    line-height: 1.2;
    letter-spacing: -0.01em;
    margin: 0 0 1rem;
}
.fortiva .team-copy p {
    font-size: 0.9375rem;
    line-height: 1.85;
    color: var(--wp--preset--color--muted);
    max-width: 520px;
    margin: 0;
}
.fortiva .team-card {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    background: var(--wp--preset--color--surface);
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 4px;
    padding: 1.75rem;
}
.fortiva .team-photo {
    flex-shrink: 0;
    width: 96px;
    height: 96px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--wp--preset--color--border);
}
.fortiva .team-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.fortiva .team-name {
    font-size: 1.0625rem;
    font-weight: 700;
    color: var(--wp--preset--color--black);
    margin-bottom: 0.5rem;
}
.fortiva .team-roles {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}
.fortiva .team-roles li {
    font-size: 0.8125rem;
    line-height: 1.4;
    color: var(--wp--preset--color--muted);
}
/* ═══════════════════════════════════════════════════════════
   CONTACT / CTA
═══════════════════════════════════════════════════════════ */
/* Vorher black (#080808): ein neutrales Schwarz zwischen zwei
   blaustichigen dunklen Flaechen (Hero #030E1C, Ansatz #072E57).
   blue-deep schliesst die Seite in derselben Farbe, in der sie oeffnet. */
.fortiva .contact {
    background: var(--wp--preset--color--blue-deep);
    padding: 8rem 0;
}
.fortiva .contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6rem;
    align-items: start;
}
.fortiva .contact-text h2 {
    font-size: clamp(2rem, 3vw, 3rem);
    font-weight: 700;
    color: var(--wp--preset--color--white);
    line-height: 1.1;
    letter-spacing: -0.025em;
    margin: 0 0 1.5rem;
}
.fortiva .contact-text p {
    font-size: 1rem;
    line-height: 1.85;
    color: rgba(255,255,255,0.5);
    margin: 0 0 2.5rem;
}
.fortiva .contact-detail {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    margin-bottom: 1rem;
    font-size: 0.9375rem;
    color: rgba(255,255,255,0.5);
}
.fortiva .contact-detail strong {
    color: rgba(255,255,255,0.85);
    font-weight: 600;
}
.fortiva .contact-detail::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--wp--preset--color--blue-mid);
    flex-shrink: 0;
}

/* Form */
.fortiva .cta-form {
    background: rgba(255,255,255,0.035);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 4px;
    padding: 2.75rem;
}
.fortiva .form-group { margin-bottom: 1.375rem; }
.fortiva .form-group label {
    display: block;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.65);
    margin-bottom: 0.5rem;
}
.fortiva .form-group input,
.fortiva .form-group select {
    width: 100%;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 2px;
    padding: 0.875rem 1rem;
    font-family: inherit;
    font-size: 0.9375rem;
    color: var(--wp--preset--color--white);
    transition: border-color 0.2s, box-shadow 0.2s;
    -webkit-appearance: none;
}
.fortiva .form-group input::placeholder { color: rgba(255,255,255,0.45); }
.fortiva .form-group input:focus-visible,
.fortiva .form-group select:focus-visible {
    border-color: rgba(255,255,255,0.75);
    box-shadow: 0 0 0 2px rgba(255,255,255,0.35);
    outline: none;
}
.fortiva .form-group select { cursor: pointer; }
.fortiva .form-group select option { background: #0d0d0d; color: var(--wp--preset--color--white); }
.fortiva .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}
.fortiva .cta-form .btn-solid {
    width: 100%;
    justify-content: center;
    margin-top: 0.625rem;
    padding: 1.05rem;
}
.fortiva .hp-field {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}
.fortiva .form-message {
    padding: 0.75rem 1rem;
    border-radius: 6px;
    font-size: 0.875rem;
    margin-bottom: 1rem;
}
.fortiva .form-message--ok {
    background: rgba(34, 197, 94, 0.15);
    color: #86efac;
    border: 1px solid rgba(34, 197, 94, 0.3);
}
.fortiva .form-message--err {
    background: rgba(239, 68, 68, 0.15);
    color: #fca5a5;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

/* ═══════════════════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════════════════ */
/* Folgt dem Kontaktbereich direkt - beide muessen denselben Ton haben,
   sonst entsteht an der Kante eine sichtbare Naht. */
.fortiva .site-footer {
    background: var(--wp--preset--color--blue-deep);
    padding: 5rem 0 2.5rem;
    border-top: 1px solid rgba(255,255,255,0.04);
}
.fortiva .footer-top {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 4rem;
    padding-bottom: 4rem;
    margin-bottom: 2.5rem;
    border-bottom: 1px solid rgba(255,255,255,0.06);
}
.fortiva .footer-brand .brand-logo {
    height: 52px;
    margin-bottom: 1.5rem;
}
.fortiva .footer-brand p {
    font-size: 0.9rem;
    line-height: 1.8;
    color: rgba(255,255,255,0.6);
    max-width: 290px;
    margin: 0;
}
.fortiva .footer-col h5 {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.62);
    margin: 0 0 1.375rem;
}
.fortiva .footer-col ul li {
    margin-bottom: 0.8rem;
    font-size: 0.9rem;
    color: rgba(255,255,255,0.5);
    line-height: 1.5;
}
.fortiva .footer-col ul li a {
    color: rgba(255,255,255,0.5);
    transition: color 0.2s;
}
.fortiva .footer-col ul li a:hover { color: var(--wp--preset--color--white); }
.fortiva .footer-trust {
    display: flex;
    align-items: center;
    gap: 2rem;
    padding: 2.5rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    margin-bottom: 2.5rem;
}
.fortiva .footer-trust .hiscox-seal {
    height: 80px;
    width: auto;
    flex-shrink: 0;
    opacity: 0.9;
}
.fortiva .footer-trust-text strong {
    display: block;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.28);
    margin-bottom: 0.6rem;
}
.fortiva .footer-trust-text p {
    font-size: 0.875rem;
    color: rgba(255,255,255,0.6);
    line-height: 1.75;
    margin: 0;
    max-width: 680px;
}
.fortiva .footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.8rem;
    color: rgba(255,255,255,0.55);
}

/* ═══════════════════════════════════════════════════════════
   REFERENZEN PAGE
═══════════════════════════════════════════════════════════ */
.fortiva .references-page {
    /* no top padding — ref-hero extends behind the fixed header */
}

.fortiva .ref-hero {
    position: relative;
    background-color: var(--wp--preset--color--black);
    background-size: cover;
    background-position: center;
    padding: 0;
}
.fortiva .ref-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        135deg,
        rgba(7,46,87,0.82) 0%,
        rgba(4,12,24,0.88) 100%
    );
    z-index: 0;
}
.fortiva .ref-hero .wrap {
    position: relative;
    z-index: 1;
    padding-top: calc(72px + 5rem);
    padding-bottom: 5rem;
}
.fortiva .ref-hero .eyebrow { margin-bottom: 1rem; }
.fortiva .ref-hero h1 {
    font-size: clamp(2.25rem, 4vw, 3.5rem);
    font-weight: 700;
    color: var(--wp--preset--color--white);
    letter-spacing: -0.03em;
    line-height: 1.1;
    margin: 0 0 1.25rem;
}
.fortiva .ref-hero p {
    font-size: 1.0625rem;
    line-height: 1.75;
    color: rgba(255,255,255,0.72);
    max-width: 560px;
    margin: 0;
}

.fortiva .ref-cards-section {
    background: #f5f6f8;
    padding: 6rem 0 7rem;
}
.fortiva .ref-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}
.fortiva .ref-card {
    background: #fff;
    border: 1px solid rgba(0,0,0,0.07);
    border-radius: 4px;
    padding: 2.25rem 2rem 2rem;
    display: flex;
    flex-direction: column;
    gap: 1.125rem;
    transition: box-shadow 0.25s cubic-bezier(.16,1,.3,1), transform 0.25s cubic-bezier(.16,1,.3,1);
}
.fortiva .ref-card:hover {
    box-shadow: 0 12px 40px rgba(0,0,0,0.09);
    transform: translateY(-3px);
}

.fortiva .ref-card-top { min-height: 72px; display: flex; align-items: center; }
.fortiva .ref-logo { max-width: 160px; }
.fortiva .ref-logo img {
    max-height: 60px;
    width: auto;
    object-fit: contain;
    object-position: left center;
}
.fortiva .ref-logo--placeholder {
    background: rgba(7,46,87,0.06);
    border-radius: 2px;
    padding: 0.75rem 1.25rem;
}
.fortiva .ref-logo--placeholder span {
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--wp--preset--color--blue);
}

/* Als Kurzlabel gedacht ("Telefonanlage & Fax"), wird aber auch mit ganzen
   Saetzen gefuellt - bei einer Kundenreferenz mit 156 Zeichen, bei den
   Partnern mit 69 bzw. 140. Gesperrte Versalien sind ueber mehrere Zeilen
   kaum lesbar, deshalb normale Schreibweise. Die blaue Farbe traegt die
   Label-Wirkung weiterhin. */
.fortiva .ref-type {
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0;
    color: var(--wp--preset--color--blue);
    padding-top: 0.5rem;
    border-top: 1px solid rgba(0,0,0,0.07);
}

.fortiva .ref-quote {
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--wp--preset--color--blue);
    line-height: 1.5;
    margin: 0;
    flex-grow: 1;
}
.fortiva .ref-quote-mark {
    color: var(--wp--preset--color--blue-mid);
    font-size: 1.25em;
    line-height: 0;
    vertical-align: -0.15em;
}

.fortiva .ref-valued {
    font-size: 0.875rem;
    line-height: 1.65;
    color: rgba(0,0,0,0.6);
    margin: 0;
}

.fortiva .ref-card-footer {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(0,0,0,0.06);
    margin-top: auto;
}
.fortiva .ref-company {
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: rgba(0,0,0,0.6);
    text-transform: uppercase;
}
.fortiva .ref-contact {
    font-size: 0.8rem;
    color: rgba(0,0,0,0.35);
}

.fortiva .ref-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 4rem 0;
    font-size: 1rem;
    color: rgba(0,0,0,0.6);
}

.fortiva .ref-partners-section {
    background: #fff;
    padding: 5rem 0 6rem;
}
.fortiva .ref-partners-section .eyebrow,
.fortiva .ref-partners-section h2 {
    text-align: center;
    display: block;
}
.fortiva .ref-partners-section h2 {
    margin: 0.5rem 0 3rem;
}
.fortiva .ref-partners-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(480px, 1fr));
    gap: 2rem;
}
.fortiva .ref-partner-card {
    background: #fff;
    border: 1px solid var(--wp--preset--color--blue-mid, rgba(7,46,87,0.25));
    border-radius: 4px;
    padding: 2.5rem;
    display: flex;
    /* Bewusst einspaltig: Die Partnertexte (Zitat, Kontext, Einschaetzung)
       sind zu lang, um innerhalb der Kachel noch eine zweite Spalte zu
       vertragen - eine Seitenleiste liess nur ~150px fuer den Text uebrig. */
    flex-direction: column;
    gap: 1.75rem;
    transition: box-shadow 0.25s cubic-bezier(.16,1,.3,1), transform 0.25s cubic-bezier(.16,1,.3,1);
}
.fortiva .ref-partner-card:hover {
    box-shadow: 0 12px 40px rgba(0,0,0,0.09);
    transform: translateY(-3px);
}
/* Festes Raster statt umbrechendem Flex: Bei umbrechendem Flex haengt es
   von der Logobreite ab, ob das Badge noch neben den Namen passt - bei
   Balschun stand es daneben (484px Zeilenbedarf), bei Aegis Core darunter
   (526px bei 494px Platz). Jetzt liegen Logo und Name immer in Zeile 1,
   das Badge in Zeile 2, die Projektart in Zeile 3 - unabhaengig davon,
   wie breit Logo und Firmenname ausfallen. */
.fortiva .ref-partner-side {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 0.875rem 1.25rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(0,0,0,0.07);
}
/* Gleich hohes Logofeld: Die Logos sind unterschiedlich proportioniert
   (300x74 gegen 300x112) und machten die Kopfzeilen sonst 141px gegen
   182px hoch. */
.fortiva .ref-partner-side .ref-logo {
    grid-column: 1;
    height: 60px;
    display: flex;
    align-items: center;
}
.fortiva .ref-partner-side .ref-company {
    grid-column: 2;
    justify-self: start;
    padding-top: 0;
    border-top: 0;
}
.fortiva .ref-partner-side .ref-partner-badge {
    grid-column: 1 / -1;
    justify-self: start;
}
.fortiva .ref-partner-side .ref-type {
    grid-column: 1 / -1;
    border-top: 0;
    padding-top: 0;
}
.fortiva .ref-partner-main {
    display: flex;
    flex-direction: column;
    gap: 1.125rem;
    /* Deckelt die Zeilenlaenge, wenn die Kachel einspaltig ueber die
       volle Breite laeuft - sonst ~90 Zeichen pro Zeile. */
    max-width: 56ch;
}
.fortiva .ref-partner-badge {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--wp--preset--color--blue);
    background: rgba(7,46,87,0.06);
    border-radius: 2px;
    padding: 0.3rem 0.6rem;
}
.fortiva .ref-partner-context {
    font-size: 0.875rem;
    line-height: 1.65;
    color: rgba(0,0,0,0.55);
    margin: 0;
}

.fortiva .ref-cta {
    background: var(--wp--preset--color--blue);
    padding: 3.5rem 0;
}
.fortiva .ref-cta .wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
}
.fortiva .ref-cta p {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--wp--preset--color--white);
    margin: 0;
}
.fortiva .ref-cta .btn-solid {
    background: var(--wp--preset--color--white);
    color: var(--wp--preset--color--blue);
    flex-shrink: 0;
}
.fortiva .ref-cta .btn-solid:hover {
    background: rgba(255,255,255,0.9);
    box-shadow: 0 10px 28px rgba(0,0,0,0.2);
}


/* ═══════════════════════════════════════════════════════════
   LEISTUNGEN – DETAILSEITE
   ═══════════════════════════════════════════════════════════ */
.fortiva .services-page { background: var(--wp--preset--color--white); }

/* Sticky Sprungnavigation */
.fortiva .svc-subnav {
    position: sticky;
    top: 72px;
    z-index: 800;
    background: rgba(255,255,255,0.97);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--wp--preset--color--border);
}
.fortiva .svc-subnav ul {
    display: flex;
    gap: 2.5rem;
    overflow-x: auto;
    scrollbar-width: none;
}
.fortiva .svc-subnav ul::-webkit-scrollbar { display: none; }
.fortiva .svc-subnav ul li { flex: 0 0 auto; }
.fortiva .svc-subnav a {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 1.25rem 0;
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--wp--preset--color--muted);
    border-bottom: 2px solid transparent;
    white-space: nowrap;
    transition: color 0.25s, border-color 0.25s;
}
.fortiva .svc-subnav a:hover,
.fortiva .svc-subnav a.is-active {
    color: var(--wp--preset--color--blue);
    border-bottom-color: var(--wp--preset--color--blue);
}
.fortiva .svc-subnav-num {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--wp--preset--color--border);
}
.fortiva .svc-subnav a:hover .svc-subnav-num,
.fortiva .svc-subnav a.is-active .svc-subnav-num { color: var(--wp--preset--color--blue-mid); }

/* Uebersicht: Karten je Leistung */
.fortiva .svc-overview { padding: 5rem 0 6rem; }
.fortiva .svc-cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
}
.fortiva .svc-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 4px;
    overflow: hidden;
    transition: transform 0.28s cubic-bezier(.16,1,.3,1), box-shadow 0.28s cubic-bezier(.16,1,.3,1);
}
.fortiva .svc-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 44px rgba(7,46,87,0.14);
}
.fortiva .svc-card-media { position: relative; background: var(--wp--preset--color--blue-deep); }
.fortiva .svc-card-media img {
    width: 100%;
    height: 190px;
    object-fit: cover;
    opacity: 0.85;
    transition: opacity 0.4s cubic-bezier(.16,1,.3,1), transform 0.6s cubic-bezier(.16,1,.3,1);
}
.fortiva .svc-card-media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, rgba(7,46,87,0.6) 0%, rgba(3,14,28,0.2) 60%, rgba(3,14,28,0.05) 100%);
}
.fortiva .svc-card:hover .svc-card-media img { opacity: 1; transform: scale(1.03); }
.fortiva .svc-card-num {
    position: absolute;
    left: 1.75rem;
    bottom: 1.25rem;
    z-index: 1;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    color: rgba(255,255,255,0.75);
}
.fortiva .svc-card-body {
    padding: 2rem 1.75rem 2.25rem;
    display: flex;
    flex-direction: column;
    flex: 1;
}
.fortiva .svc-card-body h2 {
    font-size: 1.375rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
    color: var(--wp--preset--color--blue);
    margin: 0;
}
.fortiva .svc-card-claim {
    margin: 0.5rem 0 1rem;
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--wp--preset--color--blue-mid);
}
.fortiva .svc-card-teaser {
    margin: 0 0 1.5rem;
    font-size: 0.9375rem;
    line-height: 1.75;
    color: var(--wp--preset--color--text);
}
.fortiva .svc-card-more {
    margin-top: auto;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--wp--preset--color--blue);
}
.fortiva .svc-card:hover .svc-card-more span { display: inline-block; transform: translateX(4px); transition: transform 0.25s; }

/* Detailseite: Kopfbereich */
.fortiva .svc-single-hero {
    position: relative;
    background-color: var(--wp--preset--color--blue-deep);
    background-size: cover;
    background-position: center;
}
.fortiva .svc-single-hero .wrap {
    position: relative;
    z-index: 1;
    padding-top: calc(72px + 4rem);
    padding-bottom: 4rem;
}
.fortiva .svc-crumb {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.45);
    margin-bottom: 1.25rem;
}
.fortiva .svc-crumb a { color: rgba(255,255,255,0.7); }
.fortiva .svc-crumb a:hover { color: var(--wp--preset--color--white); }
.fortiva .svc-single-num {
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    color: rgba(255,255,255,0.35);
    margin-bottom: 0.5rem;
}
.fortiva .svc-single-hero h1 {
    font-size: clamp(2rem, 4vw, 3.25rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.1;
    color: var(--wp--preset--color--white);
    margin: 0;
}
.fortiva .svc-single-claim {
    margin: 1rem 0 0;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.6;
    color: rgba(255,255,255,0.88);
    max-width: 640px;
}
.fortiva .services-single .svc-detail-body { margin-left: 0; }
.fortiva .services-single .svc-detail { padding-top: 4.5rem; }

/* Referenzen auf der Leistungsseite */
.fortiva .svc-refs {
    background: var(--wp--preset--color--surface);
    padding: 5rem 0;
}
.fortiva .svc-refs h2 {
    font-size: 1.75rem;
    font-weight: 700;
    letter-spacing: -0.025em;
    color: var(--wp--preset--color--blue);
    margin: 0.75rem 0 2.5rem;
}
.fortiva .svc-refs-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
    margin-bottom: 2.5rem;
}
.fortiva .svc-ref-card {
    background: #fff;
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 4px;
    padding: 2rem;
}
.fortiva .svc-ref-card .ref-logo { margin-bottom: 1.25rem; }
.fortiva .svc-ref-card .ref-quote { margin-top: 1rem; }

/* Blaettern zwischen den Leistungen */
.fortiva .svc-pager { border-top: 1px solid var(--wp--preset--color--border); }
.fortiva .svc-pager .wrap {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}
.fortiva .svc-pager-link {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    max-width: 45%;
}
.fortiva .svc-pager-next { text-align: right; align-items: flex-end; }
.fortiva .svc-pager-dir {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--wp--preset--color--muted);
}
.fortiva .svc-pager-title {
    font-size: 1.0625rem;
    font-weight: 700;
    letter-spacing: -0.015em;
    color: var(--wp--preset--color--blue);
}
.fortiva .svc-pager-link:hover .svc-pager-title { color: var(--wp--preset--color--blue-mid); }

/* VoiceBridge: Migration in drei Schritten */
.fortiva .svc-steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    margin-top: 3.5rem;
}
.fortiva .svc-step {
    background: var(--wp--preset--color--surface);
    border-radius: 4px;
    padding: 2rem 1.75rem;
}
.fortiva .svc-step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px; height: 34px;
    border-radius: 50%;
    background: var(--wp--preset--color--blue);
    color: var(--wp--preset--color--white);
    font-size: 0.875rem;
    font-weight: 700;
    margin-bottom: 1.125rem;
}
.fortiva .svc-step h2 {
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: -0.015em;
    color: var(--wp--preset--color--blue);
    margin: 0 0 0.625rem;
}
.fortiva .svc-step p {
    font-size: 0.9375rem;
    line-height: 1.75;
    color: var(--wp--preset--color--text);
    margin: 0;
}

/* VoiceBridge: Gegenueberstellung */
.fortiva .svc-compare { margin-top: 4rem; }
.fortiva .svc-compare h2 {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--wp--preset--color--blue);
    margin: 0 0 1.75rem;
}
.fortiva .svc-compare-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
}
.fortiva .svc-compare-col {
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 4px;
    padding: 2rem;
}
.fortiva .svc-compare-col--accent {
    background: var(--wp--preset--color--blue);
    border-color: var(--wp--preset--color--blue);
}
.fortiva .svc-compare-col h3 {
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--wp--preset--color--blue);
    margin: 0 0 1.125rem;
}
.fortiva .svc-compare-col--accent h3 { color: var(--wp--preset--color--white); }
.fortiva .svc-compare-col li {
    position: relative;
    padding: 0.55rem 0 0.55rem 1.5rem;
    font-size: 0.9375rem;
    line-height: 1.6;
    color: var(--wp--preset--color--text);
}
.fortiva .svc-compare-col li::before {
    content: "";
    position: absolute;
    left: 0; top: 1rem;
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--wp--preset--color--muted);
}
.fortiva .svc-compare-col--accent li { color: rgba(255,255,255,0.88); }
.fortiva .svc-compare-col--accent li::before { background: rgba(255,255,255,0.7); }

/* Link aus einer Produktkarte heraus */
.fortiva .svc-product-link {
    margin-top: 1.5rem;
    align-self: flex-start;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--wp--preset--color--white);
    border-bottom: 1px solid rgba(255,255,255,0.35);
    padding-bottom: 0.2rem;
    transition: border-color 0.25s;
}
.fortiva .svc-product-link:hover { border-bottom-color: var(--wp--preset--color--white); }

/* Praxisbeispiel als eigener Abschnitt */
.fortiva .svc-case-section { padding: 0 0 5rem; }
.fortiva .svc-case-section .svc-case { margin-top: 0; }

/* FAQ */
.fortiva .svc-faq {
    background: var(--wp--preset--color--surface);
    padding: 5rem 0;
}
.fortiva .svc-faq h2 {
    font-size: 1.75rem;
    font-weight: 700;
    letter-spacing: -0.025em;
    color: var(--wp--preset--color--blue);
    margin: 0.75rem 0 2.25rem;
}
.fortiva .svc-faq-list { max-width: 860px; }
.fortiva .svc-faq-item {
    border-bottom: 1px solid var(--wp--preset--color--border);
    background: transparent;
}
.fortiva .svc-faq-item summary {
    list-style: none;
    cursor: pointer;
    position: relative;
    padding: 1.25rem 2.5rem 1.25rem 0;
    font-size: 1.0625rem;
    font-weight: 600;
    line-height: 1.5;
    color: var(--wp--preset--color--blue);
    transition: color 0.2s;
}
.fortiva .svc-faq-item summary::-webkit-details-marker { display: none; }
.fortiva .svc-faq-item summary:hover { color: var(--wp--preset--color--blue-mid); }
.fortiva .svc-faq-item summary::after {
    content: "";
    position: absolute;
    right: 0.5rem;
    top: 1.6rem;
    width: 9px; height: 9px;
    border-right: 2px solid var(--wp--preset--color--muted);
    border-bottom: 2px solid var(--wp--preset--color--muted);
    transform: rotate(45deg);
    transition: transform 0.25s;
}
.fortiva .svc-faq-item[open] summary::after { transform: rotate(-135deg); top: 1.9rem; }
.fortiva .svc-faq-item p {
    margin: 0 0 1.5rem;
    padding-right: 2.5rem;
    font-size: 0.9375rem;
    line-height: 1.8;
    color: var(--wp--preset--color--text);
}

/* Querverweise auf verwandte Leistungen */
.fortiva .svc-related { padding: 4.5rem 0; }
.fortiva .svc-related-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
    margin-top: 1.5rem;
}
.fortiva .svc-related-card {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    padding: 1.75rem;
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 4px;
    transition: border-color 0.25s, transform 0.25s cubic-bezier(.16,1,.3,1), box-shadow 0.25s;
}
.fortiva .svc-related-card:hover {
    border-color: var(--wp--preset--color--blue);
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(7,46,87,0.1);
}
.fortiva .svc-related-num {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    color: var(--wp--preset--color--muted);
}
.fortiva .svc-related-title {
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: -0.018em;
    color: var(--wp--preset--color--blue);
}
.fortiva .svc-related-claim {
    font-size: 0.9375rem;
    line-height: 1.6;
    color: var(--wp--preset--color--muted);
}

/* Vorbelegtes Themenfeld im Kontaktformular hervorheben */
.fortiva .form-group select.is-prefilled { border-color: rgba(255,255,255,0.45); }

/* Leistungs-Sektion */
.fortiva .svc-detail {
    padding: 6rem 0;
    scroll-margin-top: 140px;
}
.fortiva .svc-detail--alt { background: var(--wp--preset--color--surface); }

.fortiva .svc-detail-head {
    display: grid;
    grid-template-columns: 72px 1fr;
    gap: 2.5rem;
    align-items: start;
    padding-bottom: 2.5rem;
    margin-bottom: 3rem;
    border-bottom: 1px solid var(--wp--preset--color--border);
}
.fortiva .svc-detail-num {
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--wp--preset--color--border);
    padding-top: 0.6rem;
}
.fortiva .svc-detail-head h2 {
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.15;
    color: var(--wp--preset--color--blue);
    margin: 0;
}
.fortiva .svc-claim {
    margin: 0.875rem 0 0;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.5;
    color: var(--wp--preset--color--blue-mid);
}

.fortiva .svc-detail-body {
    max-width: 780px;
    margin-left: calc(72px + 2.5rem);
}
.fortiva .svc-detail-body p {
    font-size: 1rem;
    line-height: 1.8;
    color: var(--wp--preset--color--text);
    margin: 0 0 1.125rem;
}
.fortiva .svc-detail-body p:last-child { margin-bottom: 0; }

/* Hersteller-Chips */
.fortiva .svc-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
    margin-top: 1.5rem;
}
.fortiva .svc-chips li {
    padding: 0.5rem 1.125rem;
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 2px;
    background: #fff;
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--wp--preset--color--blue);
}

/* Produkt-Karten (VoiceBridge / SBC) */
.fortiva .svc-products {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    margin-top: 3.5rem;
}
.fortiva .svc-product {
    background: var(--wp--preset--color--blue);
    border-radius: 4px;
    padding: 2.75rem;
    display: flex;
    flex-direction: column;
    transition: transform 0.28s cubic-bezier(.16,1,.3,1), box-shadow 0.28s cubic-bezier(.16,1,.3,1);
}
.fortiva .svc-product:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 48px rgba(7,46,87,0.28);
}
.fortiva .svc-product-label {
    align-self: flex-start;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.75);
    border: 1px solid rgba(255,255,255,0.22);
    border-radius: 2px;
    padding: 0.3rem 0.7rem;
    margin-bottom: 1.5rem;
}
.fortiva .svc-product h2,
.fortiva .svc-product h3 {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--wp--preset--color--white);
    margin: 0;
}
.fortiva .svc-product-claim {
    font-size: 0.9375rem;
    font-weight: 600;
    color: rgba(255,255,255,0.92);
    margin: 0.625rem 0 1.5rem;
}
.fortiva .svc-product p {
    font-size: 0.9375rem;
    line-height: 1.8;
    color: rgba(255,255,255,0.80);
    margin: 0 0 1rem;
}
.fortiva .svc-product p:last-child { margin-bottom: 0; }
.fortiva .svc-product-usp {
    margin-top: auto;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(255,255,255,0.18);
    color: rgba(255,255,255,0.96) !important;
    font-weight: 500;
}

/* Info-Boxen */
.fortiva .svc-boxes {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    margin-top: 3.5rem;
}
.fortiva .svc-box {
    background: #fff;
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 4px;
    padding: 2.5rem;
}
.fortiva .svc-box--accent {
    border-left: 3px solid var(--wp--preset--color--blue);
}
.fortiva .svc-box--wide { margin-top: 2.5rem; }
.fortiva .svc-box h2,
.fortiva .svc-box h3 {
    font-size: 1.1875rem;
    font-weight: 700;
    letter-spacing: -0.015em;
    color: var(--wp--preset--color--blue);
    margin: 0 0 1.125rem;
}
.fortiva .svc-box p {
    font-size: 0.9375rem;
    line-height: 1.8;
    color: var(--wp--preset--color--text);
    margin: 0 0 1rem;
}
.fortiva .svc-box p:last-child { margin-bottom: 0; }

.fortiva .svc-note {
    margin: 2rem 0 0;
    padding: 1.25rem 1.5rem;
    background: rgba(7,46,87,0.05);
    border-radius: 2px;
    font-size: 0.9375rem;
    line-height: 1.75;
    color: var(--wp--preset--color--blue);
}

/* Zweispaltiger Block (Monitoring) */
.fortiva .svc-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3.5rem;
    margin-top: 3.5rem;
    align-items: start;
}
.fortiva .svc-split-copy h2,
.fortiva .svc-split-copy h3 {
    font-size: 1.375rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--wp--preset--color--blue);
    margin: 0 0 1.125rem;
}
.fortiva .svc-split-copy p {
    font-size: 0.9375rem;
    line-height: 1.8;
    color: var(--wp--preset--color--text);
    margin: 0 0 1rem;
}
.fortiva .svc-split-list h3,
.fortiva .svc-split-list h4 {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--wp--preset--color--muted);
    margin: 0 0 1.25rem;
}
.fortiva .svc-checklist li {
    position: relative;
    padding: 0.75rem 0 0.75rem 1.75rem;
    border-bottom: 1px solid var(--wp--preset--color--border);
    font-size: 0.9375rem;
    line-height: 1.5;
    color: var(--wp--preset--color--text);
}
.fortiva .svc-checklist li:last-child { border-bottom: none; }
.fortiva .svc-checklist li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 1.15rem;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--wp--preset--color--blue);
}

/* Praxisbeispiel */
.fortiva .svc-case {
    margin-top: 3.5rem;
    background: var(--wp--preset--color--blue);
    border-radius: 4px;
    padding: 3rem;
}
.fortiva .svc-case-label {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.75);
    border: 1px solid rgba(255,255,255,0.22);
    border-radius: 2px;
    padding: 0.3rem 0.7rem;
    margin-bottom: 1.5rem;
}
.fortiva .svc-case h2,
.fortiva .svc-case h3 {
    font-size: clamp(1.375rem, 2.4vw, 1.875rem);
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.2;
    color: var(--wp--preset--color--white);
    margin: 0;
}
.fortiva .svc-case-claim {
    font-size: 1rem;
    font-weight: 600;
    color: rgba(255,255,255,0.92);
    margin: 0.625rem 0 1.75rem !important;
}
.fortiva .svc-case p {
    font-size: 0.9375rem;
    line-height: 1.8;
    color: rgba(255,255,255,0.80);
    margin: 0 0 1rem;
    max-width: 860px;
}
.fortiva .svc-case-result {
    display: flex;
    align-items: baseline;
    gap: 1.5rem;
    margin-top: 2rem;
    padding-top: 1.75rem;
    border-top: 1px solid rgba(255,255,255,0.14);
}
.fortiva .svc-case-result span {
    flex: 0 0 auto;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.7);
}
.fortiva .svc-case-result p {
    margin: 0;
    font-size: 1.0625rem;
    font-weight: 600;
    line-height: 1.55;
    color: var(--wp--preset--color--white);
}

/* Startseite: Link zur Leistungsseite */
.fortiva .services-more { margin-top: 2.5rem; }

/* ── Keyframes ──────────────────────────────────────────── */
@keyframes fortivaFadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes fortivaScrollPulse {
    0%   { left: -100%; }
    50%  { left: 100%; }
    100% { left: 100%; }
}

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 1024px) {
    .fortiva .wrap { padding-left: 2rem; padding-right: 2rem; }
    .fortiva .delivery-copy { padding: 5rem 3rem; }
}

@media (max-width: 900px) {
    .fortiva .wrap { padding-left: 1.5rem; padding-right: 1.5rem; }
    .fortiva .nav-links { display: none; }
    .fortiva .header-nav .btn-solid { display: none; }
    .fortiva .nav-toggle { display: flex; }
    .fortiva .mobile-nav { display: block; }
    .fortiva .hero-visual { width: 100%; }
    .fortiva .hero .wrap { padding-top: 8rem; padding-bottom: 5rem; }
    .fortiva .stats-inner { grid-template-columns: repeat(2, 1fr); }
    .fortiva .stat-cell:nth-child(2) { border-right: none; }
    .fortiva .stat-cell:nth-child(3),
    .fortiva .stat-cell:nth-child(4) { border-top: 1px solid var(--wp--preset--color--border); }
    .fortiva .stat-cell:nth-child(3) { border-right: 1px solid var(--wp--preset--color--border); }
    .fortiva .services-head { grid-template-columns: 1fr; gap: 1rem; }
    .fortiva .service-row { grid-template-columns: 52px 1fr; }
    .fortiva .svc-arrow { display: none; }
    .fortiva .delivery-grid { grid-template-columns: 1fr; }
    .fortiva .delivery-img  { min-height: 280px; }
    .fortiva .delivery-copy { padding: 4rem 1.5rem; }
    .fortiva .delivery-img::after { background: linear-gradient(to bottom, transparent 60%, var(--wp--preset--color--blue) 100%); }
    .fortiva .secondary .wrap { flex-wrap: wrap; gap: 1.5rem; }
    .fortiva .sec-divider { display: none; }
    .fortiva .team-grid { grid-template-columns: 1fr; gap: 2rem; }
    .fortiva .team-card { flex-direction: column; text-align: center; }
    .fortiva .contact-grid { grid-template-columns: 1fr; gap: 3rem; }
    .fortiva .site-footer { padding: 3.5rem 0 2rem; }
    .fortiva .footer-top { grid-template-columns: repeat(2, 1fr); gap: 2rem; padding-bottom: 2.5rem; margin-bottom: 0; }
    .fortiva .footer-brand { grid-column: 1 / -1; }
    .fortiva .footer-trust { flex-direction: row; align-items: flex-start; gap: 1.25rem; padding: 1.75rem 0; }
    .fortiva .footer-trust .hiscox-seal { height: 80px; }
    .fortiva .footer-trust-text p { font-size: 0.8rem; }
    .fortiva .footer-bottom { flex-direction: column; gap: 0.5rem; text-align: center; }
    .fortiva .ref-grid { grid-template-columns: repeat(2, 1fr); }
    .fortiva .ref-partners-grid { grid-template-columns: 1fr; }
    .fortiva .ref-cta .wrap { flex-direction: column; text-align: center; }
    .fortiva .svc-detail { padding: 4rem 0; }
    .fortiva .svc-detail-head { grid-template-columns: 52px 1fr; gap: 1.25rem; }
    .fortiva .svc-detail-body { margin-left: 0; }
    .fortiva .svc-products,
    .fortiva .svc-boxes { grid-template-columns: 1fr; gap: 1.5rem; margin-top: 2.5rem; }
    .fortiva .svc-split { grid-template-columns: 1fr; gap: 2.5rem; margin-top: 2.5rem; }
    .fortiva .svc-product,
    .fortiva .svc-box,
    .fortiva .svc-case { padding: 2rem 1.5rem; }
    .fortiva .svc-case { margin-top: 2.5rem; }
    .fortiva .svc-case-result { flex-direction: column; gap: 0.625rem; }
    .fortiva .svc-subnav ul { gap: 1.5rem; }
    .fortiva .svc-steps { grid-template-columns: 1fr; gap: 1rem; margin-top: 2.5rem; }
    .fortiva .svc-compare-grid { grid-template-columns: 1fr; }
    .fortiva .svc-compare { margin-top: 2.5rem; }
    .fortiva .svc-related-grid { grid-template-columns: 1fr; }
    .fortiva .svc-related { padding: 3rem 0; }
    .fortiva .svc-faq { padding: 3.5rem 0; }
    .fortiva .svc-case-section { padding-bottom: 3.5rem; }
    .fortiva .svc-cards { grid-template-columns: 1fr; gap: 1.5rem; }
    .fortiva .svc-overview { padding: 3.5rem 0 4rem; }
    .fortiva .svc-single-hero .wrap { padding-top: calc(72px + 2.5rem); padding-bottom: 3rem; }
    .fortiva .services-single .svc-detail { padding-top: 3rem; }
    .fortiva .svc-refs { padding: 3.5rem 0; }
    .fortiva .svc-pager .wrap { flex-direction: column; gap: 1.75rem; }
    .fortiva .svc-pager-link { max-width: none; }
    .fortiva .svc-pager-next { text-align: left; align-items: flex-start; }
}

@media (max-width: 600px) {
    .fortiva .hero h1 { font-size: 2.875rem; }
    .fortiva .hero-actions { flex-direction: column; }
    .fortiva .hero-actions .btn { width: 100%; justify-content: center; }
    .fortiva .form-row { grid-template-columns: 1fr; }
    .fortiva .hero-scroll { display: none; }
    .fortiva .ref-grid { grid-template-columns: 1fr; }
    .fortiva .svc-subnav a { font-size: 0.75rem; padding: 1rem 0; }
}


/* ═══════════════════════════════════════════════════════════
   TASTATURBEDIENUNG
   Das Stylesheet hatte bisher keinen einzigen Fokus-Zustand. Die
   aufwendigen Hover-Zustaende (z.B. .service-row) blieben Mausnutzern
   vorbehalten. :focus-visible greift nur bei Tastaturnavigation, die
   Maus loest die Markierung also nicht aus.
═══════════════════════════════════════════════════════════ */
.fortiva a:focus-visible,
.fortiva button:focus-visible,
.fortiva [tabindex]:focus-visible {
    outline: 2px solid var(--wp--preset--color--blue);
    outline-offset: 3px;
    border-radius: 2px;
}
/* Auf den dunklen Flaechen (Hero, Ansatz, Kontakt, Footer) verschwindet
   das Dunkelblau - dort weiss. */
.fortiva .hero a:focus-visible,
.fortiva .site-header a:focus-visible,
.fortiva .site-header button:focus-visible,
.fortiva .delivery a:focus-visible,
.fortiva .contact a:focus-visible,
.fortiva .contact button:focus-visible,
.fortiva .site-footer a:focus-visible,
.fortiva .ref-cta a:focus-visible {
    outline-color: var(--wp--preset--color--white);
}
/* Die Leistungszeile hat einen fertig gestalteten Hover-Zustand -
   er wird hier lediglich auch fuer die Tastatur ausgeloest. */
.fortiva .service-row:focus-visible {
    background: var(--wp--preset--color--blue);
    border-color: var(--wp--preset--color--blue);
}
.fortiva .service-row:focus-visible .svc-num   { color: rgba(255,255,255,0.55); }
.fortiva .service-row:focus-visible .svc-name  { color: var(--wp--preset--color--white); }
.fortiva .service-row:focus-visible .svc-body  { color: rgba(255,255,255,0.75); }
.fortiva .service-row:focus-visible .svc-arrow { opacity: 1; color: var(--wp--preset--color--white); }

/* ═══════════════════════════════════════════════════════════
   REDUZIERTE BEWEGUNG
   Das Stylesheet enthaelt 34 Uebergaenge und Animationen. Wer im
   Betriebssystem reduzierte Bewegung eingestellt hat, bekommt sie
   hier abgeschaltet - Zustandswechsel bleiben sichtbar, nur eben
   ohne Weg dorthin. Das Scroll-Verhalten wird ebenfalls hart
   gestellt, da der Header per JS auf window.scrollY reagiert.
═══════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .fortiva *,
    .fortiva *::before,
    .fortiva *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    /* Verschiebungen ganz unterdruecken, nicht nur beschleunigen. */
    .fortiva .ref-card:hover,
    .fortiva .ref-partner-card:hover,
    .fortiva .svc-card:hover { transform: none; }
    .fortiva .service-row:hover { padding-left: 1.5rem; padding-right: 1.5rem; }
    .fortiva .service-row:hover .svc-arrow,
    .fortiva .service-row:focus-visible .svc-arrow { transform: none; }
}

/* ═══════════════════════════════════════════════════════════
   Einfache Inhaltsseiten (page.html)
   Fuer Seiten ohne eigenes Pattern - Impressum, Datenschutz,
   AGB. Der Text kommt aus dem Editor, nicht aus ACF, deshalb
   muss hier alles gestylt werden, was Gutenberg ausgibt.
═══════════════════════════════════════════════════════════ */
.fortiva .page-plain {
    padding: 10rem 0 6rem;
    background: var(--wp--preset--color--white);
}
/* Begrenzte Zeilenlaenge: .wrap ist mit 1280px auf Rastersektionen
   ausgelegt, fuer Fliesstext waeren das weit ueber 100 Zeichen. */
.fortiva .page-plain .wrap > * { max-width: 760px; }

.fortiva .page-plain .wp-block-post-title {
    font-size: clamp(2rem, 4vw, 2.75rem);
    font-weight: 700;
    line-height: 1.15;
    color: var(--wp--preset--color--blue);
    margin: 0 0 2.5rem;
}
.fortiva .page-plain h2 {
    font-size: 1.375rem;
    font-weight: 700;
    color: var(--wp--preset--color--blue);
    margin: 2.75rem 0 0.875rem;
}
.fortiva .page-plain h3 {
    font-size: 1.0625rem;
    font-weight: 700;
    color: var(--wp--preset--color--text);
    margin: 2rem 0 0.625rem;
}
.fortiva .page-plain p {
    font-size: 1rem;
    line-height: 1.75;
    color: var(--wp--preset--color--text);
    margin: 0 0 1.125rem;
}
/* Listenpunkte zurueckholen: global gilt list-style:none, was fuer die
   Navigation und die Kacheln richtig ist, in einem Rechtstext aber die
   Gliederung zerstoert. */
.fortiva .page-plain ul,
.fortiva .page-plain ol {
    margin: 0 0 1.125rem;
    padding-left: 1.5rem;
    line-height: 1.75;
    color: var(--wp--preset--color--text);
}
.fortiva .page-plain ul { list-style: disc; }
.fortiva .page-plain ol { list-style: decimal; }
.fortiva .page-plain li { margin-bottom: 0.4rem; }

.fortiva .page-plain a {
    color: var(--wp--preset--color--blue-mid);
    text-decoration: underline;
    text-underline-offset: 0.15em;
}
.fortiva .page-plain a:hover { color: var(--wp--preset--color--blue); }

/* Lange Mailadressen und URLs sollen auf schmalen Displays umbrechen
   statt die Seite horizontal zu dehnen. */
.fortiva .page-plain a { overflow-wrap: anywhere; }

.fortiva .page-plain table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 0 1.5rem;
    font-size: 0.9375rem;
}
.fortiva .page-plain th,
.fortiva .page-plain td {
    text-align: left;
    padding: 0.625rem 0.75rem;
    border-bottom: 1px solid var(--wp--preset--color--border);
    vertical-align: top;
}
.fortiva .page-plain th { font-weight: 700; color: var(--wp--preset--color--blue); }

@media (max-width: 782px) {
    .fortiva .page-plain { padding: 7.5rem 0 4rem; }
}