/*
Theme Name: Innovotex Custom
Theme URI: 
Author: Jen Higginbotham
Author URI: 
Description: A custom theme
Requires at least: 7.1
Tested up to: 7.1
Requires PHP: 5.7
Version: 
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: frost
Text Domain: innovotex-custom
Tags: 
*/



/* ==================================================
   INNOVOTEX - STICKY SITE HEADER
================================================== */

.wp-site-blocks > header.wp-block-template-part {
    position: sticky;
    top: 0;
    z-index: 1000;
    background-color: #FFFFFF;
}




/* ==================================================
   INNOVOTEX - STICKY HEADER ANCHOR OFFSET
================================================== */

html {
    scroll-padding-top: 155px;
}





/* ==================================================
   INNOVOTEX - HEADER NAVIGATION
   Main Menu Hover Color
================================================== */

header .wp-block-navigation
.wp-block-navigation-item__content:hover {
    color: #72D9B2 !important;
}






/* ==================================================
   INNOVOTEX - MOBILE HEADER NAVIGATION
   Center Hamburger Menu Under Logo
================================================== */

@media (max-width: 767px) {

    /* Center the mobile navigation block */
    header .wp-block-navigation {
        width: 100%;
        display: flex;
        justify-content: center !important;
    }

    /* Center the hamburger button */
    header .wp-block-navigation__responsive-container-open {
        margin-left: auto !important;
        margin-right: auto !important;
    }

}







/* ==================================================
   INNOVOTEX - MOBILE STICKY HEADER
   Anchor Offset Correction
================================================== */

@media (max-width: 767px) {

    html {
        scroll-padding-top: 190px;
    }

}














/* ==================================================
   Hero Science Image - Slide In + Float + Rotation
================================================== */

/* Float the whole image block + slide in once from right */
.hero-science-image {
    animation:
        heroScienceFloat 5s ease-in-out infinite,
        heroScienceSlideIn 1.2s ease-out 1 both;
}

/* Rotate the actual image */
.hero-science-image img {
    display: block;
    width: 100%;
    height: auto;
    animation: heroScienceRotate 36s linear infinite;
    transform-origin: center center;
}

/* Gentle continuous float */
@keyframes heroScienceFloat {
    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-18px);
    }
}

/* One-time entrance from right */
@keyframes heroScienceSlideIn {
    from {
        opacity: 0;
        translate: 120px 0;
    }

    to {
        opacity: 1;
        translate: 0 0;
    }
}

/* Slow continuous rotation */
@keyframes heroScienceRotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* Pause all movement when hovered */
.hero-science-image:hover,
.hero-science-image:hover img {
    animation-play-state: paused;
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
    .hero-science-image,
    .hero-science-image img {
        animation: none;
    }
}









/* ==================================================
   HERO SCIENCE IMAGE - RESET TO ORIGINAL SIZING
================================================== */

@media (min-width: 960px) {

    .hero-science-columns .hero-science-image {
        width: auto;
        max-width: 100%;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .hero-science-columns .hero-science-image img {
        display: block;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

}










/* ==================================================
   Hero Science - Tablet / In-Between Sizes
   959px and below
================================================== */

@media (max-width: 959px) {

    /* Stack the hero before the columns become too narrow */
    .hero-science-columns {
        flex-direction: column !important;
        flex-wrap: nowrap !important;
    }

    .hero-science-columns > .wp-block-column {
        flex-basis: 100% !important;
        width: 100% !important;
    }

    /* Center the molecule below the hero text */
    .hero-science-image {
        display: flex;
        justify-content: center;
        width: 100% !important;
        overflow: visible;
    }

    .hero-science-image img {
        width: clamp(280px, 48vw, 400px) !important;
        max-width: 100% !important;
        margin: 32px auto 0 !important;
    }

}





/* ==================================================
   HERO - TAGLINE COLUMN ALIGNMENT
   Desktop: 1101px and above
================================================== */

@media (min-width: 1101px) {

    .hero-science-columns > .hero-tagline-column {
        position: relative;
        left: 90px;
    }

}









/* ==================================================
   INNOVOTEX - HERO SECTION
   Reduce Excessive Bottom Spacing on Laptops
================================================== */

@media (min-width: 960px) and (max-width: 1440px) {

    .wp-block-group:has(> .hero-science-columns) {
        margin-bottom: 40px !important;
    }

}






/* ==================================================
   INNOVOTEX - HERO TO SCIENCE SECTION SPACING
   960px and above
================================================== */

@media (min-width: 960px) {

    .wp-block-group:has(> .hero-science-columns) {
        margin-bottom: 0 !important;
    }

    .wp-block-group:has(> .hero-science-columns)
    + .wp-block-group {
        margin-top: 0 !important;
    }

}










/* ==================================================
   INNOVOTEX - HERO MOLECULE LAPTOP REFINEMENT
   960px - 1439px ONLY
================================================== */

@media (min-width: 960px) and (max-width: 1439px) {

    /* Preserve the two-column laptop layout */
    .hero-science-columns {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
    }

    .hero-science-columns > .wp-block-column {
        flex: 1 1 0 !important;
        min-width: 0 !important;
    }

    /* Center the molecule within its column */
    .hero-science-columns .hero-science-image {
        box-sizing: border-box;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;

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

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

        position: relative;
        left: 0;
    }

    /* Smooth scaling with a controlled upper size */
    .hero-science-columns .hero-science-image img {
        display: block !important;

        width: clamp(420px, 45vw, 540px) !important;
        max-width: 100% !important;
        height: auto !important;

        margin: 0 auto !important;
        flex-shrink: 0 !important;
    }

}

/* ==================================================
   INNOVOTEX - HERO MOLECULE LAPTOP POSITION
   Smoothly reduce horizontal offset
================================================== */

@media (min-width: 960px) and (max-width: 1439px) {

    .hero-science-columns .hero-science-image {
        left: clamp(0px, calc(45px - (100vw - 1024px) * 0.108), 52px);
    }

}





/* ==================================================
   INNOVOTEX - HERO MOLECULE
   LARGE DESKTOP SIZE + OVERFLOW CONTROL
   1440px and above ONLY
================================================== */

@media (min-width: 1440px) {

    /* Prevent the hero columns from forcing overflow */
    .hero-science-columns > .wp-block-column {
        min-width: 0 !important;
    }

    /* Controlled scaling from 1440px through 2560px */
    .hero-science-columns .hero-science-image {
        box-sizing: border-box !important;
        position: relative;
        left: 0 !important;

        width: min(100%, clamp(500px, 27vw, 650px)) !important;
        max-width: 650px !important;

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

    /* Image stays contained within the figure */
    .hero-science-columns .hero-science-image img {
        box-sizing: border-box !important;

        display: block;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;

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

}






/* ==================================================
   INNOVOTEX - HERO ANIMATION OVERFLOW CONTAINMENT
================================================== */

@media (min-width: 960px) {

    .wp-block-group:has(> .hero-science-columns) {
        overflow-x: clip;
    }

}






/* ==================================================
   INNOVOTEX - HERO MOLECULE
   LARGE DESKTOP VERTICAL POSITION
   1440px and above ONLY
================================================== */

/* 1440px through 1919px */
@media (min-width: 1440px) and (max-width: 1919px) {

    .hero-science-columns .hero-science-image {
        top: -35px;
    }

}

/* 1920px through 2199px - preserve current alignment */
@media (min-width: 1920px) and (max-width: 2199px) {

    .hero-science-columns .hero-science-image {
        top: -30px;
    }

}

/* 2200px and above - additional upward adjustment */
@media (min-width: 2200px) {

    .hero-science-columns .hero-science-image {
        top: -40px;
    }

}








/* ==================================================
   INNOVOTEX - HERO MOLECULE
   EXTRA-LARGE DESKTOP REFINEMENT
   2200px and above ONLY
================================================== */

@media (min-width: 2200px) {

    .hero-science-columns .hero-science-image {
        width: min(100%, 420px) !important;
        max-width: 420px !important;
        top: -20px !important;
    }

}
























/* ==================================================
   Full Width Page Accent Line
================================================== */

/* Full-width page accent line */
.page-accent-line {
    width: 100vw;
    max-width: 100vw;
    height: 32px;
    margin-inline: calc(50% - 50vw);
    background: linear-gradient(
        90deg,
        #008EE5 0%,
        #72D9B2 100%
    );
}









/* ==================================================
   INNOVOTEX - SCIENCE SAMPLE PAGE TEST
   Responsive Illustration and Columns
================================================== */

/* MAIN COLUMNS */
.innov-science-test-columns {
    position: relative;
    overflow: visible;
    align-items: center;
}

/* IMAGE COLUMN */
.innov-science-test-columns > .wp-block-column:first-child {
    position: relative;
    min-width: 0;
}

/* ILLUSTRATION */
.innov-science-test-icon {
    position: relative;
    width: 150%;
    max-width: 850px !important;
    margin: 0;
    transform: translateX(-35%) scaleY(0.93);
    transform-origin: top center;
}

.innov-science-test-icon img {
    display: block;
    width: 100%;
    max-width: none !important;
    height: auto;
}

/* TABLET - KEEP TWO COLUMNS */
@media (min-width: 782px) and (max-width: 1199px) {

    .innov-science-test-icon {
        width: 130%;
        max-width: 650px !important;
        transform: translateX(-20%);
    }
}

/* STACKED TABLET AND MOBILE */
@media (max-width: 781px) {

    .innov-science-test-columns {
        flex-direction: column;
        align-items: stretch;
    }

    .innov-science-test-columns > .wp-block-column:first-child {
        width: 100%;
        flex-basis: auto !important;
    }

    .innov-science-test-icon {
        width: 65%;
        max-width: 450px !important;
        margin: 0 auto 20px;
        transform: none;
    }

    .innov-science-test-icon img {
        width: 100%;
        height: auto;
    }
}

/* SMALL MOBILE */
@media (max-width: 480px) {

    .innov-science-test-icon {
        width: 65%;
        max-width: 280px !important;
        margin-bottom: 15px;
    }
}











/* ==================================================
   INNOVOTEX - SCIENCE SAMPLE PAGE
   1024px Column Layout Correction
================================================== */

@media (min-width: 782px) and (max-width: 1100px) {

    .innov-science-test-columns {
        display: flex;
        flex-wrap: nowrap !important;
        flex-direction: row !important;
        align-items: flex-start;
    }

    .innov-science-test-columns > .wp-block-column:first-child {
        flex: 0 0 38% !important;
        min-width: 0;
    }

    .innov-science-test-columns > .wp-block-column:last-child {
        flex: 1 1 0 !important;
        min-width: 0;
    }

}




/* ==================================================
   INNOVOTEX - SCIENCE SAMPLE PAGE
   1024px Illustration Sizing and Position
================================================== */

@media (min-width: 782px) and (max-width: 1100px) {

    .innov-science-test-icon {
    width: 220%;
    max-width: none !important;
    transform: translateX(-55%) scaleY(1.25) !important;
    transform-origin: top center;
	}

}






/* ==================================================
   INNOVOTEX - SCIENCE SAMPLE PAGE
   1200px to 1439px Illustration Adjustment
================================================== */

@media (min-width: 1200px) and (max-width: 1439px) {

    .innov-science-test-icon {
        width: 185%;
        max-width: none !important;
        transform: translateX(-55%) scaleY(1.7);
        transform-origin: top center;
    }

}



















/* ==================================================
   INNOVOTEX - SCIENCE SECTION
   Consolidated Responsive Illustration
================================================== */

/* Main two-column layout */
.innov-science-columns {
    position: relative;
    display: flex;
    align-items: flex-start;
    overflow: visible;
}

/* Left illustration column */
.innov-science-columns > .wp-block-column:first-child {
    position: relative;
    flex: 0 0 40%;
    min-width: 0;
}

/* Right content column */
.innov-science-columns > .wp-block-column:last-child {
    flex: 1 1 60%;
    min-width: 0;
}

/* Oversized illustration */
.innov-science-icon {
    position: relative;
    width: 150%;
    max-width: 850px !important;
    margin-left: 0;
    transform: translateX(-35%);
}

/* Maintain image proportions */
.innov-science-icon img {
    display: block;
    width: 100%;
    max-width: 100% !important;
    height: auto;
}

/* ==================================================
   INTERMEDIATE DESKTOP / TABLET
================================================== */

@media (min-width: 782px) and (max-width: 1199px) {

    .innov-science-columns > .wp-block-column:first-child {
        flex: 0 0 32%;
    }

    .innov-science-columns > .wp-block-column:last-child {
        flex: 1 1 68%;
    }

    .innov-science-icon {
        width: 140%;
        transform: translateX(-30%);
    }

}

/* ==================================================
   MOBILE / STACKED LAYOUT
================================================== */

@media (max-width: 781px) {

    .innov-science-columns {
        flex-direction: column;
    }

    .innov-science-columns > .wp-block-column:first-child,
    .innov-science-columns > .wp-block-column:last-child {
        flex: 0 0 auto;
        width: 100%;
        min-width: 0;
    }

    .innov-science-icon {
        width: 115%;
        max-width: none !important;
        margin-left: 0;
        margin-bottom: -60px;
        transform: translateX(-35%);
    }

    .innov-science-icon img {
        width: 100%;
        max-width: 100% !important;
        height: auto;
    }

}












/* ==================================================
   INNOV - FUTURE HEADING
   Small Mobile Typography Adjustment
================================================== */

@media (max-width: 400px) {

    .innov-future-heading > p {
        font-size: clamp(34px, 9vw, 42px) !important;
    }

}

@media (max-width: 359px) {

    .innov-future-heading > p {
        font-size: 30px !important;
    }

    .innov-future-heading {
        overflow-wrap: normal;
        word-break: normal;
    }

}




/* ==================================================
   INNOV - LEGACY HEADING
   Extra Small Mobile Typography
================================================== */

@media (max-width: 359px) {

    .innov-legacy-heading > p {
        font-size: 30px !important;
    }

}





/* ==================================================
   INNOVOTEX - MACROCYCLE BANNER
   Consolidated responsive layout
================================================== */

/* MAIN BANNER */
.innov-slide.macrocycle-banner {
    position: relative;
    isolation: isolate;
    box-sizing: border-box;
    padding-bottom: 20px;
}

/* TWO-COLUMN STRUCTURE */
.innov-slide.macrocycle-banner > .wp-block-columns {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 2%;
    min-height: 350px;
    margin-bottom: 0;
}

/* LEFT HEADING COLUMN */
.innov-slide.macrocycle-banner
> .wp-block-columns > .wp-block-column:first-child {
    flex: 0 0 48%;
    min-width: 0;
    position: relative;
    z-index: 2;
}

/* RIGHT VISUAL COLUMN */
.innov-slide.macrocycle-banner
> .wp-block-columns > .wp-block-column:last-child {
    flex: 1 1 50%;
    min-width: 0;
}

/* HEADING */
.macrocycle-banner .wp-block-heading {
    position: relative;
    z-index: 2;
    margin-block: 0;
}

/* VISUAL CONTAINER */
.macrocycle-banner .macrocycle-visual {
    position: relative;
    width: 100%;
    min-height: 350px;
    display: block;
}

/* POSITION THE THREE LABEL ROWS */
.macrocycle-banner .macrocycle-visual
> .wp-block-group {
    position: absolute;
    margin: 0;
    max-width: none;
    z-index: 3;
}

/* PAYLOAD CAPSULE */
.macrocycle-banner .macrocycle-payload {
    top: 40%;
    left: 0;
    width: 28%;
    display: flex;
    justify-content: center;
}

/* ANTICANCER PAYLOAD */
.macrocycle-banner .macrocycle-anticancer {
    top: 58%;
    left: 0;
    width: 28% !important;
    text-align: center;
}

/* TUMOR DELIVERY VECTOR */
.macrocycle-banner .macrocycle-vector {
    top: 40%;
    right: 0;
    width: 24% !important;
    text-align: center;
}

/* LABEL TYPOGRAPHY */
.macrocycle-banner .macrocycle-visual p {
    margin: 0;
    overflow-wrap: normal;
    word-break: normal;
}

/* MOLECULE - REDUCED TO DESIGN PROPORTIONS */
.macrocycle-banner .macrocycle-molecule {
    position: absolute;
    width: 38%;
    max-width: 38%;
    height: auto;
    top: 50%;
    left: 52%;
    transform: translate(-50%, -50%);
    object-fit: contain;
    z-index: 2;
    margin: 0;
}



/* ==================================================
   MACROCYCLE - DESIGNER SVG PAYLOAD BRACKET
   Anchored directly to PAYLOAD row
================================================== */

.macrocycle-banner .macrocycle-payload {
    position: absolute;
    overflow: visible;
}

.macrocycle-banner .macrocycle-payload::after {
    content: "";
    position: absolute;

    top: 105%;
    left: 50%;

    width: 55%;
    aspect-ratio: 155 / 42;
    height: auto;

    background-image: url("https://innovotexstg.wpenginepowered.com/wp-content/uploads/2026/10/bracket.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;

    transform: translateX(-50%);
    pointer-events: none;
    z-index: 3;
}



/* Tablet only - bracket positioning */
@media (min-width: 768px) and (max-width: 1024px) {
    .macrocycle-banner .macrocycle-payload::after {
        width: 45%;
        top: 90%;
    }
}





/* ==================================================
   LARGE DESKTOP: 1600px+
================================================== */
@media (min-width: 1600px) {
    .macrocycle-banner .macrocycle-visual {
        min-height: 380px;
    }
}

/* ==================================================
   LAPTOP: 1025px - 1599px
================================================== */
@media (min-width: 1025px) and (max-width: 1599px) {
    .macrocycle-banner .macrocycle-visual {
        min-height: 330px;
    }

    .macrocycle-banner .macrocycle-visual p {
        font-size: clamp(14px, 1.5vw, 25px);
        line-height: 1.3;
    }

    .macrocycle-banner .macrocycle-molecule {
        width: 38%;
        max-width: 38%;
    }
}

/* ==================================================
   TABLET: 768px - 1024px
================================================== */
@media (min-width: 768px) and (max-width: 1024px) {
    .innov-slide.macrocycle-banner
    .wp-block-columns > .wp-block-column:first-child {
        flex-basis: 46%;
    }

    .innov-slide.macrocycle-banner
    .wp-block-columns > .wp-block-column:last-child {
        flex-basis: 52%;
    }

    .macrocycle-banner .macrocycle-visual {
        min-height: 280px;
    }

    .macrocycle-banner .macrocycle-visual p {
        font-size: clamp(11px, 1.5vw, 16px);
        line-height: 1.25;
    }

    .macrocycle-banner .macrocycle-molecule {
        width: 38%;
        max-width: 38%;
    }
}

/* ==================================================
   MOBILE: UP TO 767px
================================================== */
@media (max-width: 767px) {
    .innov-slide.macrocycle-banner
    .wp-block-columns {
        flex-direction: column;
        align-items: stretch;
        gap: 20px;
        min-height: 0;
    }

    .innov-slide.macrocycle-banner
    .wp-block-columns > .wp-block-column {
        flex: 0 0 auto;
        width: 100%;
    }

    .macrocycle-banner .macrocycle-visual {
        min-height: 270px;
    }

    .macrocycle-banner .macrocycle-payload {
        top: 35%;
        left: 0;
        width: 28%;
    }

    .macrocycle-banner .macrocycle-anticancer {
        top: 57%;
        left: 0;
        width: 28% !important;
    }

    .macrocycle-banner .macrocycle-vector {
        top: 37%;
        right: 2;
        width: 30% !important;
    }

    .macrocycle-banner .macrocycle-molecule {
        width: 38%;
        max-width: 38%;
        left: 52%;
        top: 50%;
    }

    .macrocycle-banner .macrocycle-visual p {
        font-size: clamp(11px, 2.8vw, 16px);
        line-height: 1.25;
    }
}

/* ==================================================
   SMALL MOBILE: UP TO 430px
================================================== */
@media (max-width: 430px) {
    .macrocycle-banner .macrocycle-visual {
        min-height: 220px;
    }

    .macrocycle-banner .macrocycle-visual p {
        font-size: 11px;
        line-height: 1.25;
    }

    

    .macrocycle-banner .macrocycle-molecule {
        width: 36%;
        max-width: 36%;
    }
}






/* ==================================================
   INNOVOTEX - MACROCYCLE BANNER
   Desktop design alignment refinements
================================================== */

@media (min-width: 1025px) {

    /* Slightly reduce molecule */
    .macrocycle-banner .macrocycle-molecule {
        width: 34%;
        max-width: 34%;
        left: 51%;
    }

    /* Bring left labels toward molecule */
    .macrocycle-banner .macrocycle-payload {
        left: 5%;
    }

    .macrocycle-banner .macrocycle-anticancer {
        left: 5%;
    }

    /* Bring right label closer */
    .macrocycle-banner .macrocycle-vector {
        right: 5%;
    }
}






/* ==================================================
   INNOVOTEX - MACROCYCLE BANNER
   Tablet and Mobile Spacing Refinements
   Does not affect 1024px or desktop
================================================== */

/* TABLET: 768px - 1023px */
@media (min-width: 768px) and (max-width: 1023px) {

    .macrocycle-banner .macrocycle-visual {
        min-height: 240px;
    }

}

/* MOBILE: UP TO 767px */
@media (max-width: 767px) {

    .innov-slide.macrocycle-banner .wp-block-columns {
        gap: 0;
    }

    .macrocycle-banner .macrocycle-visual {
        min-height: 230px;
    }

}

/* SMALL MOBILE: UP TO 430px */
@media (max-width: 430px) {

    .macrocycle-banner .macrocycle-visual {
        min-height: 210px;
    }

}




/* ==================================================
   INNOVOTEX - TABLET MOLECULE SIZE ADJUSTMENT
   768px - 1023px ONLY
================================================== */

@media (min-width: 768px) and (max-width: 1023px) {
    .macrocycle-banner .macrocycle-molecule {
        width: 32%;
        max-width: 32%;
    }
}






/* ==================================================
   INNOVOTEX - THREE SLIDE CAROUSEL
   Navigation and transitions only
================================================== */

/* Slider container */
.innov-slider {
    position: relative;
    overflow: hidden;
}

/* Hide inactive slides */
.innov-slider > .innov-slide {
    display: none;
}

/* Display active slide */
.innov-slider > .innov-slide.is-active {
    display: block;
    animation: innovSlideFade 0.5s ease-in-out;
}

/* Fade transition */
@keyframes innovSlideFade {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Navigation arrow */
.innov-slider .innov-next {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    z-index: 20;

    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: none;

    background: rgba(255, 255, 255, 0.45);
    color: #00307D;
	font-weight: 900;

    font-size: 30px;
    line-height: 1;
    cursor: pointer;

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

    transition: background 0.2s ease;
}

.innov-slider .innov-next:hover {
    background: #72D9B2;
}


/* ==================================================
   INNOVOTEX - MOBILE CAROUSEL ARROW
   Position controlled by JavaScript
   767px and below only
================================================== */

@media (max-width: 767px) {
    .innov-slider .innov-next {
        top: auto;
        bottom: auto;
        right: 10px;
        transform: none;
        width: 38px;
        height: 38px;
        font-size: 24px;
    }
}


/* Accessibility */
@media (prefers-reduced-motion: reduce) {
    .innov-slider > .innov-slide.is-active {
        animation: none;
    }
}




/* ==================================================
   INNOVOTEX - CAROUSEL ARROW
   1024px overlap correction
================================================== */

@media (min-width: 768px) and (max-width: 1024px) {
    .innov-slider .innov-next {
        top: 25%;
    }
}








/* ==================================================
   INNOVOTEX - NEW MACROCYCLE ARTWORK
   Responsive image replacement
================================================== */

/* RIGHT COLUMN - NEW ARTWORK */
.innov-slide.macrocycle-banner
> .wp-block-columns > .wp-block-column:last-child {
    min-width: 0;
}

/* ARTWORK IMAGE BLOCK */
.macrocycle-banner .innov-macrocycle-artwork {
    width: 100%;
    max-width: 100%;
    margin: 0;
    box-sizing: border-box;
}

/* ACTUAL IMAGE */
.macrocycle-banner .innov-macrocycle-artwork img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

/* MOBILE - STACKED COLUMNS */
@media (max-width: 767px) {

    .macrocycle-banner .innov-macrocycle-artwork {
        width: 100%;
        max-width: 100%;
        margin-inline: auto;
    }

}





/* ==================================================
   INNOVOTEX - CAROUSEL TOP SPACING
   Tablet and mobile only
================================================== */

@media (max-width: 1024px) {
    .innov-slider > .innov-slide.macrocycle-banner {
        padding-top: 30px;
    }
}























/* ==================================================
   INNOVOTEX - MULTI-MODAL PLATFORM
   Responsive Background, Spacers and Heading
================================================== */

.innovotex-platform-group {
    background-size: 100% auto !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
}

/* Reset WordPress spacer margins */
.innovotex-platform-group .platform-spacer-top,
.innovotex-platform-group .platform-spacer-image,
.innovotex-platform-group .platform-spacer-cards,
.innovotex-platform-group .platform-spacer-bottom {
    margin-block: 0 !important;
    min-height: 0 !important;
}

/* Heading: scale without overflowing */
.innovotex-platform-group h2.wp-block-heading {
    font-size: clamp(24px, 3.1vw, 54px) !important;
    line-height: 1.1 !important;
    text-align: center;
    max-width: 100%;
    overflow-wrap: normal;
    text-wrap: balance;
}

/* ==================================================
   DESKTOP - 1440px and above
================================================== */

@media (min-width: 1440px) {

    .innovotex-platform-group .platform-spacer-top {
        height: clamp(40px, 2.6vw, 67px) !important;
    }

    .innovotex-platform-group .platform-spacer-image {
        height: 27vw !important;
    }

    .innovotex-platform-group .platform-spacer-cards {
        height: clamp(35px, 4vw, 102px) !important;
    }

    .innovotex-platform-group .platform-spacer-bottom {
        height: 40px !important;
    }
}

/* ==================================================
   SMALL DESKTOP - 1024px to 1439px
================================================== */

@media (min-width: 1024px) and (max-width: 1439px) {

    .innovotex-platform-group .platform-spacer-top {
        height: 35px !important;
    }

    .innovotex-platform-group .platform-spacer-image {
        height: 27vw !important;
    }

    .innovotex-platform-group .platform-spacer-cards {
        height: 45px !important;
    }

    .innovotex-platform-group .platform-spacer-bottom {
        height: 30px !important;
    }
}

/* ==================================================
   TABLET - 768px to 1023px
================================================== */

@media (min-width: 768px) and (max-width: 1023px) {

    .innovotex-platform-group .platform-spacer-top {
        height: 25px !important;
    }

    .innovotex-platform-group .platform-spacer-image {
        height: 38vw !important;
    }

    .innovotex-platform-group .platform-spacer-cards {
        height: 35px !important;
    }

    .innovotex-platform-group .platform-spacer-bottom {
        height: 25px !important;
    }
}

/* ==================================================
   MOBILE - 767px and below
================================================== */

@media (max-width: 767px) {

    .innovotex-platform-group .platform-spacer-top {
        height: 15px !important;
    }

    .innovotex-platform-group .platform-spacer-image {
        height: 48vw !important;
    }

    .innovotex-platform-group .platform-spacer-cards {
        height: 25px !important;
    }

    .innovotex-platform-group .platform-spacer-bottom {
        height: 20px !important;
    }

    .innovotex-platform-group h2.wp-block-heading {
        font-size: clamp(20px, 5vw, 32px) !important;
        line-height: 1.15 !important;
        padding-inline: 12px;
        overflow-wrap: break-word;
    }
}

/* ==================================================
   WORDPRESS SPACER INNER ELEMENTS
================================================== */

.innovotex-platform-group .platform-spacer-top > div,
.innovotex-platform-group .platform-spacer-image > div,
.innovotex-platform-group .platform-spacer-cards > div,
.innovotex-platform-group .platform-spacer-bottom > div {
    height: 100% !important;
}





/* ==================================================
   INNOVOTEX - MOBILE HEADING POSITION TEST
   767px and below only
================================================== */

@media (max-width: 767px) {

    .innovotex-platform-group .platform-spacer-top {
        height: 0 !important;
    }

    .innovotex-platform-group h2.wp-block-heading {
        font-size: clamp(20px, 5vw, 28px) !important;
        line-height: 1.15 !important;
    }

}





/* ==================================================
   INNOVOTEX - MOBILE DISCLAIMER SPACING
   375px and below ONLY
================================================== */

@media (max-width: 375px) {

    .innovotex-platform-group .platform-spacer-image {
        height: 35vw !important;
    }

}







/* ==================================================
   INNOVOTEX - PLATFORM SEAMLESS TOP EXTENSION
   All Screen Sizes
================================================== */

.innovotex-platform-group {
    position: relative;
    margin-top: 20px !important;
}

.innovotex-platform-group::before {
    content: "";
    position: absolute;
    top: -20px;
    left: 0;
    right: 0;
    height: 20px;
    background-image: url("https://innovotexstg.wpenginepowered.com/wp-content/uploads/2026/10/innovotex-platform-top-strip.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    pointer-events: none;
}







/* ==================================================
   INNOVOTEX - PLATFORM CARDS
   Center Columns on Large Screens
================================================== */

@media (min-width: 1920px) {
    .innovotex-platform-group .innov-platform-cards {
        margin-left: auto !important;
        margin-right: auto !important;
    }
}






/* ==================================================
   INNOVOTEX - PLATFORM CARDS
   Center Cards on Large Screens
================================================== */

@media (min-width: 1920px) {

    .innovotex-platform-group .innov-platform-cards {
        justify-content: center !important;
    }

}







/* ==================================================
   INNOVOTEX - PLATFORM TEST PAGE
   Disclaimer Typography
   Responsive Visual Scaling
================================================== */

.innovotex-platform-group.innovotex-platform-test
.innovotex-platform-disclaimer {
    font-size: clamp(9px, 1.1vw, 14px) !important;
    line-height: 1.3 !important;
    text-align: center;
}



/* ==================================================
   INNOVOTEX - PLATFORM TEST PAGE
   Responsive Disclaimer Position
   Desktop: 1024px and above
================================================== */

@media (min-width: 1024px) {

    .innovotex-platform-group.innovotex-platform-test
    .platform-spacer-image {
        height: calc(27vw + clamp(75px, 5vw + 3px, 135px)) !important;
    }

}





/* ==================================================
   INNOVOTEX - PLATFORM HEADING
   Small Mobile Adjustment - 359px and below
================================================== */

@media (max-width: 359px) {

    .innovotex-platform-group h2.wp-block-heading {
        font-size: 18px !important;
        line-height: 1.15 !important;
        padding-inline: 8px !important;
    }

}





/* ==================================================
   INNOVOTEX - DESKTOP PLATFORM HEADING SPACING
   1024px and above ONLY - SAMPLE PAGE
================================================== */

@media (min-width: 1024px) {

    .innovotex-platform-group.innovotex-platform-test
    .platform-spacer-top {
        height: 0 !important;
    }

    .innovotex-platform-group.innovotex-platform-test
    h2.wp-block-heading {
        position: relative;
        top: clamp(70px, 5vw, 110px);
    }

}






/* ==================================================
   INNOVOTEX - SAMPLE PAGE ONLY
   Disable Old 20px Background Extension
   DESKTOP ONLY - 1024px and above
================================================== */

@media (min-width: 1024px) {

    .innovotex-platform-group.innovotex-platform-test {
        margin-top: 0 !important;
    }

    .innovotex-platform-group.innovotex-platform-test::before {
        content: none !important;
    }

}





/* ==================================================
   INNOVOTEX - PLATFORM DISCLAIMER
   Large Desktop Fine-Tuning - Test Page Only
================================================== */

@media (min-width: 1920px) {

    .innovotex-platform-group.innovotex-platform-test
    .platform-spacer-image {
        height: calc(27vw + 155px) !important;
    }

}





/* ==================================================
   INNOVOTEX - PLATFORM DISCLAIMER SPACING
   425px to 767px ONLY
================================================== */

@media (min-width: 425px) and (max-width: 767px) {

    .innovotex-platform-group .platform-spacer-image {
        height: 38vw !important;
    }

}





/* ==================================================
   INNOVOTEX - PLATFORM HEADING
   Mobile Horizontal Centering Only
   767px and below
================================================== */

@media (max-width: 767px) {

    .innovotex-platform-group h2.wp-block-heading {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
    }

}








/* ==================================================
   INNOVOTEX - MULTI-MODAL PLATFORM V2 - THIRD BUILD
   SEPARATE PIECES THIS TIME
================================================== */



/* ==================================================
   INNOVOTEX - MULTI-MODAL PLATFORM V2
   Responsive Molecular Illustration
   Test Page Only
================================================== */

.innovotex-platform-group.innovotex-platform-test.innov-platform-v2
figure.innov-platform-v2-illustration {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center;
}

.innovotex-platform-group.innovotex-platform-test.innov-platform-v2
figure.innov-platform-v2-illustration img {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain;
    margin: 0 auto !important;
}






/* ==================================================
   INNOVOTEX - PLATFORM V2
   Reset Legacy Heading Offset
   Test Page Only
================================================== */

@media (min-width: 1024px) {

    .innovotex-platform-group.innovotex-platform-test.innov-platform-v2
    h2.wp-block-heading {
        position: static !important;
        top: auto !important;
        transform: none !important;
    }

}



/* ==================================================
   INNOVOTEX - PLATFORM V2
   Desktop Heading Spacing
   Test Page Only
================================================== */

@media (min-width: 1024px) {

    .innovotex-platform-group.innovotex-platform-test.innov-platform-v2
    .platform-spacer-top {
        height: 0 !important;
    }

    .innovotex-platform-group.innovotex-platform-test.innov-platform-v2
    h2.wp-block-heading {
        position: static !important;
        top: auto !important;
        transform: none !important;       
    }

}



/* ==================================================
   INNOVOTEX - PLATFORM V2
   Mobile Heading Top Spacing Only
   Test Page Only - 767px and below
================================================== */

@media (max-width: 767px) {
    .innovotex-platform-group.innovotex-platform-test.innov-platform-v2
    h2.wp-block-heading {
        padding-top: 5px !important;
    }
}



























/* ==================================================
   Section Heading Pill
================================================== */

.section-pill {
    width: fit-content !important;
    min-height: 39px;
    margin-inline: auto !important;
    padding: 0 20px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.section-pill p {
    margin: 0;
}








/* ==================================================
   Problem / Solution Hover Cards
================================================== */

/* Individual card */
.hover-info-card {
    position: relative;
    flex: 0 1 calc(50% - 16px);
    min-width: 0;
    height: 329px;
    overflow: hidden;
}

/* Front and back occupy the exact same card space */
.hover-info-card-front,
.hover-info-card-back {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    transition: opacity 0.25s ease, visibility 0.25s ease;
}

/* Front visible by default */
.hover-info-card-front {
    opacity: 1;
    visibility: visible;
}

/* Back hidden by default */
.hover-info-card-back {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    display: flex;
    flex-direction: column;
    justify-content: center;
	
	padding-left: 64px;
	padding-right: 64px;
}

/* Swap on hover */
.hover-info-card:hover .hover-info-card-front {
    opacity: 0;
    visibility: hidden;
}

.hover-info-card:hover .hover-info-card-back {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* Stack cards on smaller screens */
@media (max-width: 781px) {

    .hover-info-card {
        flex: 1 1 100%;
        width: 100%;
    }
}


/* Keep Problem / Solution cards together and centered */
.hover-info-card-row {
    width: 100%;
    max-width: 1480px;
    margin-left: auto !important;
    margin-right: auto !important;
    gap: 32px !important;
    justify-content: center !important;
}







/* ==================================================
   Problem / Solution Cards
   Front Face - Tablet / Mobile Side Padding
================================================== */

@media (max-width: 781px) {

    .hover-info-card-front {
        padding-left: clamp(24px, 6vw, 48px);
        padding-right: clamp(24px, 6vw, 48px);
    }

}















/* ==================================================
   PIPELINE — BASE DESKTOP LAYOUT
================================================== */

.pipeline {
    width: 100%;
}

/* Header and pipeline rows use the same column structure */
.pipeline-header,
.pipeline-row {
    display: grid;
    grid-template-columns: 17% 28% 40% 15%;
    width: 100%;
}

/* Header */
.pipeline-header {
    align-items: end;
    border-bottom: 4px solid #008EE6;
}


/* Data rows */
.pipeline-row {
    align-items: stretch;
    border-bottom: 1px solid #72D9B2;
}

/* Standard cells */
.pipeline-payload,
.pipeline-indication,
.pipeline-rights {
    padding: 30px 24px;
    min-width: 0;
}

/* Rights column */
.pipeline-rights {
    display: flex;
    align-items: center;
}

/* Area containing the arrows */
.pipeline-stages {
    position: relative;
    padding: 24px 18px;
    min-width: 0;
}





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

.pipeline-header {
    display: grid !important;
    grid-template-columns: 17% 28% 13.333% 13.333% 13.334% 15% !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    align-items: end;
    border-bottom: 4px solid #008EE6;
}

.pipeline-header > p {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 24px 18px;
    box-sizing: border-box;
}




/* ==================================================
   PIPELINE — STAGE DIVIDERS
================================================== */

.pipeline-stages {
    position: relative;
    padding: 24px 18px;
    min-width: 0;

    background-image:
        linear-gradient(
            to right,
            transparent calc(33.333% - 1px),
            #72D9B2 calc(33.333% - 1px),
            #72D9B2 33.333%,
            transparent 33.333%,
            transparent calc(66.666% - 1px),
            #72D9B2 calc(66.666% - 1px),
            #72D9B2 66.666%,
            transparent 66.666%
        );
}




/* ==================================================
   PIPELINE — PROGRAM ARROWS
================================================== */

.pipeline-arrow {
    position: relative;
    display: flex;
    align-items: center;

    
    height: 70px;
    box-sizing: border-box;

    padding: 0 42px 0 20px;
    margin: 0;

    background: linear-gradient(
        90deg,
        #008EE6 0%,
        #008EE6 35%,
        #72D9B2 100%
    );

    /* Creates the pointed arrow end */
    clip-path: polygon(
        0 0,
        calc(100% - 32px) 0,
        100% 50%,
        calc(100% - 32px) 100%,
        0 100%
    );

    overflow: hidden;
}

/* Arrow label */
.pipeline-arrow > p {
    position: relative;
    z-index: 1;

    margin: 0 !important;
    width: auto !important;
    max-width: none !important;

    color: #ffffff;
    font-weight: 700;
    white-space: nowrap;
}




/* ==================================================
   PIPELINE — ARROW ENDPOINTS
================================================== */

/* Discovery */
.stage-discovery-25 {
    width: 8.333%;
}

.stage-discovery-50 {
    width: 16.666%;
}

.stage-discovery-75 {
    width: 25%;
}

.stage-discovery-100 {
    width: 33.333%;
}

/* POC */
.stage-poc-25 {
    width: 41.666%;
}

.stage-poc-50 {
    width: 50%;
}

.stage-poc-75 {
    width: 58.333%;
}

.stage-poc-100 {
    width: 66.666%;
}

/* Pre-clinical */
.stage-preclinical-25 {
    width: 75%;
}

.stage-preclinical-50 {
    width: 83.333%;
}

.stage-preclinical-75 {
    width: 91.666%;
}

.stage-preclinical-100 {
    width: 100%;
}





/* ==================================================
   PIPELINE - NOVO-111 ENDPOINT ONLY
================================================== */

@media (min-width: 768px) {
    .pipeline-arrow.pipeline-novo-111 {
        width: calc(88% + 6px);
    }
}


/* ==================================================
   PIPELINE - NOVO-111 MOBILE ENDPOINT
================================================== */

@media (max-width: 767px) {
    .pipeline-arrow.pipeline-novo-111 {
        width: 92%;
    }
}





/* ==================================================
   PIPELINE - COMBINATION WITH SOC ENDPOINT ONLY
================================================== */

@media (min-width: 768px) {
    .pipeline-arrow.pipeline-combination-soc {
        width: calc(58.333% + 6px);
    }
}


/* ==================================================
   PIPELINE - COMBINATION WITH SOC MOBILE ENDPOINT
================================================== */


@media (max-width: 767px) {
    .pipeline-arrow.pipeline-combination-soc {
        width: 75%;
    }
}



/* ==================================================
   PIPELINE - NOVO-114 ENDPOINT ONLY
   Desktop / Tablet
================================================== */

@media (min-width: 768px) {
    .pipeline-arrow.pipeline-novo-114 {
        width: calc(31% - 6px);
    }
}


/* ==================================================
   PIPELINE - NOVO-114 ENDPOINT ONLY
   MOBILE ENDPOINT
================================================== */


/* Mobile */
@media (max-width: 767px) {
    .pipeline-arrow.pipeline-novo-114 {
        width: 40%;
    }
}






/* ==================================================
   PIPELINE — RESPONSIVE WHOLE-UNIT SCALING
   Keep the complete pipeline visible at all widths
================================================== */

/* Large desktop */
.pipeline {
    width: 100%;
    zoom: 1;
}

/* Narrow desktop */
@media (max-width: 1600px) and (min-width: 1401px) {
    .pipeline {
        width: 114.286%;
        zoom: 0.875;
    }
}

/* Smaller desktop */
@media (max-width: 1400px) and (min-width: 1201px) {
    .pipeline {
        width: 133.333%;
        zoom: 0.75;
    }
}

/* Laptop */
@media (max-width: 1200px) and (min-width: 1025px) {
    .pipeline {
        width: 156.25%;
        zoom: 0.64;
    }
}

/* 1024 / large tablet */
@media (max-width: 1024px) and (min-width: 901px) {
    .pipeline {
        width: 178.572%;
        zoom: 0.56;
    }
}

/* Tablet */
@media (max-width: 900px) and (min-width: 769px) {
    .pipeline {
        width: 208.333%;
        zoom: 0.48;
    }
}

/* Smaller tablet */
@media (max-width: 768px) and (min-width: 641px) {
    .pipeline {
        width: 250%;
        zoom: 0.40;
    }
}

/* Large mobile */
@media (max-width: 640px) and (min-width: 513px) {
    .pipeline {
        width: 312.5%;
        zoom: 0.32;
    }
}

/* Standard mobile */
@media (max-width: 512px) and (min-width: 401px) {
    .pipeline {
        width: 400%;
        zoom: 0.25;
    }
}

/* Small mobile */
@media (max-width: 400px) {
    .pipeline {
        width: 500%;
        zoom: 0.20;
    }
}







/* ==================================================
   PIPELINE — DESKTOP BASELINE
================================================== */

.pipeline-row {
    grid-template-columns: 16% 31% 38% 15%;
}

.pipeline-header {
    grid-template-columns:
        16%
        31%
        12.666%
        12.666%
        12.668%
        15% !important;
}

.pipeline-header > p {
    font-size: 0.72em;
    padding-left: 8px;
    padding-right: 8px;
    white-space: nowrap;
}

.pipeline-payload,
.pipeline-indication,
.pipeline-rights {
    padding-left: 8px;
    padding-right: 8px;
}

.pipeline-payload p,
.pipeline-indication p,
.pipeline-rights p {
    font-size: 0.72em;
}

.pipeline-indication {
    padding-left: 14px;
}

.pipeline-arrow {
    height: 52px;
    padding-left: 12px;
    padding-right: 26px;
}

.pipeline-arrow > p {
    font-size: 17px;
    white-space: nowrap;
}

.stage-poc-25 > p {
    font-size: 15px;
}

.stage-discovery-75 > p {
    font-size: 13px;
}

.pipeline-arrow-long > p {
    font-size: 14px;
}







/* ==================================================
   PIPELINE — HEADER SPACING ONLY
   Does not alter body columns or arrow positions
================================================== */

/* Center the stage headings within their existing columns */
.pipeline-header > p:nth-child(3),
.pipeline-header > p:nth-child(4),
.pipeline-header > p:nth-child(5),
.pipeline-header > p:nth-child(6) {
    text-align: center;
}

/* Add a little visual separation between Discovery and POC */
.pipeline-header > p:nth-child(3) {
    padding-right: 14px;
}

.pipeline-header > p:nth-child(4) {
    padding-left: 14px;
}

/* Add separation between Pre-Clinical and Rights */
.pipeline-header > p:nth-child(5) {
    padding-right: 14px;
}

.pipeline-header > p:nth-child(6) {
    padding-left: 14px;
}





/* ==================================================
   PIPELINE — MOBILE STACKED LAYOUT
   767px and below
================================================== */

@media (max-width: 767px) {

    /* Stop the old whole-unit shrinking on mobile */
    .pipeline {
        width: 100% !important;
        zoom: 1 !important;
    }

    /* Hide the desktop six-column header on mobile */
    .pipeline-header {
        display: none !important;
    }

    /* Each pipeline row becomes a stacked mobile card */
    .pipeline-row {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px;
        width: 100%;
        padding: 20px 0;
        border-bottom: 1px solid #72D9B2;
    }

    /* Reset desktop cell sizing */
    .pipeline-payload,
    .pipeline-indication,
    .pipeline-stages,
    .pipeline-rights {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        box-sizing: border-box;
    }

    /* Payload */
    .pipeline-payload {
        padding: 0 !important;
    }

    .pipeline-payload::before {
        content: "MDC Payload";
        display: block;
        margin-bottom: 4px;
        font-size: 13px;
        line-height: 1.2;
        font-weight: 700;
        color: #00307D;
    }

    .pipeline-payload p {
        margin-top: 0;
        margin-bottom: 0;
        font-size: 18px;
        line-height: 1.3;
    }

    /* Proposed Indication */
    .pipeline-indication {
        padding: 0 !important;
    }

    .pipeline-indication::before {
        content: "Proposed Indication";
        display: block;
        margin-bottom: 4px;
        font-size: 13px;
        line-height: 1.2;
        font-weight: 700;
        color: #00307D;
    }

    .pipeline-indication p {
        margin-top: 0;
        margin-bottom: 0;
        font-size: 16px;
        line-height: 1.35;
    }

    /* Stage area */
    .pipeline-stages {
        position: relative;
        padding: 36px 0 14px !important;
        min-height: 90px;

        background-image:
            linear-gradient(
                to right,
                transparent calc(33.333% - 1px),
                #72D9B2 calc(33.333% - 1px),
                #72D9B2 33.333%,
                transparent 33.333%,
                transparent calc(66.666% - 1px),
                #72D9B2 calc(66.666% - 1px),
                #72D9B2 66.666%,
                transparent 66.666%
            );
    }

    /* Mobile stage labels — precisely centered over each third */
.pipeline-stages::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 22px;
    pointer-events: none;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='22' viewBox='0 0 900 22'%3E%3Ctext x='150' y='15' text-anchor='middle' font-family='Arial,sans-serif' font-size='11' font-weight='700' fill='%2300307D'%3EDiscovery%3C/text%3E%3Ctext x='450' y='15' text-anchor='middle' font-family='Arial,sans-serif' font-size='11' font-weight='700' fill='%2300307D'%3EPOC%3C/text%3E%3Ctext x='750' y='15' text-anchor='middle' font-family='Arial,sans-serif' font-size='11' font-weight='700' fill='%2300307D'%3EIND-enabling%3C/text%3E%3C/svg%3E");

    background-repeat: no-repeat;
    background-size: 100% 22px;
    background-position: center top;
}

    /* Arrows stay as the same elements and can still animate later */
    .pipeline-arrow {
        height: 42px;
        padding-left: 10px;
        padding-right: 22px;
    }

    .pipeline-arrow > p {
        font-size: 13px;
        white-space: nowrap;
    }

    .pipeline-arrow-long > p {
        font-size: 10px;
    }

    .stage-poc-25 > p {
        font-size: 11px;
    }

    .stage-discovery-75 > p {
        font-size: 10px;
    }

    /* Rights */
    .pipeline-rights {
        display: block !important;
        padding: 0 !important;
    }

    .pipeline-rights::before {
        content: "Rights: ";
        font-size: 13px;
        line-height: 1.2;
        font-weight: 700;
        color: #00307D;
    }

    .pipeline-rights p {
        display: inline;
        margin: 0;
        font-size: 16px;
        line-height: 1.3;
    }
	
	.pipeline-stages::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 22px;
    pointer-events: none;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='22' viewBox='0 0 900 22'%3E%3Ctext x='150' y='17' text-anchor='middle' font-family='Inter,Arial,sans-serif' font-size='27' font-weight='700' fill='%2300307E'%3EDiscovery%3C/text%3E%3Ctext x='450' y='17' text-anchor='middle' font-family='Inter,Arial,sans-serif' font-size='27' font-weight='700' fill='%2300307E'%3EPOC%3C/text%3E%3Ctext x='750' y='17' text-anchor='middle' font-family='Inter,Arial,sans-serif' font-size='27' font-weight='700' fill='%2300307E'%3EIND-enabling%3C/text%3E%3C/svg%3E");

    background-repeat: no-repeat;
    background-size: 100% 22px;
    background-position: center top;
	}		
}





/* ==================================================
   PIPELINE — ARROW ANIMATION
================================================== */

.pipeline-arrow {
    transform-origin: left center;
    transform: scaleX(0);
    opacity: 0;
}

/* Runs when JS marks the arrow as visible */
.pipeline-arrow.pipeline-arrow-visible {
    animation: pipeline-arrow-grow 900ms ease-out forwards;
}

@keyframes pipeline-arrow-grow {
    0% {
        transform: scaleX(0);
        opacity: 0;
    }

    20% {
        opacity: 1;
    }

    100% {
        transform: scaleX(1);
        opacity: 1;
    }
}

/* Respect reduced-motion accessibility settings */
@media (prefers-reduced-motion: reduce) {

    .pipeline-arrow,
    .pipeline-arrow.pipeline-arrow-visible {
        animation: none !important;
        transform: scaleX(1) !important;
        opacity: 1 !important;
    }
}




/* ==================================================
   PIPELINE — EXACT COLUMN ALIGNMENT
   Desktop / tablet only

   Uses the SAME six-column grid for the header
   and every pipeline row.
================================================== */

@media (min-width: 768px) {

    /* ------------------------------------------------
       HEADER
       Six actual chart columns
    ------------------------------------------------ */

    .pipeline-header {
        grid-template-columns:
            16%
            31%
            12.666%
            12.666%
            12.668%
            15% !important;
    }

    /* Center every heading over its actual chart section */
    .pipeline-header > p {
        text-align: center !important;
        box-sizing: border-box;
    }


    /* ------------------------------------------------
       ROW GRID
       Use those exact same six columns
    ------------------------------------------------ */

    .pipeline-row {
        display: grid !important;

        grid-template-columns:
            16%
            31%
            12.666%
            12.666%
            12.668%
            15% !important;
    }


    /* ------------------------------------------------
       PLACE EACH EXISTING CMS GROUP
    ------------------------------------------------ */

    /* MDC Payload */
    .pipeline-payload {
        grid-column: 1;
    }

    /* Proposed Indication */
    .pipeline-indication {
        grid-column: 2;
    }

    /* Discovery + POC + Pre-Clinical */
    .pipeline-stages {
        grid-column: 3 / 6;
    }

    /* Rights */
    .pipeline-rights {
        grid-column: 6;
    }


    /* ------------------------------------------------
       FORCE GRID CELLS TO STAY INSIDE THEIR TRACKS
    ------------------------------------------------ */

    .pipeline-payload,
    .pipeline-indication,
    .pipeline-stages,
    .pipeline-rights {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box;
    }


    /* ------------------------------------------------
       VERTICAL COLUMN DIVIDERS
    ------------------------------------------------ */

    /* MDC Payload | Proposed Indication */
    .pipeline-payload {
        border-right: 1px solid #72D9B2;
    }

    /* Proposed Indication | Discovery */
    .pipeline-indication {
        border-right: 1px solid #72D9B2;
    }

    /* Pre-Clinical | Rights */
    .pipeline-stages {
        border-right: 1px solid #72D9B2;
    }


	
	
/* ==================================================
   PIPELINE — TABLET STAGE DIVIDER VISIBILITY
================================================== */

@media (min-width: 768px) and (max-width: 900px) {
    .pipeline-stages {
        background-image:
            linear-gradient(
                to right,
                transparent calc(33.333% - 2px),
                #72D9B2 calc(33.333% - 2px),
                #72D9B2 33.333%,
                transparent 33.333%,
                transparent calc(66.666% - 2px),
                #72D9B2 calc(66.666% - 2px),
                #72D9B2 66.666%,
                transparent 66.666%
            );
    }
}	
	
	
	
	
	
	
	
	
	
	
    /* ------------------------------------------------
       TEXT CONTAINMENT
    ------------------------------------------------ */

    .pipeline-payload > p,
    .pipeline-indication > p,
    .pipeline-rights > p {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box;
    }


    /* ------------------------------------------------
       STAGE AREA
       Small inset after Proposed Indication divider.
       Existing internal stage dividers remain intact.
    ------------------------------------------------ */

    .pipeline-stages {
        padding-left: 18px;
        padding-right: 18px;
    }
}





/* ==================================================
   PIPELINE — DISCOVERY START INSET
   Desktop / tablet only
================================================== */

@media (min-width: 768px) {

    .pipeline-arrow {
        position: relative;
        left: 6px;
        margin-left: 0 !important;
    }

    .stage-discovery-25 { width: calc(8.333% - 6px); }
    .stage-discovery-50 { width: calc(16.666% - 6px); }
    .stage-discovery-75 { width: calc(25% - 6px); }
    .stage-discovery-100 { width: calc(33.333% - 6px); }

    .stage-poc-25 { width: calc(41.666% - 6px); }
    .stage-poc-50 { width: calc(50% - 6px); }
    .stage-poc-75 { width: calc(58.333% - 6px); }
    .stage-poc-100 { width: calc(66.666% - 6px); }

    .stage-preclinical-25 { width: calc(75% - 6px); }
    .stage-preclinical-50 { width: calc(83.333% - 6px); }
    .stage-preclinical-75 { width: calc(91.666% - 6px); }
    .stage-preclinical-100 { width: calc(100% - 6px); }
}



/* ==================================================
   PIPELINE — TOP ARROW SPACING
   Adds 10px between stacked arrows only
================================================== */

.pipeline-stages .pipeline-arrow + .pipeline-arrow {
    margin-top: 10px;
}








/* ==================================================
   PIPELINE — TYPOGRAPHY STYLING ONLY
   No font-size / layout / responsive changes
================================================== */

/* Top column labels */
.pipeline-header > p {
    font-family: "Inter", sans-serif;
    font-weight: 700;
    color: #00307E;
}

/* MDC Payload text */
.pipeline-payload p {
    font-family: "Inter", sans-serif;
    font-weight: 600;
    color: #00307E;
}

/* Proposed Indication text */
.pipeline-indication p {
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-style: italic;
    letter-spacing: 0.22px;
    color: #769AB1;
}

/* Rights text */
.pipeline-rights p {
    font-family: "Inter", sans-serif;
    font-weight: 400;
    color: #769AB1;
}





/* ==================================================
   PIPELINE — DESKTOP/TABLET TEXT SIZE
   Non-arrow chart text only
   Does NOT affect arrows, animation or mobile layout
================================================== */

@media (min-width: 768px) {

    /* Column headings */
    .pipeline-header > p {
        font-size: 20px;
    }

    /* Payload, indication and rights column text */
    .pipeline-payload p,
    .pipeline-indication p,
    .pipeline-rights p {
        font-size: 20px;
    }

}





/* Center Rights column values */
@media (min-width: 768px) {

    .pipeline-rights {
        justify-content: center;
        text-align: center;
    }

    .pipeline-rights > p {
        text-align: center;
    }

}




/* ==================================================
   PIPELINE — SAFARI iPAD TABLET TEXT CORRECTION
   Fix Safari text scaling inside zoomed pipeline only
   Does NOT alter grid, arrows, animation or mobile
================================================== */

@supports (-webkit-touch-callout: none) {
    @media (min-width: 768px) and (max-width: 900px) {

        /* Safari does not scale this fixed text consistently
           with the pipeline's 0.48 whole-unit zoom */
        .pipeline-header > p,
        .pipeline-payload p,
        .pipeline-indication p,
        .pipeline-rights p {
            font-size: 10px;
        }
    }
}






/* ==================================================
   INNOVOTEX - PIPELINE HEADING
   SMALL MOBILE CENTERING ONLY
   Does not affect pipeline arrows or chart
================================================== */

@media (max-width: 400px) {

    .innov-pipeline-heading {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .innov-pipeline-heading > p {
        width: 100%;
        max-width: 100%;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
        box-sizing: border-box;
        white-space: normal;
        overflow-wrap: normal;
    }

}

















/* ==================================================
   INNOVOTEX - PIPELINE EXPANSION PILL GREEN OUTLINE
   Match Pipeline Width
================================================== */
.innov-pipeline-expansion-pill {
    width: 80% !important;
    max-width: 1000px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box;
}

/* Mobile - preserve existing appearance */
@media (max-width: 767px) {

    .innov-pipeline-expansion-pill {
        width: 100% !important;
        max-width: 100% !important;
    }

}






















/* ==================================================
   OUR MISSION - VERTICAL DIVIDER (DESKTOP)
================================================== */

.mission-divider-column {
    position: relative;
}

.mission-divider-column::before {
    content: "";
    position: absolute;
    left: -35px;
    top: 0;
    bottom: 0;
    width: 1px;
    background-color: #769AB1;
    transform: translateX(-50%);
    pointer-events: none;
}


/* ==================================================
   OUR MISSION - MOBILE & TABLET
   Only affects screens below 782px
================================================== */

@media (max-width: 781px) {

    /* Stack the two mission columns */
    .wp-block-columns:has(> .mission-divider-column) {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 32px !important;
    }

    /* Give both columns full available width */
    .wp-block-columns:has(> .mission-divider-column)
    > .wp-block-column {
        width: 100% !important;
        max-width: 100% !important;
        flex-basis: auto !important;
        box-sizing: border-box !important;
        text-align: center !important;
    }

    /* Remove vertical divider on mobile/tablet */
    .mission-divider-column::before {
        display: none !important;
    }

    /* Remove desktop divider padding */
    .wp-block-column.mission-divider-column {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Center inner groups */
    .wp-block-columns:has(> .mission-divider-column)
    > .wp-block-column .wp-block-group {
        width: 100% !important;
        max-width: 100% !important;
        text-align: center !important;
    }

    /* Override individual paragraph alignment */
    .wp-block-columns:has(> .mission-divider-column)
    > .wp-block-column p {
        text-align: center !important;
    }

}





/* ==================================================
   OUR MISSION - INNER FLEX ALIGNMENT FIX
   Mobile and tablet only
================================================== */

@media (max-width: 781px) {

    .wp-block-columns:has(> .mission-divider-column)
    > .wp-block-column .is-layout-flex {
        justify-content: center !important;
        align-items: center !important;
    }

}








/* ==================================================
   OUR MISSION - MOBILE TEXT CENTERING
   Mobile only - preserve desktop/tablet and animations
================================================== */

@media (max-width: 767px) {

    /* Center mission paragraph blocks and their text */
    .wp-block-columns:has(> .mission-divider-column)
    > .wp-block-column p.innov-slide-left,
    .wp-block-columns:has(> .mission-divider-column)
    > .wp-block-column p.innov-slide-right {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

}








/* ==================================================
   OUR MISSION - MOBILE TEXT ALIGNMENT OVERRIDE
   Preserves left/right slide-in animations
================================================== */

@media (max-width: 781px) {

    /* Override desktop right-aligned text */
    .wp-block-columns:has(> .mission-divider-column)
    p.has-text-align-right {
        text-align: center !important;
    }

    /* Override desktop left-aligned text */
    .wp-block-columns:has(> .mission-divider-column)
    p.has-text-align-left {
        text-align: center !important;
    }

}






/* ==================================================
   INNOVOTEX - MISSION MOBILE TEXT CENTERING
   Mission Section Only
   Preserve Desktop Layout and Slide Animations
================================================== */

@media (max-width: 781px) {

    /* Center content inside both Mission stacks */
    .innov-mission-columns
    > .wp-block-column
    > .wp-block-group.is-vertical {
        align-items: center !important;
    }

    /* Center every paragraph within the Mission stacks */
    .innov-mission-columns
    > .wp-block-column
    > .wp-block-group.is-vertical
    > p.wp-block-paragraph {
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
        width: 100%;
        box-sizing: border-box;
    }
}







/* ==================================================
   INNOVOTEX - MISSION COLUMN CENTER ALIGNMENT
   Mobile and Tablet Only
================================================== */

@media (max-width: 781px) {

    /* Center the Mission Columns container */
    .innov-mission-columns {
        width: 100%;
        max-width: 100%;
        margin-inline: auto !important;
    }

    /* Give both columns the same center axis */
    .innov-mission-columns > .wp-block-column {
        width: 100%;
        min-width: 0;
        flex-basis: 100% !important;
        margin-inline: auto !important;
    }

    /* Center each Stack within its column */
    .innov-mission-columns > .wp-block-column > .wp-block-group {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        align-items: center !important;
    }

    /* Center all paragraph text */
    .innov-mission-columns .wp-block-column p {
        text-align: center !important;
    }
}






/* ==================================================
   INNOVOTEX - WE RECOGNIZE MOBILE CENTERING
   First Mission Column Only
   Preserve animations and other layouts
================================================== */

@media (max-width: 767px) {

    .innov-mission-columns
    > .wp-block-column:first-child
    > .wp-block-group.is-vertical {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
    }

}








/* ==================================================
   OUR MISSION - WE RECOGNIZE STACK CENTERING
   Mobile and tablet only
   Preserve animations and desktop layout
================================================== */

@media (max-width: 781px) {

    .innov-mission-columns
    > .wp-block-column:first-child
    > .wp-block-group.is-vertical {
        justify-content: flex-start !important;
        align-items: center !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

}



















/* ==================================================
   TEAM SECTION
   Custom image size control
================================================== */

img.eb-team-member-avatar {
    width: 397px !important;
    height: 529px !important;
}






/* ==================================================
   TEAM SECTION
   Align LinkedIn icons across team member cards
================================================== */

/* Make each team member a vertical flex container */
.eb-team-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Give the text and social area a consistent height */
.eb-team-member-contents {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 175px;
}

/* Push LinkedIn icons to the bottom */
.eb-team-member-contents > ul.socials {
    margin-top: auto !important;
    padding-top: 12px;
}





/* ==================================================
   TEAM SECTION
   Laptop / Small Desktop LinkedIn Alignment
================================================== */

@media (min-width: 1024px) and (max-width: 1199px) {

    .eb-team-member-contents {
        min-height: 210px;
    }

}














/* ==================================================
   INNOV - LATEST NEWS CATEGORY HEADERS
   Essential Blocks Pro Post Grid
================================================== */

/* Full-width category header */
.eb-parent-eb-post-grid-549r8 .ebpg-header-meta {
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
}

.eb-parent-eb-post-grid-549r8 .ebpg-header-meta .ebpg-entry-meta-items,
.eb-parent-eb-post-grid-549r8 .ebpg-header-meta .ebpg-categories-meta {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
}

/* Category header text */
.eb-parent-eb-post-grid-549r8 .ebpg-categories-meta a {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 18px 12px;
    border-radius: 0 !important;
    color: #ffffff !important;
    text-align: center;
    font-weight: 700;
    text-decoration: none;
}

/* Company News */
.eb-parent-eb-post-grid-549r8
.ebpg-categories-meta a[href*="/category/company-news/"] {
    background-color: #008EE6 !important;
}

/* Regulatory Update */
.eb-parent-eb-post-grid-549r8
.ebpg-categories-meta a[href*="/category/regulatory-update/"] {
    background-color: #00307D !important;
}

/* White Paper */
.eb-parent-eb-post-grid-549r8
.ebpg-categories-meta a[href*="/category/white-paper/"] {
    background-color: #72D9B2 !important;
}




/* ==================================================
   INNOV - NEWS CARD HEADER EDGE ALIGNMENT
================================================== */

/* Remove padding surrounding the card content */
.eb-parent-eb-post-grid-549r8 .ebpg-entry-wrapper {
    padding: 0 !important;
}

/* Keep the category header full width */
.eb-parent-eb-post-grid-549r8 .ebpg-header-meta {
    margin: 0 !important;
    padding: 0 !important;
}

/* Restore spacing for the date */
.eb-parent-eb-post-grid-549r8 .ebpg-footer-meta {
    padding: 18px 12px 0 !important;
}

/* Restore spacing for headline and excerpt */
.eb-parent-eb-post-grid-549r8 .ebpg-entry-header,
.eb-parent-eb-post-grid-549r8 .ebpg-entry-content {
    padding-left: 12px !important;
    padding-right: 12px !important;
}

/* Give the card content breathing room at the bottom */
.eb-parent-eb-post-grid-549r8 .ebpg-entry-wrapper {
    padding-bottom: 20px !important;
}




/* ==================================================
   INNOV - LATEST NEWS CATEGORY FILTER CAPSULE
   Essential Blocks Pro Post Grid
================================================== */

/* Outer mint-green capsule */
.eb-parent-eb-post-grid-549r8 .eb-post-grid-category-filter {
    border: 2px solid #72D9B2;
    border-radius: 999px;
    padding: 8px 24px;
    max-width: 1100px;
    margin: 0 auto 30px;
    box-sizing: border-box;
}

/* Arrange categories horizontally */
.eb-parent-eb-post-grid-549r8 .ebpg-category-filter-list {
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-wrap: wrap;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Remove individual button boxes */
.eb-parent-eb-post-grid-549r8 .ebpg-category-filter-list-item {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 10px 12px !important;
    margin: 0 !important;
    cursor: pointer;
}

/* Active category */
.eb-parent-eb-post-grid-549r8 .ebpg-category-filter-list-item.active {
    color: #72D9B2 !important;
}

/* Keyboard accessibility */
.eb-parent-eb-post-grid-549r8
.ebpg-category-filter-list-item:focus-visible {
    outline: 2px solid #72D9B2;
    outline-offset: 3px;
    border-radius: 4px !important;
}

/* Responsive adjustments */
@media (max-width: 767px) {
    .eb-parent-eb-post-grid-549r8 .eb-post-grid-category-filter {
        border-radius: 20px;
        padding: 12px;
    }

    .eb-parent-eb-post-grid-549r8 .ebpg-category-filter-list {
        justify-content: center;
        gap: 6px;
    }
}





/* ==========================================
   INNOV LATEST NEWS - RESPONSIVE FILTER ICON
   ========================================== */

.eb-post-grid-category-filter .ebpg-category-filter-list {
    position: relative;
}

/* Filter icon */
.eb-post-grid-category-filter .ebpg-category-filter-list::before {
    content: "";
    display: block;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;

    background: linear-gradient(
        to bottom,
        #72D9B2 0 3px,
        transparent 3px 10px,
        #72D9B2 10px 13px,
        transparent 13px 20px,
        #72D9B2 20px 23px,
        transparent 23px
    );

    clip-path: polygon(
        0 0, 100% 0,
        100% 20%,
        75% 20%,
        75% 55%,
        50% 55%,
        50% 100%,
        0 100%
    );

    pointer-events: none;
}

/* Tablet and mobile */
@media (max-width: 781px) {
    .eb-post-grid-category-filter .ebpg-category-filter-list::before {
        flex-basis: 24px;
        width: 24px;
        height: 24px;
    }
}




/* ==================================================
   INNOV - LATEST NEWS FILTER RESPONSIVE LAYOUT
   Tablet and Mobile Only
================================================== */

/* Tablet: 768px through 1024px */
@media (min-width: 768px) and (max-width: 1024px) {

    .eb-parent-eb-post-grid-549r8 .eb-post-grid-category-filter {
        padding: 12px 20px;
    }

    .eb-parent-eb-post-grid-549r8 .ebpg-category-filter-list {
        display: grid;
        grid-template-columns: 30px repeat(2, minmax(0, 1fr));
        gap: 12px 16px;
        align-items: center;
        justify-items: center;
    }

    /* Icon */
    .eb-parent-eb-post-grid-549r8
    .ebpg-category-filter-list::before {
        grid-column: 1;
        grid-row: 1;
    }

    /* All */
    .eb-parent-eb-post-grid-549r8
    .ebpg-category-filter-list-item:nth-child(1) {
        grid-column: 2;
        grid-row: 1;
    }

    /* Company News */
    .eb-parent-eb-post-grid-549r8
    .ebpg-category-filter-list-item:nth-child(2) {
        grid-column: 3;
        grid-row: 1;
    }

    /* Regulatory Update */
    .eb-parent-eb-post-grid-549r8
    .ebpg-category-filter-list-item:nth-child(3) {
        grid-column: 2;
        grid-row: 2;
    }

    /* White Paper */
    .eb-parent-eb-post-grid-549r8
    .ebpg-category-filter-list-item:nth-child(4) {
        grid-column: 3;
        grid-row: 2;
    }

    /* Category text */
    .eb-parent-eb-post-grid-549r8
    .ebpg-category-filter-list-item {
        padding: 8px 6px !important;
        font-size: clamp(16px, 2vw, 22px) !important;
        text-align: center;
    }
}

/* Mobile: 767px and below */
@media (max-width: 767px) {

    .eb-parent-eb-post-grid-549r8 .eb-post-grid-category-filter {
        padding: 12px;
        border-radius: 20px;
    }

    .eb-parent-eb-post-grid-549r8 .ebpg-category-filter-list {
        display: grid;
        grid-template-columns: 24px minmax(0, 1fr);
        gap: 8px 12px;
        align-items: center;
        justify-items: center;
    }

    .eb-parent-eb-post-grid-549r8
    .ebpg-category-filter-list::before {
        grid-column: 1;
        grid-row: 1;
    }

    .eb-parent-eb-post-grid-549r8
    .ebpg-category-filter-list-item {
        grid-column: 2;
        padding: 6px 4px !important;
        font-size: clamp(16px, 4vw, 20px) !important;
        line-height: 1.3 !important;
        text-align: center;
		
		/* Center category labels across the entire capsule */
		position: relative;
		left: -18px;
    }

    .eb-parent-eb-post-grid-549r8
    .ebpg-category-filter-list-item:first-child {
        grid-column: 2;
        grid-row: 1;
    }
}






/* ==================================================
   INNOV - SINGLE NEWS POST CATEGORY CAPSULE
================================================== */

.single-post .wp-block-post-terms.taxonomy-category {
    display: inline-block;
    width: fit-content;
    max-width: 100%;
    box-sizing: border-box;
	padding: 5px 12px !important;
}





/* ==================================================
   INNOV - LATEST NEWS
   Align Continue Reading Links at Card Bottom
================================================== */

/* Make the card holder fill its grid cell */
.eb-parent-eb-post-grid-549r8 .ebpg-grid-post-holder {
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* Make the inner wrapper fill the holder */
.eb-parent-eb-post-grid-549r8 .ebpg-entry-wrapper {
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Let the content area use remaining space */
.eb-parent-eb-post-grid-549r8 .ebpg-entry-content {
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Anchor Continue Reading at the bottom */
.eb-parent-eb-post-grid-549r8 .ebpg-readmore-btn {
    margin-top: auto;
}






/* ==================================================
   INNOV - LATEST NEWS FILTER CENTERING
   Surgical alignment adjustment
================================================== */

.eb-parent-eb-post-grid-549r8 .eb-post-grid-category-filter {
    width: min(100%, 1100px);
    max-width: 100%;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box;
}














/* ==================================================
   INNO - CONTACT FORM PLACEHOLDER COLOR
   Scoped to the homepage contact form
================================================== */

.inno-contact-form .wpforms-container input::placeholder,
.inno-contact-form .wpforms-container textarea::placeholder {
    color: #008EE6 !important;
    opacity: 1 !important;
}






/* ==================================================
   INNO - CONTACT FORM SUBMIT BUTTON
   Normal and Hover Text Colors
================================================== */

/* Normal button */
.inno-contact-form .wpforms-container button[type="submit"] {
    background: #FFFFFF !important;
    color: #008EE6 !important;
}

/* Hover and keyboard focus */
.inno-contact-form .wpforms-container button[type="submit"]:hover,
.inno-contact-form .wpforms-container button[type="submit"]:focus-visible {
    background: #FFFFFF !important;
    color: #72D9B2 !important;
}










/* ==================================================
   INNOVOTEX - FOOTER
   Responsive spacing and separators
================================================== */

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

    .innov-footer-row > .wp-block-paragraph:not(:last-child)::after {
        content: "|";
        display: inline-block;
        margin-left: 16px;
    }

}

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

    .innov-footer-row {
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: center;
        gap: 10px !important;
    }

    .innov-footer-row > .wp-block-paragraph {
        margin: 0 !important;
        text-align: center;
        max-width: 100%;
        overflow-wrap: normal;
    }

}




/* ==================================================
   INNOVOTEX - FOOTER LINK
   Remove underline in all states
================================================== */

.innov-footer-row a,
.innov-footer-row a:hover,
.innov-footer-row a:focus,
.innov-footer-row a:visited {
    text-decoration: none !important;
}










/* ==================================================
   INNOV - SCROLL-TRIGGERED TEXT ANIMATIONS
   Left and Right | Repeat on Re-entry | Responsive
================================================== */

/* Base animation settings */
html.innov-animations-ready .innov-slide-left,
html.innov-animations-ready .innov-slide-right {
    opacity: 0;
    transition:
        opacity 0.75s ease,
        transform 0.75s ease;
}

/* Starting positions */
html.innov-animations-ready .innov-slide-left {
    transform: translate3d(-60px, 0, 0);
}

html.innov-animations-ready .innov-slide-right {
    transform: translate3d(60px, 0, 0);
}

/* Final visible position */
html.innov-animations-ready .innov-slide-left.innov-visible,
html.innov-animations-ready .innov-slide-right.innov-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

/* Accessibility: reduced motion */
@media (prefers-reduced-motion: reduce) {
    html.innov-animations-ready .innov-slide-left,
    html.innov-animations-ready .innov-slide-right {
        opacity: 1;
        transform: none;
        transition: none;
    }
}