/* ============================================================
   FABIAN HIRSCH – PREMIUM HOMEPAGE
   ============================================================ */

body.page-id-25 {
    --fh-cyan: #39c2d9;
    --fh-cyan-light: #8beaf4;
    --fh-dark: #050b11;
    --fh-dark-2: #0a151e;
    --fh-white: #f7fafb;
    --fh-ink: #0c151c;
    --fh-muted: #687680;
    background: #f2f4f5 !important;
}

/* ------------------------------------------------------------
   HEADER
   ------------------------------------------------------------ */

body.page-id-25 header {
    position: relative !important;
    z-index: 100 !important;
    background: rgba(5,11,17,.95) !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    backdrop-filter: blur(18px) !important;
}

body.page-id-25 header .wp-block-navigation-item__content {
    color: rgba(255,255,255,.75) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

body.page-id-25 header .wp-block-navigation-item__content:hover {
    color: #fff !important;
}

body.page-id-25 header .wp-block-site-logo img {
    filter: brightness(0) invert(1) !important;
}


/* ------------------------------------------------------------
   ORIGINAL CONTENT AUSBLENDEN
   Die neue Premium-Oberfläche liegt über dem Seiteninhalt.
   ------------------------------------------------------------ */

body.page-id-25 .entry-content > *:not(.fh-premium-home) {
    display: none !important;
}


/* ------------------------------------------------------------
   RESET
   ------------------------------------------------------------ */

body.page-id-25 .fh-premium-home,
body.page-id-25 .fh-premium-home * {
    box-sizing: border-box;
}

.fhp-premium-home {
    width: 100%;
    overflow: hidden;
}

.fhp-premium-home a {
    text-decoration: none !important;
}


/* ------------------------------------------------------------
   HERO
   ------------------------------------------------------------ */

.fhp-hero {
    position: relative;
    min-height: 790px;
    display: flex;
    align-items: center;
    overflow: hidden;

    color: #fff;

    background:
        radial-gradient(
            circle at 76% 28%,
            rgba(57,194,217,.20),
            transparent 28%
        ),
        radial-gradient(
            circle at 16% 85%,
            rgba(60,96,255,.12),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #04090f,
            #0a141d 58%,
            #061018
        );

    border-radius:
        0 0 38px 38px;
}

.fhp-grid {
    position: absolute;
    inset: 0;
    opacity: .30;
    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(255,255,255,.035) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.035) 1px,
            transparent 1px
        );

    background-size: 72px 72px;
}

.fhp-glow {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.fhp-glow-one {
    width: 600px;
    height: 600px;
    right: -250px;
    top: 60px;
    border: 1px solid rgba(57,194,217,.19);
    box-shadow:
        0 0 100px rgba(57,194,217,.08),
        inset 0 0 100px rgba(57,194,217,.025);
}

.fhp-glow-two {
    width: 300px;
    height: 300px;
    left: -170px;
    bottom: -120px;
    border: 1px solid rgba(255,255,255,.06);
}

.fhp-hero-inner {
    position: relative;
    z-index: 3;
    width: min(1250px, calc(100% - 80px));
    margin: auto;

    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(460px, .85fr);
    gap: 85px;

    align-items: center;
}

.fhp-eyebrow {
    display: flex;
    align-items: center;
    gap: 11px;

    color: var(--fh-cyan);

    font-size: 10px;
    font-weight: 800;
    letter-spacing: .22em;
    text-transform: uppercase;
}

.fhp-eyebrow span {
    display: block;
    width: 28px;
    height: 1px;
    background: currentColor;
}

.fhp-eyebrow-dark {
    color: #159bb2;
}

.fhp-hero h1 {
    margin: 24px 0 22px;

    max-width: 720px;

    font-size: clamp(60px, 7vw, 112px) !important;
    line-height: .86 !important;

    letter-spacing: -.065em !important;

    font-weight: 850 !important;

    color: #fff !important;
}

.fhp-hero h1 em,
.fhp-section h2 em,
.fhp-project-content h2 em,
.fhp-cta h2 em {
    color: var(--fh-cyan);
    font-style: normal;
}

.fhp-hero-lead {
    max-width: 610px;
    margin: 0 0 9px !important;

    color: rgba(255,255,255,.91) !important;

    font-size: 20px !important;
    font-weight: 650 !important;
    line-height: 1.55 !important;
}

.fhp-hero-small {
    max-width: 560px;
    margin: 0 0 34px !important;

    color: rgba(255,255,255,.55) !important;

    font-size: 15px !important;
    line-height: 1.7 !important;
}

.fhp-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.fhp-btn {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 26px;

    padding: 15px 20px;

    min-width: 145px;

    border-radius: 999px;

    font-size: 10px;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        background .3s ease;
}

.fhp-btn span {
    font-size: 15px;
    line-height: 1;
}

.fhp-btn-primary {
    color: #061018 !important;
    background: var(--fh-cyan);
    box-shadow:
        0 15px 35px rgba(0,0,0,.22);
}

.fhp-btn-primary:hover {
    color: #061018 !important;
    transform: translateY(-4px);
    box-shadow:
        0 23px 50px rgba(0,0,0,.30);
}

.fhp-btn-ghost {
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.035);
    backdrop-filter: blur(8px);
}

.fhp-btn-ghost:hover {
    color: #fff !important;
    transform: translateY(-4px);
    border-color: rgba(57,194,217,.40);
    background: rgba(255,255,255,.07);
}

.fhp-hero-showcase {
    position: relative;

    min-height: 570px;

    background:
        linear-gradient(
            150deg,
            rgba(255,255,255,.065),
            rgba(255,255,255,.018)
        );

    border:
        1px solid rgba(255,255,255,.12);

    box-shadow:
        0 35px 90px rgba(0,0,0,.28);

    backdrop-filter:
        blur(18px);

    overflow: hidden;
}

.fhp-showcase-top {
    position: relative;
    z-index: 3;

    display: flex;
    justify-content: space-between;

    padding: 22px 22px 0;

    color: var(--fh-cyan);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .18em;
}

.fhp-showcase-top span:last-child {
    color: rgba(255,255,255,.35);
}

.fhp-showcase-image {
    position: absolute;
    inset: 54px 0 170px;

    display: flex;
    align-items: center;
    justify-content: center;
}

.fhp-showcase-image::after {
    content: "";
    position: absolute;
    inset: 20% 10% 0;

    background:
        radial-gradient(
            circle,
            rgba(57,194,217,.16),
            transparent 62%
        );

    pointer-events: none;
}

.fhp-showcase-image img {
    position: relative;
    z-index: 2;

    width: 90%;
    height: 90%;

    object-fit: contain;

    filter:
        drop-shadow(0 30px 35px rgba(0,0,0,.30));

    transition:
        transform .7s cubic-bezier(.2,.7,.2,1);
}

.fhp-hero-showcase:hover .fhp-showcase-image img {
    transform: scale(1.035) translateY(-4px);
}

.fhp-showcase-bottom {
    position: absolute;
    z-index: 4;
    left: 0;
    right: 0;
    bottom: 0;

    display: flex;
    justify-content: space-between;
    align-items: end;

    padding: 24px;

    background:
        linear-gradient(
            180deg,
            transparent,
            rgba(5,10,15,.94) 30%,
            #050a10
        );
}

.fhp-mini-label {
    display: block;
    margin-bottom: 9px;

    color: var(--fh-cyan);

    font-size: 8px;
    font-weight: 800;
    letter-spacing: .17em;
}

.fhp-showcase-bottom h2 {
    margin: 0 !important;

    color: #fff !important;

    font-size: 25px !important;
    line-height: 1 !important;
}

.fhp-circle-link {
    width: 45px;
    height: 45px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(255,255,255,.15);
    border-radius: 50%;

    color: #fff !important;
    background: rgba(255,255,255,.05);

    transition:
        transform .3s ease,
        background .3s ease;
}

.fhp-circle-link:hover {
    transform: rotate(8deg) scale(1.08);
    background: var(--fh-cyan);
    color: #061018 !important;
}

.fhp-scroll {
    position: absolute;
    z-index: 4;
    left: 50%;
    bottom: 23px;
    transform: translateX(-50%);

    display: flex;
    flex-direction: column;
    align-items: center;

    gap: 8px;

    color: rgba(255,255,255,.38);

    font-size: 8px;
    letter-spacing: .25em;
}

.fhp-scroll span {
    width: 1px;
    height: 22px;
    background: var(--fh-cyan);
}


/* ------------------------------------------------------------
   LIGHT SECTION
   ------------------------------------------------------------ */

.fhp-section {
    padding: 125px 0;
}

.fhp-light {
    background: #f3f5f5;
    color: var(--fh-ink);
}

.fhp-dark {
    background:
        linear-gradient(
            135deg,
            #050b11,
            #0b1721
        );
    color: #fff;
}

.fhp-container {
    width: min(1250px, calc(100% - 80px));
    margin: auto;
}

.fhp-section-heading {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 50px;

    margin-bottom: 58px;
}

.fhp-section-heading h2 {
    margin: 20px 0 0 !important;

    font-size: clamp(50px, 6vw, 88px) !important;
    line-height: .88 !important;
    letter-spacing: -.055em !important;

    color: var(--fh-ink) !important;
}

.fhp-section-heading > p {
    width: min(440px, 100%);
    margin: 0 !important;

    color: var(--fh-muted) !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
}

.fhp-heading-light h2 {
    color: #fff !important;
}

.fhp-heading-light > p {
    color: rgba(255,255,255,.55) !important;
}

.fhp-services {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 14px;
}

.fhp-service {
    min-height: 285px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    padding: 27px;

    background: #fff;

    border:
        1px solid rgba(8,18,26,.08);

    box-shadow:
        0 18px 50px rgba(8,18,26,.06);

    color: var(--fh-ink) !important;

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}

.fhp-service:hover {
    transform: translateY(-7px);
    border-color: rgba(57,194,217,.35);
    box-shadow:
        0 28px 65px rgba(8,18,26,.11);
}

.fhp-number {
    color: rgba(8,18,26,.34);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .16em;
}

.fhp-service h3 {
    margin: 50px 0 10px !important;

    color: var(--fh-ink) !important;

    font-size: 27px !important;
    line-height: 1 !important;
}

.fhp-service p {
    margin: 0 !important;

    color: #697681 !important;

    font-size: 13px !important;
    line-height: 1.65 !important;
}

.fhp-service > strong {
    margin-top: 22px;
    color: var(--fh-cyan);
    font-size: 18px;
}


/* ------------------------------------------------------------
   PROJECT
   ------------------------------------------------------------ */

.fhp-project {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    min-height: 640px;

    margin-top: 25px;

    background: #081018;
    color: #fff;
}

.fhp-project-image {
    overflow: hidden;
}

.fhp-project-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    filter:
        brightness(.64)
        saturate(.85);

    transition:
        transform 1s cubic-bezier(.2,.7,.2,1),
        filter 1s ease;
}

.fhp-project:hover .fhp-project-image img {
    transform: scale(1.03);
    filter:
        brightness(.73)
        saturate(.95);
}

.fhp-project-content {
    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 65px;
}

.fhp-project-content h2 {
    margin: 22px 0;

    font-size: clamp(55px, 6vw, 88px) !important;
    line-height: .86 !important;
    letter-spacing: -.055em !important;

    color: #fff !important;
}

.fhp-project-content p {
    max-width: 440px;
    margin: 0 0 30px !important;

    color: rgba(255,255,255,.59) !important;

    font-size: 15px !important;
    line-height: 1.75 !important;
}


/* ------------------------------------------------------------
   TECH
   ------------------------------------------------------------ */

.fhp-tech-grid {
    display: grid;
    grid-template-columns: .9fr 1.2fr .9fr;
    gap: 14px;
}

.fhp-tech-card {
    position: relative;
    min-height: 410px;

    padding: 28px;

    display: flex;
    flex-direction: column;
    justify-content: flex-end;

    border:
        1px solid rgba(255,255,255,.08);

    background:
        rgba(255,255,255,.035);
}

.fhp-tech-card > span {
    position: absolute;
    top: 28px;
    left: 28px;

    color: var(--fh-cyan);

    font-size: 9px;
    font-weight: 800;
    letter-spacing: .18em;
}

.fhp-tech-card h3 {
    margin: 0 0 12px !important;

    color: #fff !important;

    font-size: 29px !important;
    line-height: 1 !important;
}

.fhp-tech-card p {
    margin: 0 !important;

    color: rgba(255,255,255,.55) !important;

    font-size: 13px !important;
    line-height: 1.65 !important;
}

.fhp-tech-image {
    padding: 0;
    overflow: hidden;
}

.fhp-tech-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;

    filter:
        brightness(.60)
        saturate(.85);

    transition:
        transform .9s cubic-bezier(.2,.7,.2,1);
}

.fhp-tech-image:hover img {
    transform: scale(1.035);
}

.fhp-tech-overlay {
    position: absolute;
    inset: auto 0 0 0;

    padding: 35px 28px 26px;

    background:
        linear-gradient(
            180deg,
            transparent,
            rgba(5,10,15,.94)
        );
}

.fhp-tech-overlay span {
    position: static !important;
    display: block;
    margin-bottom: 7px;
}

.fhp-tech-overlay strong {
    color: #fff;
    font-size: 20px;
}


/* ------------------------------------------------------------
   STRIP
   ------------------------------------------------------------ */

.fhp-strip {
    padding: 28px 0;

    color: #fff;

    background:
        #071018;

    border-top:
        1px solid rgba(255,255,255,.08);

    border-bottom:
        1px solid rgba(255,255,255,.08);
}

.fhp-strip .fhp-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 35px;
}

.fhp-strip-title {
    color: rgba(255,255,255,.42);

    font-size: 10px;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.fhp-strip-links {
    display: flex;
    flex-wrap: wrap;
    gap: 23px;
}

.fhp-strip-links a {
    color: rgba(255,255,255,.78) !important;

    font-size: 11px;
    font-weight: 650;
}

.fhp-strip-links a span {
    margin-left: 6px;
    color: var(--fh-cyan);
}

.fhp-strip-links a:hover {
    color: #fff !important;
}


/* ------------------------------------------------------------
   CTA
   ------------------------------------------------------------ */

.fhp-cta {
    position: relative;
    overflow: hidden;

    padding: 135px 20px;

    text-align: center;

    color: #fff;

    background:
        radial-gradient(
            circle at 50% 20%,
            rgba(57,194,217,.20),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #050b11,
            #0c1822
        );
}

.fhp-cta-glow {
    position: absolute;

    width: 500px;
    height: 500px;

    left: 50%;
    top: 50%;

    transform:
        translate(-50%,-50%);

    border-radius: 50%;

    border:
        1px solid rgba(57,194,217,.14);
}

.fhp-cta-inner {
    position: relative;
    z-index: 2;

    max-width: 780px;

    margin: auto;
}

.fhp-cta h2 {
    margin: 23px 0 20px !important;

    color: #fff !important;

    font-size: clamp(55px, 7vw, 98px) !important;
    line-height: .86 !important;
    letter-spacing: -.06em !important;
}

.fhp-cta p {
    max-width: 590px;

    margin: 0 auto 32px !important;

    color: rgba(255,255,255,.55) !important;

    font-size: 16px !important;
    line-height: 1.7 !important;
}


/* ------------------------------------------------------------
   MOBILE
   ------------------------------------------------------------ */

@media (max-width: 1000px) {

    .fhp-hero-inner {
        grid-template-columns: 1fr;
        gap: 55px;
    }

    .fhp-hero {
        min-height: auto;
        padding: 100px 0 75px;
    }

    .fhp-services {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .fhp-project {
        grid-template-columns: 1fr;
    }

    .fhp-project-image {
        min-height: 400px;
    }

    .fhp-tech-grid {
        grid-template-columns: 1fr;
    }

    .fhp-tech-card {
        min-height: 330px;
    }

    .fhp-strip .fhp-container {
        display: block;
    }

    .fhp-strip-title {
        margin-bottom: 15px;
    }
}

@media (max-width: 650px) {

    body.page-id-25 header .wp-block-navigation {
        gap: 12px !important;
    }

    .fhp-container,
    .fhp-hero-inner {
        width: calc(100% - 30px);
    }

    .fhp-hero {
        border-radius: 0 0 24px 24px;
        padding: 75px 0 65px;
    }

    .fhp-hero h1 {
        font-size: 53px !important;
        letter-spacing: -.055em !important;
    }

    .fhp-hero-lead {
        font-size: 17px !important;
    }

    .fhp-hero-small {
        font-size: 14px !important;
    }

    .fhp-hero-showcase {
        min-height: 450px;
    }

    .fhp-showcase-image {
        inset: 50px 0 145px;
    }

    .fhp-showcase-bottom {
        padding: 18px;
    }

    .fhp-showcase-bottom h2 {
        font-size: 20px !important;
    }

    .fhp-section {
        padding: 80px 0;
    }

    .fhp-section-heading {
        display: block;
        margin-bottom: 35px;
    }

    .fhp-section-heading > p {
        margin-top: 25px !important;
    }

    .fhp-section-heading h2 {
        font-size: 48px !important;
    }

    .fhp-services {
        grid-template-columns: 1fr;
    }

    .fhp-service {
        min-height: 225px;
    }

    .fhp-service h3 {
        margin-top: 35px !important;
    }

    .fhp-project-content {
        padding: 42px 24px;
    }

    .fhp-project-content h2 {
        font-size: 52px !important;
    }

    .fhp-tech-card {
        min-height: 280px;
    }

    .fhp-strip-links {
        flex-direction: column;
        gap: 12px;
    }

    .fhp-cta {
        padding: 90px 20px;
    }

    .fhp-cta h2 {
        font-size: 51px !important;
    }
}

/* ============================================================
   FIX V2 – FULL WIDTH + PREMIUM HERO
   ============================================================ */

/* komplette Premium-Seite aus der WordPress-Content-Spalte lösen */
body.page-id-25 .entry-content > .fh-premium-home {
    width: 100vw !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 0 !important;
}

/* ============================================================
   HEADER
   ============================================================ */

body.page-id-25 header.wp-block-template-part,
body.page-id-25 > .wp-site-blocks > header {
    width: 100% !important;
    max-width: none !important;
    background: #050b11 !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    color: #fff !important;
}

body.page-id-25 header .wp-block-navigation-item__content {
    color: rgba(255,255,255,.78) !important;
}

body.page-id-25 header .wp-block-navigation-item__content:hover {
    color: #39c2d9 !important;
}

body.page-id-25 header .wp-block-site-logo img {
    filter: brightness(0) invert(1) !important;
}

/* ============================================================
   HERO – ECHTE 2-SPALTIGE PREMIUM ANORDNUNG
   ============================================================ */

body.page-id-25 .fhp-hero {
    width: 100% !important;
    min-height: calc(100vh - 78px) !important;
    padding:
        85px 0 65px !important;
}

body.page-id-25 .fhp-hero-inner {
    width: min(1280px, calc(100% - 80px)) !important;
    margin: 0 auto !important;

    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(430px, .82fr) !important;

    gap: 70px !important;
    align-items: center !important;
}

/* Text nicht mehr zerquetschen */
body.page-id-25 .fhp-hero-copy {
    min-width: 0 !important;
    max-width: 680px !important;
}

body.page-id-25 .fhp-hero h1 {
    max-width: 650px !important;
    margin: 22px 0 !important;
    font-size: clamp(68px, 7vw, 112px) !important;
    line-height: .84 !important;
    letter-spacing: -.065em !important;
}

/* Claim */
body.page-id-25 .fhp-hero-lead {
    max-width: 610px !important;
}

/* Zusatztext */
body.page-id-25 .fhp-hero-small {
    max-width: 560px !important;
}

/* ============================================================
   SHOWCASE
   ============================================================ */

body.page-id-25 .fhp-hero-showcase {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 575px !important;
}

body.page-id-25 .fhp-showcase-image img {
    max-width: 92% !important;
}

/* ============================================================
   HERO WEITER UNTEN – sauberer Übergang
   ============================================================ */

body.page-id-25 .fhp-section {
    width: 100% !important;
}

body.page-id-25 .fhp-container {
    width: min(1280px, calc(100% - 80px)) !important;
    margin: 0 auto !important;
}

/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 1000px) {

    body.page-id-25 .fhp-hero {
        min-height: auto !important;
        padding: 80px 0 65px !important;
    }

    body.page-id-25 .fhp-hero-inner {
        width: calc(100% - 40px) !important;
        grid-template-columns: 1fr !important;
        gap: 50px !important;
    }

    body.page-id-25 .fhp-hero-copy {
        max-width: 760px !important;
    }

    body.page-id-25 .fhp-hero-showcase {
        min-height: 500px !important;
    }
}

@media (max-width: 650px) {

    body.page-id-25 .fhp-hero {
        padding: 65px 0 55px !important;
    }

    body.page-id-25 .fhp-hero-inner,
    body.page-id-25 .fhp-container {
        width: calc(100% - 30px) !important;
    }

    body.page-id-25 .fhp-hero h1 {
        font-size: 55px !important;
    }

    body.page-id-25 .fhp-hero-showcase {
        min-height: 430px !important;
    }
}


/* ============================================================
   FINAL WIDTH FIX – WORDPRESS BLOCK CONTAINER
   ============================================================ */

body.page-id-25 main.wp-block-group {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

body.page-id-25
main.wp-block-group > .entry-content.wp-block-post-content {
    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.page-id-25
main.wp-block-group > .entry-content.wp-block-post-content.is-layout-constrained {
    max-width: none !important;
}

body.page-id-25
main.wp-block-group
.entry-content.wp-block-post-content
> .fh-premium-home {
    display: block !important;

    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
}


/* ============================================================
   PREMIUM HERO FULL WIDTH
   ============================================================ */

body.page-id-25 .fhp-hero {
    width: 100% !important;
    max-width: none !important;
}

body.page-id-25 .fhp-hero-inner {
    width: min(1280px, calc(100% - 80px)) !important;
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}


/* ============================================================
   RESTLICHE PREMIUM-SEITE
   ============================================================ */

body.page-id-25 .fhp-section,
body.page-id-25 .fhp-project,
body.page-id-25 .fhp-strip,
body.page-id-25 .fhp-cta {
    width: 100% !important;
    max-width: none !important;
}


/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 650px) {

    body.page-id-25
    main.wp-block-group
    > .entry-content.wp-block-post-content {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    body.page-id-25 .fhp-hero-inner,
    body.page-id-25 .fhp-container {
        width: calc(100% - 30px) !important;
    }
}


/* ============================================================
   FABIAN PREMIUM – FULL WIDTH CONTAINER FIX
   ============================================================ */

/* WordPress-Hauptcontainer */
body.page-id-25 main#wp--skip-link--target {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Extendable Content-Container */
body.page-id-25 .entry-content.wp-block-post-content {
    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Premium-Seite */
body.page-id-25 .entry-content > .fh-premium-home {
    display: block !important;

    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Unsere inneren Premium-Container */
body.page-id-25 .fhp-container,
body.page-id-25 .fhp-hero-inner {
    width: min(1280px, calc(100% - 80px)) !important;
    max-width: none !important;

    margin-left: auto !important;
    margin-right: auto !important;
}


/* Desktop */
@media (min-width: 1001px) {

    body.page-id-25 .fhp-hero-inner {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(470px, .82fr) !important;

        gap: 80px !important;
    }

    body.page-id-25 .fhp-hero-copy {
        max-width: 700px !important;
    }

    body.page-id-25 .fhp-hero-showcase {
        min-height: 580px !important;
    }
}


/* Tablet */
@media (max-width: 1000px) {

    body.page-id-25 .fhp-container,
    body.page-id-25 .fhp-hero-inner {
        width: calc(100% - 40px) !important;
    }
}


/* Mobile */
@media (max-width: 650px) {

    body.page-id-25 .fhp-container,
    body.page-id-25 .fhp-hero-inner {
        width: calc(100% - 30px) !important;
    }
}


/* ============================================================
   FINAL FULL-WIDTH OVERRIDE
   Extendable-Content komplett verlassen
   ============================================================ */

body.page-id-25 main#wp--skip-link--target {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Der eigentliche WordPress-Content wird aus der
   42rem-Spalte herausgezogen */
body.page-id-25 main#wp--skip-link--target
.entry-content.wp-block-post-content {
    width: 100vw !important;
    max-width: 100vw !important;

    position: relative !important;

    left: 50% !important;
    margin-left: -50vw !important;

    margin-right: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Unsere komplette Premium-Seite */
body.page-id-25
.entry-content.wp-block-post-content
.fh-premium-home {
    display: block !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    position: relative !important;
}

/* Hero-Inhalt */
body.page-id-25 .fhp-hero-inner {
    width: min(1280px, calc(100% - 80px)) !important;
    max-width: 1280px !important;

    margin-left: auto !important;
    margin-right: auto !important;
}

/* Sektionen */
body.page-id-25 .fhp-container {
    width: min(1280px, calc(100% - 80px)) !important;
    max-width: 1280px !important;

    margin-left: auto !important;
    margin-right: auto !important;
}


/* Desktop */
@media (min-width: 1001px) {

    body.page-id-25 .fhp-hero {
        min-height: calc(100vh - 78px) !important;
    }

    body.page-id-25 .fhp-hero-inner {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(500px, .82fr) !important;

        gap: 75px !important;
    }

    body.page-id-25 .fhp-hero-copy {
        max-width: 700px !important;
    }

    body.page-id-25 .fhp-hero h1 {
        font-size: clamp(70px, 7vw, 112px) !important;
    }
}


/* Tablet */
@media (max-width: 1000px) {

    body.page-id-25 .fhp-hero-inner,
    body.page-id-25 .fhp-container {
        width: calc(100% - 40px) !important;
    }
}


/* Mobile */
@media (max-width: 650px) {

    body.page-id-25 .fhp-hero-inner,
    body.page-id-25 .fhp-container {
        width: calc(100% - 30px) !important;
    }

    body.page-id-25
    main#wp--skip-link--target
    .entry-content.wp-block-post-content {
        left: 50% !important;
        margin-left: -50vw !important;
    }
}


/* ============================================================
   FABIAN HIRSCH – PREMIUM HEADER
   Klarer Kontrast / professioneller Tech-Look
   ============================================================ */

body.page-id-25 header.wp-block-template-part,
body.page-id-25 .wp-site-blocks > header {
    position: relative !important;
    z-index: 1000 !important;

    width: 100% !important;
    max-width: none !important;

    min-height: 82px !important;

    background:
        linear-gradient(
            180deg,
            #071018 0%,
            #050b11 100%
        ) !important;

    color: #ffffff !important;

    border-bottom:
        1px solid rgba(255,255,255,.08) !important;

    box-shadow:
        0 10px 35px rgba(0,0,0,.18) !important;

    backdrop-filter: blur(18px) !important;
}


/* feine Cyan-Linie unten */
body.page-id-25 header.wp-block-template-part::after,
body.page-id-25 .wp-site-blocks > header::after {
    content: "";
    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(56,194,217,.75) 50%,
            transparent 100%
        );

    pointer-events: none;
}


/* ------------------------------------------------------------
   Header-Inhalt
   ------------------------------------------------------------ */

body.page-id-25 header .wp-block-group,
body.page-id-25 header .wp-block-navigation {
    color: #ffffff !important;
}


/* ------------------------------------------------------------
   Logo
   ------------------------------------------------------------ */

body.page-id-25 header .wp-block-site-logo {
    position: relative;
    z-index: 2;
}

body.page-id-25 header .wp-block-site-logo img {
    display: block !important;

    max-height: 46px !important;
    width: auto !important;

    filter:
        brightness(0)
        invert(1)
        drop-shadow(0 0 10px rgba(56,194,217,.10)) !important;
}


/* ------------------------------------------------------------
   Navigation
   ------------------------------------------------------------ */

body.page-id-25 header .wp-block-navigation {
    gap: 30px !important;
}

body.page-id-25 header .wp-block-navigation__container {
    gap: 30px !important;
}

body.page-id-25 header
.wp-block-navigation-item__content {
    position: relative !important;

    display: inline-flex !important;
    align-items: center !important;

    padding: 9px 0 !important;

    color:
        rgba(255,255,255,.76) !important;

    background: transparent !important;

    font-size:
        12px !important;

    font-weight:
        650 !important;

    line-height:
        1 !important;

    letter-spacing:
        .01em !important;

    text-decoration:
        none !important;

    transition:
        color .25s ease,
        transform .25s ease !important;
}


/* Hover-Linie */
body.page-id-25 header
.wp-block-navigation-item__content::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 2px;

    width: 0;
    height: 1px;

    background:
        var(--fh-cyan, #38c2d9);

    transition:
        width .28s ease;
}

body.page-id-25 header
.wp-block-navigation-item__content:hover {
    color: #ffffff !important;
}

body.page-id-25 header
.wp-block-navigation-item__content:hover::after {
    width: 100%;
}


/* ------------------------------------------------------------
   AKTIVE SEITE
   ------------------------------------------------------------ */

body.page-id-25 header
.wp-block-navigation-item.current-menu-item
.wp-block-navigation-item__content {
    color: #ffffff !important;
}

body.page-id-25 header
.wp-block-navigation-item.current-menu-item
.wp-block-navigation-item__content::after {
    width: 100%;
}


/* ------------------------------------------------------------
   KONTAKT als Premium-Button
   ------------------------------------------------------------ */

body.page-id-25 header
.wp-block-navigation__container
> .wp-block-navigation-item:nth-child(4)
> .wp-block-navigation-item__content {

    padding:
        11px 17px !important;

    border:
        1px solid rgba(56,194,217,.55) !important;

    border-radius:
        999px !important;

    color:
        #071018 !important;

    background:
        linear-gradient(
            135deg,
            #38c2d9,
            #62d6e5
        ) !important;

    box-shadow:
        0 8px 22px rgba(56,194,217,.12);
}

body.page-id-25 header
.wp-block-navigation__container
> .wp-block-navigation-item:nth-child(4)
> .wp-block-navigation-item__content::after {
    display: none !important;
}

body.page-id-25 header
.wp-block-navigation__container
> .wp-block-navigation-item:nth-child(4)
> .wp-block-navigation-item__content:hover {
    color:
        #061018 !important;

    transform:
        translateY(-2px);

    box-shadow:
        0 12px 28px rgba(56,194,217,.22);
}


/* ------------------------------------------------------------
   rechte/zusätzliche Header-Gruppen
   ------------------------------------------------------------ */

body.page-id-25 header .wp-block-buttons {
    gap: 10px !important;
}

body.page-id-25 header .wp-block-button__link {
    border-radius: 999px !important;
}


/* ------------------------------------------------------------
   MOBILE HEADER
   ------------------------------------------------------------ */

@media (max-width: 782px) {

    body.page-id-25 header.wp-block-template-part,
    body.page-id-25 .wp-site-blocks > header {
        min-height: 68px !important;
    }

    body.page-id-25 header .wp-block-site-logo img {
        max-height: 38px !important;
    }

    body.page-id-25 header .wp-block-navigation {
        gap: 12px !important;
    }

    body.page-id-25 header .wp-block-navigation__container {
        gap: 12px !important;
    }

    body.page-id-25 header
    .wp-block-navigation-item__content {
        font-size: 11px !important;
    }

    body.page-id-25 header
    .wp-block-navigation__container
    > .wp-block-navigation-item:nth-child(4)
    > .wp-block-navigation-item__content {
        padding:
            9px 13px !important;
    }
}


/* ============================================================
   FABIAN HIRSCH – HEADER FINAL FIX
   ============================================================ */

body.page-id-25 header.wp-block-template-part,
body.page-id-25 .wp-site-blocks > header.wp-block-template-part,
body.page-id-25 .wp-site-blocks > header {
    background: #050b11 !important;
    color: #ffffff !important;
    border-bottom: 1px solid rgba(255,255,255,.09) !important;
}


/* Alle normalen Menüpunkte weiß */
body.page-id-25 header .wp-block-navigation a,
body.page-id-25 header .wp-block-navigation-item a,
body.page-id-25 header .wp-block-navigation-item__content {
    color: #ffffff !important;
    background: transparent !important;
    opacity: 1 !important;
    text-decoration: none !important;
}


/* Hover */
body.page-id-25 header .wp-block-navigation a:hover,
body.page-id-25 header .wp-block-navigation-item__content:hover {
    color: #39c2d9 !important;
}


/* Aktive Seite */
body.page-id-25 header .current-menu-item > a,
body.page-id-25 header .current-menu-item
.wp-block-navigation-item__content {
    color: #ffffff !important;
}


/* Kontakt-Button bleibt bewusst türkis */
body.page-id-25 header
.wp-block-navigation__container
> .wp-block-navigation-item:nth-child(4)
> a,
body.page-id-25 header
.wp-block-navigation__container
> .wp-block-navigation-item:nth-child(4)
> .wp-block-navigation-item__content {
    color: #061018 !important;

    background:
        linear-gradient(
            135deg,
            #39c2d9,
            #61d6e5
        ) !important;

    border: 1px solid rgba(255,255,255,.14) !important;
}


/* Logo sichtbar */
body.page-id-25 header .wp-block-site-logo img {
    filter:
        brightness(0)
        invert(1) !important;
}


/* feine Cyan-Linie unten */
body.page-id-25 header.wp-block-template-part::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(57,194,217,.75),
            transparent
        );

    pointer-events: none;
}


/* ============================================================
   FABIAN HIRSCH – HEADER INNER BLOCK FIX
   ============================================================ */

/* Äußerer Header */
body.page-id-25 header.wp-block-template-part {
    background-color: #050b11 !important;
    background-image: none !important;
    color: #ffffff !important;
}

/* Alle inneren Header-Gruppen */
body.page-id-25 header.wp-block-template-part > div,
body.page-id-25 header.wp-block-template-part > div > div,
body.page-id-25 header.wp-block-template-part .wp-block-group,
body.page-id-25 header.wp-block-template-part .wp-block-navigation,
body.page-id-25 header.wp-block-template-part .wp-block-navigation__container,
body.page-id-25 header.wp-block-template-part .wp-block-site-logo {
    background-color: #050b11 !important;
    background-image: none !important;
    color: #ffffff !important;
}

/* Navigation */
body.page-id-25 header.wp-block-template-part
.wp-block-navigation-item,
body.page-id-25 header.wp-block-template-part
.wp-block-navigation-item__content,
body.page-id-25 header.wp-block-template-part
.wp-block-navigation-item a {
    color: #ffffff !important;
    background: transparent !important;
    opacity: 1 !important;
}

/* Hover */
body.page-id-25 header.wp-block-template-part
.wp-block-navigation-item__content:hover,
body.page-id-25 header.wp-block-template-part
.wp-block-navigation-item a:hover {
    color: #39c2d9 !important;
}

/* Kontakt-Button */
body.page-id-25 header.wp-block-template-part
.wp-block-navigation-item:nth-child(4)
.wp-block-navigation-item__content,
body.page-id-25 header.wp-block-template-part
.wp-block-navigation-item:nth-child(4) a {
    color: #061018 !important;

    background:
        linear-gradient(
            135deg,
            #39c2d9,
            #64d8e5
        ) !important;

    border-radius: 999px !important;
}

/* Logo sichtbar */
body.page-id-25 header.wp-block-template-part
.wp-block-site-logo img {
    filter:
        brightness(0)
        invert(1) !important;
}

/* Header-Linie */
body.page-id-25 header.wp-block-template-part::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(57,194,217,.75),
            transparent
        ) !important;
}


/* 24ST – Projektbild etwas kleiner */
body.page-id-25 .fh-home-project img {
    max-width:88%!important;
    width:88%!important;
    margin-left:auto!important;
    margin-right:auto!important;
}

@media (max-width:800px) {
    body.page-id-25 .fh-home-project img {
        max-width:92%!important;
        width:92%!important;
    }
}


/* 24ST – Projektbild deutlich kleiner */
body.page-id-25 .fh-home-project img {
    width:65%!important;
    max-width:65%!important;
    height:auto!important;
    margin-left:auto!important;
    margin-right:auto!important;
}

@media (max-width:800px) {
    body.page-id-25 .fh-home-project img {
        width:78%!important;
        max-width:78%!important;
    }
}


/* =========================================================
   HOME – LERNVIDEO / PROJEKT-BILD NICHT ÜBER DEN RAND
   ========================================================= */

body.page-id-25 img[src*="4CB361EA-F012-4E70-A110-E74E6B0F93DC"] {
    display:block!important;
    width:82%!important;
    max-width:900px!important;
    height:auto!important;
    margin-left:auto!important;
    margin-right:auto!important;
    object-fit:contain!important;
}

@media (max-width:800px) {
    body.page-id-25 img[src*="4CB361EA-F012-4E70-A110-E74E6B0F93DC"] {
        width:92%!important;
        max-width:100%!important;
    }
}


/* =========================================================
   HOME – "WAS ICH MACHE" / LEISTUNGSKARTEN
   ========================================================= */

/* Karten-Container */

/* Jede einzelne Leistungskarte */

/* Cyan accent boven */

/* Hover */

/* Karten-Inhalt */

/* Überschriften */

/* Beschreibung */

/* Links / Pfeile */


/* Nummern */

/* Desktop – gleiche Höhe */
@media(min-width:901px) {


}

/* Tablet */
@media(max-width:900px) {


}

/* Mobile */
@media(max-width:600px) {



}


/* =========================================================
   HOME – LEISTUNGEN / ANGEBOTE
   Echte WordPress-Buttons der Home-Seite
   ========================================================= */

/* Leistungsbereich */
body.page-id-25 .wp-block-button:has(a[href*="website-angebot"]),
body.page-id-25 .wp-block-button:has(a[href*="online-praesenz-angebot"]),
body.page-id-25 .wp-block-button:has(a[href*="online-shop-angebot"]),
body.page-id-25 .wp-block-button:has(a[href*="netzwerk-fuer-macher"]),
body.page-id-25 .wp-block-button:has(a[href*="portalkit"]),
body.page-id-25 .wp-block-button:has(a[href*="druckerleasing"]),
body.page-id-25 .wp-block-button:has(a[href*="hirsch-buerotechnik"]),
body.page-id-25 .wp-block-button:has(a[href*="druck-und-kopierservices"]) {
    margin:0!important;
    width:100%!important;
}

/* Die eigentliche Karte */
body.page-id-25 .wp-block-button:has(a[href*="website-angebot"]) .wp-block-button__link,
body.page-id-25 .wp-block-button:has(a[href*="online-praesenz-angebot"]) .wp-block-button__link,
body.page-id-25 .wp-block-button:has(a[href*="online-shop-angebot"]) .wp-block-button__link,
body.page-id-25 .wp-block-button:has(a[href*="netzwerk-fuer-macher"]) .wp-block-button__link,
body.page-id-25 .wp-block-button:has(a[href*="portalkit"]) .wp-block-button__link,
body.page-id-25 .wp-block-button:has(a[href*="druckerleasing"]) .wp-block-button__link,
body.page-id-25 .wp-block-button:has(a[href*="hirsch-buerotechnik"]) .wp-block-button__link,
body.page-id-25 .wp-block-button:has(a[href*="druck-und-kopierservices"]) .wp-block-button__link {
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    min-height:92px!important;
    box-sizing:border-box!important;

    padding:26px 30px!important;
    margin:0!important;

    border:1px solid rgba(20,35,45,.10)!important;
    border-radius:18px!important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f7fafb 100%
        )!important;

    color:#111820!important;

    font-size:18px!important;
    font-weight:750!important;
    line-height:1.25!important;
    text-align:left!important;
    text-decoration:none!important;

    box-shadow:
        0 10px 28px rgba(15,25,35,.07),
        0 2px 6px rgba(15,25,35,.035)!important;

    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease,
        background .22s ease!important;
}

/* kleiner cyan Akzent links */
body.page-id-25 .wp-block-button:has(a[href*="website-angebot"]) .wp-block-button__link::before,
body.page-id-25 .wp-block-button:has(a[href*="online-praesenz-angebot"]) .wp-block-button__link::before,
body.page-id-25 .wp-block-button:has(a[href*="online-shop-angebot"]) .wp-block-button__link::before,
body.page-id-25 .wp-block-button:has(a[href*="netzwerk-fuer-macher"]) .wp-block-button__link::before,
body.page-id-25 .wp-block-button:has(a[href*="portalkit"]) .wp-block-button__link::before,
body.page-id-25 .wp-block-button:has(a[href*="druckerleasing"]) .wp-block-button__link::before,
body.page-id-25 .wp-block-button:has(a[href*="hirsch-buerotechnik"]) .wp-block-button__link::before,
body.page-id-25 .wp-block-button:has(a[href*="druck-und-kopierservices"]) .wp-block-button__link::before {
    content:""!important;
    position:absolute!important;
    left:0!important;
    top:20px!important;
    bottom:20px!important;
    width:4px!important;
    border-radius:0 6px 6px 0!important;
    background:#25c7e8!important;
}

/* Pfeil rechts */
body.page-id-25 .wp-block-button:has(a[href*="website-angebot"]) .wp-block-button__link::after,
body.page-id-25 .wp-block-button:has(a[href*="online-praesenz-angebot"]) .wp-block-button__link::after,
body.page-id-25 .wp-block-button:has(a[href*="online-shop-angebot"]) .wp-block-button__link::after,
body.page-id-25 .wp-block-button:has(a[href*="netzwerk-fuer-macher"]) .wp-block-button__link::after,
body.page-id-25 .wp-block-button:has(a[href*="portalkit"]) .wp-block-button__link::after,
body.page-id-25 .wp-block-button:has(a[href*="druckerleasing"]) .wp-block-button__link::after,
body.page-id-25 .wp-block-button:has(a[href*="hirsch-buerotechnik"]) .wp-block-button__link::after,
body.page-id-25 .wp-block-button:has(a[href*="druck-und-kopierservices"]) .wp-block-button__link::after {
    content:"→"!important;
    position:absolute!important;
    right:25px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    color:#18b9dc!important;
    font-size:22px!important;
    font-weight:400!important;
    transition:transform .22s ease!important;
}

/* Hover */
body.page-id-25 .wp-block-button:has(a[href*="website-angebot"]) .wp-block-button__link:hover,
body.page-id-25 .wp-block-button:has(a[href*="online-praesenz-angebot"]) .wp-block-button__link:hover,
body.page-id-25 .wp-block-button:has(a[href*="online-shop-angebot"]) .wp-block-button__link:hover,
body.page-id-25 .wp-block-button:has(a[href*="netzwerk-fuer-macher"]) .wp-block-button__link:hover,
body.page-id-25 .wp-block-button:has(a[href*="portalkit"]) .wp-block-button__link:hover,
body.page-id-25 .wp-block-button:has(a[href*="druckerleasing"]) .wp-block-button__link:hover,
body.page-id-25 .wp-block-button:has(a[href*="hirsch-buerotechnik"]) .wp-block-button__link:hover,
body.page-id-25 .wp-block-button:has(a[href*="druck-und-kopierservices"]) .wp-block-button__link:hover {
    transform:translateY(-4px)!important;
    border-color:rgba(37,199,232,.35)!important;
    background:#ffffff!important;
    box-shadow:
        0 18px 38px rgba(15,25,35,.12),
        0 0 0 1px rgba(37,199,232,.06)!important;
    color:#111820!important;
}

body.page-id-25 .wp-block-button:has(a[href*="website-angebot"]) .wp-block-button__link:hover::after,
body.page-id-25 .wp-block-button:has(a[href*="online-praesenz-angebot"]) .wp-block-button__link:hover::after,
body.page-id-25 .wp-block-button:has(a[href*="online-shop-angebot"]) .wp-block-button__link:hover::after,
body.page-id-25 .wp-block-button:has(a[href*="netzwerk-fuer-macher"]) .wp-block-button__link:hover::after,
body.page-id-25 .wp-block-button:has(a[href*="portalkit"]) .wp-block-button__link:hover::after,
body.page-id-25 .wp-block-button:has(a[href*="druckerleasing"]) .wp-block-button__link:hover::after,
body.page-id-25 .wp-block-button:has(a[href*="hirsch-buerotechnik"]) .wp-block-button__link:hover::after,
body.page-id-25 .wp-block-button:has(a[href*="druck-und-kopierservices"]) .wp-block-button__link:hover::after {
    transform:translate(5px,-50%)!important;
}

/* Abstand zwischen den Karten */
body.page-id-25 .wp-block-button:has(a[href*="website-angebot"]),
body.page-id-25 .wp-block-button:has(a[href*="online-praesenz-angebot"]),
body.page-id-25 .wp-block-button:has(a[href*="online-shop-angebot"]),
body.page-id-25 .wp-block-button:has(a[href*="netzwerk-fuer-macher"]),
body.page-id-25 .wp-block-button:has(a[href*="portalkit"]),
body.page-id-25 .wp-block-button:has(a[href*="druckerleasing"]),
body.page-id-25 .wp-block-button:has(a[href*="hirsch-buerotechnik"]),
body.page-id-25 .wp-block-button:has(a[href*="druck-und-kopierservices"]) {
    margin-bottom:16px!important;
}

/* Mobile */
@media(max-width:700px) {

    body.page-id-25 .wp-block-button:has(a[href*="website-angebot"]) .wp-block-button__link,
    body.page-id-25 .wp-block-button:has(a[href*="online-praesenz-angebot"]) .wp-block-button__link,
    body.page-id-25 .wp-block-button:has(a[href*="online-shop-angebot"]) .wp-block-button__link,
    body.page-id-25 .wp-block-button:has(a[href*="netzwerk-fuer-macher"]) .wp-block-button__link,
    body.page-id-25 .wp-block-button:has(a[href*="portalkit"]) .wp-block-button__link,
    body.page-id-25 .wp-block-button:has(a[href*="druckerleasing"]) .wp-block-button__link,
    body.page-id-25 .wp-block-button:has(a[href*="hirsch-buerotechnik"]) .wp-block-button__link,
    body.page-id-25 .wp-block-button:has(a[href*="druck-und-kopierservices"]) .wp-block-button__link {
        min-height:78px!important;
        padding:21px 52px 21px 24px!important;
        border-radius:15px!important;
        font-size:16px!important;
    }

}



/* =========================================================
   HOME – PREMIUM SERVICE CARDS V2
   ========================================================= */

body.page-id-25 .fhp-services {
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:18px !important;
    margin-top:48px !important;
}

body.page-id-25 .fhp-services .fhp-service {
    position:relative !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:space-between !important;

    min-height:285px !important;
    box-sizing:border-box !important;

    padding:30px 30px 28px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f8fafb 100%
        ) !important;

    border:1px solid rgba(6,16,24,.10) !important;
    border-radius:4px !important;

    color:#061018 !important;
    text-decoration:none !important;

    overflow:hidden !important;

    box-shadow:
        0 10px 30px rgba(6,16,24,.055) !important;

    transition:
        transform .28s ease,
        box-shadow .28s ease,
        border-color .28s ease,
        background .28s ease !important;
}


/* feine cyan Linie oben */
body.page-id-25 .fhp-services .fhp-service::before {
    content:"" !important;

    position:absolute !important;
    left:0 !important;
    top:0 !important;

    width:100% !important;
    height:3px !important;

    background:
        linear-gradient(
            90deg,
            #35c5df 0%,
            #8dddec 45%,
            transparent 100%
        ) !important;

    opacity:.85 !important;
}


/* dezenter Hintergrund-Akzent */
body.page-id-25 .fhp-services .fhp-service::after {
    content:"" !important;

    position:absolute !important;

    width:150px !important;
    height:150px !important;

    right:-80px !important;
    bottom:-80px !important;

    border-radius:50% !important;

    background:rgba(37,199,232,.07) !important;

    pointer-events:none !important;

    transition:
        transform .35s ease,
        background .35s ease !important;
}


/* Nummer */
body.page-id-25 .fhp-services .fhp-number {
    position:relative !important;
    z-index:2 !important;

    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:42px !important;
    height:28px !important;

    margin-bottom:48px !important;

    border-bottom:1px solid rgba(6,16,24,.35) !important;

    color:#5f707b !important;

    font-family:inherit !important;
    font-size:12px !important;
    font-weight:600 !important;
    letter-spacing:.16em !important;

    text-decoration:none !important;
}


/* Inhalt */
body.page-id-25 .fhp-services .fhp-service > div {
    position:relative !important;
    z-index:2 !important;

    margin-top:auto !important;
}


/* Überschrift */
body.page-id-25 .fhp-services .fhp-service h3 {
    margin:0 0 10px !important;

    color:#061018 !important;

    font-family:inherit !important;
    font-size:25px !important;
    font-weight:500 !important;
    line-height:1.12 !important;
    letter-spacing:-.025em !important;

    text-decoration:none !important;
}


/* Beschreibung */
body.page-id-25 .fhp-services .fhp-service p {
    max-width:390px !important;

    margin:0 !important;

    color:#60717c !important;

    font-family:inherit !important;
    font-size:14px !important;
    font-weight:400 !important;
    line-height:1.6 !important;

    text-decoration:none !important;
}


/* Pfeil */
body.page-id-25 .fhp-services .fhp-service > strong {
    position:absolute !important;
    z-index:3 !important;

    right:28px !important;
    bottom:25px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:34px !important;
    height:34px !important;

    color:#20b9d8 !important;

    font-size:23px !important;
    font-weight:400 !important;
    line-height:1 !important;

    transition:
        transform .28s ease,
        color .28s ease !important;
}


/* Hover */
body.page-id-25 .fhp-services .fhp-service:hover {
    transform:translateY(-7px) !important;

    border-color:rgba(32,185,216,.45) !important;

    background:#ffffff !important;

    box-shadow:
        0 22px 48px rgba(6,16,24,.12),
        0 4px 10px rgba(6,16,24,.04) !important;
}


body.page-id-25 .fhp-services .fhp-service:hover::after {
    transform:scale(1.45) !important;
    background:rgba(37,199,232,.11) !important;
}


body.page-id-25 .fhp-services .fhp-service:hover > strong {
    transform:translateX(6px) !important;
    color:#061018 !important;
}


body.page-id-25 .fhp-services .fhp-service:hover .fhp-number {
    color:#20b9d8 !important;
    border-color:#20b9d8 !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width:1000px) {

    body.page-id-25 .fhp-services {
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:16px !important;
    }

    body.page-id-25 .fhp-services .fhp-service {
        min-height:270px !important;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width:700px) {

    body.page-id-25 .fhp-services {
        grid-template-columns:1fr !important;
        gap:14px !important;
        margin-top:32px !important;
    }

    body.page-id-25 .fhp-services .fhp-service {
        min-height:230px !important;
        padding:25px 24px 24px !important;
    }

    body.page-id-25 .fhp-services .fhp-number {
        margin-bottom:35px !important;
    }

    body.page-id-25 .fhp-services .fhp-service h3 {
        font-size:22px !important;
    }

    body.page-id-25 .fhp-services .fhp-service p {
        font-size:14px !important;
        padding-right:25px !important;
    }

    body.page-id-25 .fhp-services .fhp-service > strong {
        right:22px !important;
        bottom:21px !important;
    }
}


/* ============================================================
   24ST MULTISHOP – RECHTE TECHNIK-KARTE
   ============================================================ */

.fhp-multishop-card {
    position: relative;
    overflow: hidden;
}

.fhp-multishop-card > span {
    color: #4dc4dc !important;
    letter-spacing: .18em !important;
}

.fhp-multishop-card h3 {
    margin-bottom: 16px !important;
}

.fhp-multishop-card > p {
    margin-bottom: 22px !important;
}

.fhp-shop-links {
    display: flex;
    flex-direction: column;
    gap: 7px;
    margin: 18px 0 20px;
}

.fhp-shop-link {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    padding: 11px 13px;

    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.025);

    color: #fff !important;
    text-decoration: none !important;

    transition:
        background .2s ease,
        border-color .2s ease,
        transform .2s ease;
}

.fhp-shop-link strong {
    color: #fff;
    font-size: 11px;
    letter-spacing: .14em;
    font-weight: 600;
}

.fhp-shop-link span {
    color: rgba(255,255,255,.55);
    font-size: 11px;
}

.fhp-shop-link:hover {
    background: rgba(77,196,220,.09);
    border-color: rgba(77,196,220,.45);
    transform: translateX(3px);
}

.fhp-shop-link:hover span {
    color: #4dc4dc;
}

.fhp-multishop-main-link {
    margin-top: 8px !important;
}

@media (max-width: 700px) {

    .fhp-shop-link {
        padding: 10px 12px;
    }

    .fhp-shop-link strong {
        font-size: 10px;
    }

    .fhp-shop-link span {
        font-size: 10px;
    }

}


/* ============================================================
   FIX – MULTISHOP LABEL NICHT MEHR ÜBER DER ÜBERSCHRIFT
   ============================================================ */

body.page-id-25 .fhp-multishop-card > span:first-child {
    position: static !important;
    display: block !important;
    margin: 0 0 12px !important;
    transform: none !important;
}

body.page-id-25 .fhp-multishop-card h3 {
    margin-top: 0 !important;
}


/* ============================================================
   HERO – LOGO STATT PROJEKTBILD
   ============================================================ */

body.page-id-25 .fhp-hero > .fhp-grid,
body.page-id-25 .fhp-hero .fhp-hero-card,
body.page-id-25 .fhp-hero .fhp-project-card {
    background-image: none !important;
}

/* Großes rechtes Hero-Bild ausblenden */
body.page-id-25 .fhp-hero img {
    object-fit: contain !important;
}

/* Logo als Hero-Bild */
body.page-id-25 .fhp-hero img[src*="cropped-1.3-Schwarz-Logo-Freigestellt"] {
    content: url("https://fabianhirsch.de/wp-content/uploads/2025/04/cropped-1.3-Schwarz-Logo-Freigestellt-e1748254542333.png") !important;
    object-fit: contain !important;
    width: 65% !important;
    height: auto !important;
    max-height: 65% !important;
    margin: auto !important;
}

/* FH-SHOWCASE-START – Projekte & CTA (wird bei Updates ersetzt) */
.fh-premium-home .fhp-sc-grid{display:grid;grid-template-columns:1.3fr .85fr 1.3fr;gap:24px;margin-top:48px;align-items:stretch}
.fh-premium-home .fhp-sc-card{position:relative;display:flex;flex-direction:column;gap:22px;padding:28px;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.08);overflow:hidden;transition:opacity .8s ease,translate .8s ease,transform .35s,box-shadow .35s}
.fh-premium-home .fhp-sc-card::before{content:"";position:absolute;inset:0;z-index:3;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(76,201,224,.6),transparent 40%,transparent 60%,rgba(76,201,224,.35));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .35s;pointer-events:none}
.fh-premium-home .fhp-sc-card:hover{transform:translateY(-4px);box-shadow:0 24px 60px rgba(0,0,0,.45)}
.fh-premium-home .fhp-sc-card:hover::before{opacity:1}
.fh-premium-home .fhp-sc-grid.fh-reveal .fhp-sc-card{opacity:0;translate:0 28px}
.fh-premium-home .fhp-sc-grid.fh-reveal.is-in .fhp-sc-card{opacity:1;translate:0 0}
.fh-premium-home .fhp-sc-grid.fh-reveal.is-in .fhp-sc-card:nth-child(2){transition-delay:.12s,.12s,0s,0s}
.fh-premium-home .fhp-sc-grid.fh-reveal.is-in .fhp-sc-card:nth-child(3){transition-delay:.24s,.24s,0s,0s}
.fh-premium-home .fhp-sc-tag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.18em;color:#4cc9e0;text-transform:uppercase}
.fh-premium-home .fhp-sc-head h3{color:#fff;font-size:clamp(24px,2.2vw,32px);line-height:1.15;margin:10px 0}
.fh-premium-home .fhp-sc-head p{color:#9aa7b4;font-size:14.5px;line-height:1.6;margin:0}
.fh-premium-home .fhp-sc-browser{border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.1);background:#0b0f14;box-shadow:0 18px 40px rgba(0,0,0,.4)}
.fh-premium-home .fhp-sc-bar,.fh-premium-home .fhp-cc-bar{display:flex;align-items:center;gap:6px;padding:10px 12px;background:#121821;border-bottom:1px solid rgba(255,255,255,.06)}
.fh-premium-home .fhp-sc-bar i,.fh-premium-home .fhp-cc-bar i{width:9px;height:9px;border-radius:50%;background:#ff5f57}
.fh-premium-home .fhp-sc-bar i:nth-child(2),.fh-premium-home .fhp-cc-bar i:nth-child(2){background:#febc2e}
.fh-premium-home .fhp-sc-bar i:nth-child(3),.fh-premium-home .fhp-cc-bar i:nth-child(3){background:#28c840}
.fh-premium-home .fhp-sc-url{flex:1;min-width:0;margin-left:10px;padding:4px 10px;border-radius:6px;background:rgba(255,255,255,.05);color:#e6edf3;font:12px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fh-premium-home .fhp-sc-url::before{content:"https://";color:#5c6773}
.fh-premium-home .fhp-sc-screens{position:relative;aspect-ratio:16/11}
.fh-premium-home .fhp-sc-shot{position:absolute;inset:0;display:block;text-decoration:none;opacity:0;visibility:hidden;transition:opacity .6s,visibility .6s}
.fh-premium-home .fhp-sc-shot.is-active{opacity:1;visibility:visible}
.fh-premium-home .fhp-sc-shot img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 0;transition:object-position 5s ease}
.fh-premium-home .fhp-sc-browser:hover .fhp-sc-shot img{object-position:50% 100%}
.fh-premium-home .fhp-sc-shot em{display:none}
.fh-premium-home .fhp-sc-shot.is-missing{display:grid;place-items:center;background:radial-gradient(circle at 30% 20%,rgba(76,201,224,.25),transparent 60%),#0d1117}
.fh-premium-home .fhp-sc-shot.is-missing img{display:none}
.fh-premium-home .fhp-sc-shot.is-missing em{display:block;font-style:normal;color:#e6edf3;font-size:22px;font-weight:600}
.fh-premium-home .fhp-sc-tabs{display:flex;flex-wrap:wrap;gap:8px}
.fh-premium-home .fhp-sc-tabs button{position:relative;overflow:hidden;padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.1);background:transparent;color:#9aa7b4;font:inherit;font-size:13px;cursor:pointer;transition:color .25s,border-color .25s,background .25s}
.fh-premium-home .fhp-sc-tabs button:hover{color:#fff;border-color:rgba(76,201,224,.5)}
.fh-premium-home .fhp-sc-tabs button.is-active{color:#06131a;background:#4cc9e0;border-color:#4cc9e0;font-weight:600}
.fh-premium-home .fhp-sc-tabs button.is-active::after{content:"";position:absolute;left:0;bottom:0;height:2px;background:rgba(6,19,26,.55);animation:fhScProg 4.5s linear forwards}
.fh-premium-home .fhp-sc-web:hover .fhp-sc-tabs button.is-active::after{animation-play-state:paused}
@keyframes fhScProg{from{width:0}to{width:100%}}
.fh-premium-home .fhp-sc-actions{margin-top:auto;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.fh-premium-home .fhp-sc-live{color:#e6edf3;font-weight:600;font-size:14px;text-decoration:none;border-bottom:1px solid rgba(76,201,224,.5);padding-bottom:2px;transition:color .25s}
.fh-premium-home .fhp-sc-live:hover{color:#4cc9e0}
.fh-premium-home .fhp-sc-ask{display:inline-flex;gap:8px;align-items:center;padding:10px 18px;border-radius:999px;background:rgba(76,201,224,.12);border:1px solid rgba(76,201,224,.45);color:#4cc9e0;font-weight:700;font-size:13px;text-decoration:none;transition:background .25s,color .25s,box-shadow .25s}
.fh-premium-home .fhp-sc-ask:hover{background:#4cc9e0;color:#06131a;box-shadow:0 8px 24px rgba(76,201,224,.35)}
.fh-premium-home .fhp-sc-ask span,.fh-premium-home .fhp-sc-live span{display:inline-block;transition:transform .25s}
.fh-premium-home .fhp-sc-ask:hover span{transform:translateX(3px)}
.fh-premium-home .fhp-sc-live:hover span{transform:translate(2px,-2px)}
.fh-premium-home .fhp-sc-it{padding:0;min-height:440px}
.fh-premium-home .fhp-sc-it img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.85);transition:transform 1.2s ease}
.fh-premium-home .fhp-sc-it:hover img{transform:scale(1.06)}
.fh-premium-home .fhp-sc-it::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,11,16,0) 30%,rgba(8,11,16,.94))}
.fh-premium-home .fhp-sc-it-overlay{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:28px}
.fh-premium-home .fhp-sc-it-overlay strong{display:block;color:#fff;font-size:26px;line-height:1.2;margin:8px 0}
.fh-premium-home .fhp-sc-it-overlay p{color:#9aa7b4;font-size:14px;line-height:1.55;margin:0}
.fh-premium-home .fhp-sc-shops{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fh-premium-home .fhp-sc-mini{position:relative;display:block;aspect-ratio:4/3;border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.08);background:#0d1117;text-decoration:none;transition:border-color .3s,transform .3s}
.fh-premium-home .fhp-sc-mini img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 0;transition:object-position 4s ease}
.fh-premium-home .fhp-sc-mini:hover{border-color:rgba(76,201,224,.6);transform:translateY(-2px)}
.fh-premium-home .fhp-sc-mini:hover img{object-position:50% 100%}
.fh-premium-home .fhp-sc-mini::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(8,11,16,.92))}
.fh-premium-home .fhp-sc-mini.is-missing{background:radial-gradient(circle at 30% 20%,rgba(76,201,224,.25),transparent 60%),#0d1117}
.fh-premium-home .fhp-sc-mini.is-missing img{display:none}
.fh-premium-home .fhp-sc-mini-label{position:absolute;left:12px;right:12px;bottom:10px;z-index:2;display:flex;justify-content:space-between;align-items:flex-end;gap:6px}
.fh-premium-home .fhp-sc-mini strong{color:#fff;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase}
.fh-premium-home .fhp-sc-mini small{color:#4cc9e0;font-size:11.5px;opacity:0;transform:translateY(4px);transition:opacity .25s,transform .25s}
.fh-premium-home .fhp-sc-mini:hover small{opacity:1;transform:none}
@media(hover:none){.fh-premium-home .fhp-sc-mini small{opacity:1;transform:none}}
@media(max-width:1100px){.fh-premium-home .fhp-sc-grid{grid-template-columns:1fr 1fr}.fh-premium-home .fhp-sc-it{grid-column:1/-1;order:3;min-height:300px}}
@media(max-width:700px){.fh-premium-home .fhp-sc-grid{grid-template-columns:1fr}.fh-premium-home .fhp-sc-card{padding:22px}}

.fh-premium-home .fhp-cc{position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 70% 30%,rgba(76,201,224,.10),transparent 55%),linear-gradient(180deg,#0b1016,#080b10);padding:clamp(80px,10vw,140px) clamp(20px,5vw,48px)}
.fh-premium-home .fhp-cc-net{position:absolute;inset:0;z-index:-1;pointer-events:none}
.fh-premium-home .fhp-cc-glow{position:absolute;z-index:-1;width:620px;height:620px;right:-120px;top:50%;transform:translateY(-50%);background:radial-gradient(circle,rgba(76,201,224,.18),transparent 65%);filter:blur(10px);animation:fhCcFloat 9s ease-in-out infinite alternate;pointer-events:none}
@keyframes fhCcFloat{to{transform:translateY(-42%) scale(1.08)}}
.fh-premium-home .fhp-cc-inner{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(40px,6vw,90px);align-items:center}
.fh-premium-home .fhp-cc h2{color:#fff;font-size:clamp(44px,6vw,92px);line-height:.98;letter-spacing:-.02em;margin:18px 0 22px}
.fh-premium-home .fhp-cc h2 em{color:#4cc9e0;font-style:normal;text-shadow:0 0 40px rgba(76,201,224,.35)}
.fh-premium-home .fhp-cc-text p{color:#9aa7b4;font-size:17px;line-height:1.7;max-width:460px;margin:0 0 34px}
.fh-premium-home .fhp-cc-btns{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.fh-premium-home .fhp-cc-btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:10px;padding:16px 28px;border-radius:999px;background:linear-gradient(135deg,#4cc9e0,#36a9c2);color:#06131a;font-weight:800;font-size:14px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;animation:fhCcPulse 2.6s ease-out infinite}
.fh-premium-home .fhp-cc-btn::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(110deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:fhCcShine 3.5s ease-in-out infinite}
.fh-premium-home .fhp-cc-btn span{display:inline-block;transition:transform .25s}
.fh-premium-home .fhp-cc-btn:hover span{transform:translateX(5px)}
@keyframes fhCcPulse{0%{box-shadow:0 0 0 0 rgba(76,201,224,.45)}70%{box-shadow:0 0 0 18px rgba(76,201,224,0)}100%{box-shadow:0 0 0 0 rgba(76,201,224,0)}}
@keyframes fhCcShine{0%,60%{left:-60%}100%{left:130%}}
.fh-premium-home .fhp-cc-btn2{color:#e6edf3;font-weight:600;font-size:14px;text-decoration:none;padding:15px 22px;border-radius:999px;border:1px solid rgba(255,255,255,.14);transition:border-color .25s,color .25s}
.fh-premium-home .fhp-cc-btn2:hover{border-color:#4cc9e0;color:#4cc9e0}
.fh-premium-home .fhp-cc-editor{position:relative;border-radius:16px;overflow:hidden;background:rgba(13,17,23,.88);border:1px solid rgba(255,255,255,.09);box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 60px rgba(76,201,224,.08);backdrop-filter:blur(8px);transform:perspective(1200px) rotateY(-6deg) rotateX(2deg);transition:transform .6s ease}
.fh-premium-home .fhp-cc-editor:hover{transform:perspective(1200px) rotateY(0) rotateX(0)}
.fh-premium-home .fhp-cc-bar span{margin-left:12px;color:#9aa7b4;font:12px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.fh-premium-home .fhp-cc-code{display:block;margin:0;padding:20px 22px 18px 0;min-height:260px;background:none;color:#e6edf3;font:14px/1.75 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:pre;overflow-x:auto;counter-reset:ln}
.fh-premium-home .fhp-cc-line{display:block;position:relative;min-height:1.75em;padding-left:56px}
.fh-premium-home .fhp-cc-line::before{counter-increment:ln;content:counter(ln);position:absolute;left:0;width:38px;text-align:right;color:#3b4654}
.fh-premium-home .fhp-cc-caret{display:inline-block;width:8px;height:1.15em;margin-left:1px;vertical-align:text-bottom;background:#4cc9e0;box-shadow:0 0 10px #4cc9e0;animation:fhCaret 1s steps(1) infinite}
@keyframes fhCaret{50%{opacity:0}}
.fh-premium-home .t-k{color:#c792ea}.fh-premium-home .t-v{color:#e6edf3}.fh-premium-home .t-f{color:#82aaff}.fh-premium-home .t-a{color:#7fdbca}.fh-premium-home .t-s{color:#c3e88d}.fh-premium-home .t-p{color:#89ddff}.fh-premium-home .t-c{color:#5c6773;font-style:italic}
.fh-premium-home .fhp-cc-term{display:flex;align-items:center;gap:10px;padding:14px 22px;border-top:1px solid rgba(255,255,255,.06);background:rgba(0,0,0,.25);color:#9aa7b4;font:13px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;opacity:0;transform:translateY(8px);transition:opacity .5s,transform .5s}
.fh-premium-home .fhp-cc-term.is-on{opacity:1;transform:none}
.fh-premium-home .fhp-cc-term .ok{color:#28c840}
.fh-premium-home .fhp-cc-term b{color:#4cc9e0;font-weight:600}
@media(max-width:960px){.fh-premium-home .fhp-cc-inner{grid-template-columns:1fr}.fh-premium-home .fhp-cc-editor{transform:none}}
@media(max-width:560px){.fh-premium-home .fhp-cc-code{font-size:12px}.fh-premium-home .fhp-cc-line{padding-left:40px}.fh-premium-home .fhp-cc-line::before{width:26px}}
@media(prefers-reduced-motion:reduce){.fh-premium-home .fhp-cc-btn,.fh-premium-home .fhp-cc-btn::after,.fh-premium-home .fhp-cc-glow,.fh-premium-home .fhp-sc-tabs button.is-active::after{animation:none}}
.fh-premium-home .fhp-hero{position:relative;isolation:isolate}
.fh-premium-home .fhp-net{position:absolute;inset:0;z-index:-1;pointer-events:none}
/* FH-SHOWCASE-END */