/**
 * ============================================================================
 * INTERLUDE BIOPHARMA - MAIN STYLESHEET
 * ============================================================================
 * 
 * Version: 3.0.0 (FINAL - Professional Edition)
 * Last Updated: February 10, 2026
 * 
 * - SEO-optimized with real text (not images)
 * - Fully responsive design
 * - Accessibility compliant
 * - Professional code architecture
 * 
 * ============================================================================
 */

html.preboot-hash body{visibility:hidden;}

        /* Font Imports — Inter (UI/headings) + Source Serif 4 (pull quotes, editorial callouts) */
        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,600;0,8..60,700&display=swap');

        /* Variables */
        :root {
  /* Typography */
  --font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;

  /* Border Radius System — 4 values only */
  --radius-sm: 6px;     /* buttons, badges, small controls */
  --radius-md: 12px;    /* inputs, tags, submenu items */
  --radius-lg: 16px;    /* cards, panels */
  --radius-xl: 24px;    /* large panels, hero, banners */

  /* Colors */
  --gray-50: #F7FAFC;
  --gray-600: var(--text-grey);
  --navy: #0E2E44;
  --primary: var(--primary-dark);
  --site-header-h: 84px;
  --success: var(--accent);
  --gray-900: #0F172A;
  --gray-100: #F1F5F9;
  --primary-blue: var(--primary-dark);
            --primary-dark: #1A3A52;
            --primary-light: #E8F4F8;
            --accent: #009845;
            --accent-light: #00b858;
            --accent-emphasis: #00b858; /* replaces neon var(--accent-emphasis) */
            --white: #ffffff;
            --text-grey: #5A6B7C;
            --width: 1920px;
  --ttl-dot: 28px;
  --ttl-line: 8px;
        }

        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

                html {
            overflow-x: hidden;
            height: 100%;
        }

body {
            font-family: 'Inter', sans-serif; font-weight: 400;
            background-color: var(--white);
            color: var(--primary-dark);
            width: 100%;
            max-width: var(--width);
            margin: 0 auto;
                        min-height: 100vh;
                        display: flex;
                        flex-direction: column;
                        padding-top: var(--site-header-h);
            -webkit-font-smoothing: antialiased;
        }

        a {
            text-decoration: none;
            color: inherit;
        }

        ul {
            list-style: none;
        }

        /* Header */
        header {
            width: min(100%, var(--width));
            height: var(--site-header-h);
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 clamp(16px, 5vw, 120px);
            gap: clamp(10px, 1.6vw, 26px);
            position: fixed;
            top: 0;
            left: 50%;
            transform: translateX(-50%);
            z-index: 100;
            background: rgba(255, 255, 255, 0.50);
            border: 1px solid rgba(255, 255, 255, 0.35);
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            isolation: isolate;
        }
        /* Full-width opaque header strip (edge-to-edge) */
        header::before {
            content: '';
            position: absolute;
            top: 0;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 100vw;
            background: rgba(255, 255, 255, 1);
            box-shadow: 0 1px 0 rgba(26, 58, 82, 0.08);
            z-index: -1;
        }
.logo {
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: clamp(36px, 2.70vw, 57.6px);
            letter-spacing: -0.5px;
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .logo span {
            color: var(--accent);
        }

        .logo-svg {
            height: clamp(30px, 3.30vw, 57px);
            display: block;
        }
        .logo-svg svg {
            height: 100%;
            width: auto;
            display: block;
        }

        /* Keep nav centered and prevent logo/nav collisions as viewport shrinks */
        nav {
            flex: 1 1 auto;
            min-width: 0;
            display: flex;
            justify-content: center;
        }

        nav > ul {
            display: flex;
            justify-content: center;
            gap: clamp(12px, 2.5vw, 50px);
            flex-wrap: nowrap;
            align-items: center;
        }

        nav a {
            font-family: 'Inter', sans-serif; font-weight: 500;
            font-size: clamp(13px, 0.9vw, 15px);
            line-height: 1.1;
            white-space: nowrap;
            color: var(--primary-dark);
            opacity: 0.8;
            transition: background 160ms ease, color 160ms ease;
            position: relative;
    --ttl-dot: 30px;
    --ttl-line: 6px;
        }

        nav a:hover {
            opacity: 1;
            color: var(--accent);
        }

        nav a::after {
            content: '';
            position: absolute;
            bottom: -5px;
            left: 0;
            width: 0;
            height: 2px;
            background: var(--accent);
            transition: width 0.3s ease;
        }


        
        

        /* Desktop: properly sized nav */
        @media (min-width: 901px) {
            nav a { font-size: clamp(15px, 1vw, 17px); }
            nav .submenu a { font-size: 15px; }
        }

        /* Mid-width desktop: prevent header/nav overlap (e.g., 1024–1120px) */
        @media (min-width: 901px) and (max-width: 1120px) {
            nav ul { gap: clamp(10px, 1.4vw, 22px); }
            nav a { font-size: 14px; }
            nav .submenu a { font-size: 14px; }
            .cta-btn-small { font-size: 13px; padding: 9px 16px; }
        }

/* Submenus (desktop) */
        nav li.has-submenu {
            position: relative;
        }

        
        /* Hover-bridge so you can move from parent to dropdown without it collapsing */
        nav li.has-submenu::after {
            content: "";
            position: absolute;
            left: -120px;
            right: -120px;
            top: 100%;
            height: 0px;
            background: transparent;
        }


        nav li.has-submenu:hover::after,
        nav li.has-submenu.is-open::after,
        nav li.has-submenu:hover::after {
            height: 14px;
        }

nav li.has-submenu > a {
            display: inline-flex;
            align-items: center;
            gap: 6px;
        }

        nav li.has-submenu .submenu {
            position: absolute;
            top: calc(100% + 8px);
            left: 50%;
            transform: translateX(-50%) translateY(6px);
            background: rgba(255, 255, 255, 0.98);
            border: 1px solid rgba(15, 30, 66, 0.14);
            border-radius: var(--radius-md);
            padding: 10px;
            min-width: 260px;
            box-shadow: 0 18px 45px rgba(0, 0, 0, 0.14);
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
            z-index: 10050;
        }

        
        nav ul.submenu {
            display: flex;
            flex-direction: column;
            gap: 6px;
            padding: 0;
            margin: 0;
        }

        nav li.has-submenu.is-open > .submenu,
        nav li.has-submenu:hover > .submenu {
            opacity: 1;
            visibility: visible;
            pointer-events: auto;
            transform: translateX(-50%) translateY(0);
        }

        /* Touch devices: do not open desktop dropdowns on tap/drag (prevents "first tap opens submenu" behavior on iOS/iPadOS) */
        @media (hover: none) and (pointer: coarse) {
            /* On touch devices, do not use :hover-driven dropdowns, but allow programmatic open via .is-open */
            header nav li.has-submenu::after { display: none !important; }

            header nav li.has-submenu > .submenu {
                display: block !important; /* keep in flow for visibility toggling */
                opacity: 0 !important;
                visibility: hidden !important;
                pointer-events: none !important;
                transform: translateX(-50%) translateY(6px) !important;
            }

            header nav li.has-submenu:hover > .submenu {
                /* ignore hover emulation on iOS */
                opacity: 0 !important;
                visibility: hidden !important;
                pointer-events: none !important;
                transform: translateX(-50%) translateY(6px) !important;
            }

            header nav li.has-submenu.is-open > .submenu,
            header nav li.has-submenu.is-pinned > .submenu {
                opacity: 1 !important;
                visibility: visible !important;
                pointer-events: auto !important;
                transform: translateX(-50%) translateY(0) !important;
            }
        }

        nav .submenu li {
            list-style: none;
            margin: 0;
        }

        nav .submenu a {
            display: block;
            padding: 9px 11px;
            border-radius: var(--radius-md);
            font-size: 14px;
            line-height: 1.2;
            opacity: 0.9;
            white-space: nowrap;
        }

        nav .submenu a:hover {
            background: rgba(0, 152, 69, 0.08);
            opacity: 1;
        }

        /* Submenus (mobile drawer) */
        .mobile-menu__links .mobile-submenu {
            margin: 10px 0 4px 14px;
            padding-left: 12px;
            border-left: 1px solid rgba(15, 30, 66, 0.14);
        }

        .mobile-menu__links .mobile-submenu li {
            list-style: none;
            margin: 0;
        }

        .mobile-menu__links .mobile-submenu a {
            display: block;
            padding: 8px 6px;
            font-size: 16px;
            opacity: 0.88;
        }
/* Mobile Hamburger + Drawer */
        .nav-toggle {
            display: none;
            width: 44px;
            height: 44px;
            border-radius: var(--radius-sm);
            border: 1px solid rgba(26, 58, 82, 0.18);
            background: rgba(255, 255, 255, 0.65);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            cursor: pointer;
            align-items: center;
            justify-content: center;
            gap: 4px;
            flex-direction: column;
        }
        .nav-toggle span {
            display: block;
            width: 18px;
            height: 2px;
            border-radius: var(--radius-sm);
            background: var(--primary-dark);
            opacity: 0.9;
        }

        body.menu-open { overflow: hidden; }

        .mobile-menu {
            position: fixed;
            inset: 0;
            z-index: 1000;
            display: block;
            background: rgba(10, 18, 26, 0.35);
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.25s ease, visibility 0s linear 0.25s;
        }
        .mobile-menu.is-open {
            opacity: 1;
            visibility: visible;
            pointer-events: auto;
            transition: opacity 0.25s ease;
        }

        .mobile-menu__panel {
            position: absolute;
            top: 0;
            right: 0;
            width: min(88vw, 360px);
            height: 100%;
            padding: 18px 18px 22px;
            background: rgba(255, 255, 255, 0.92);
            backdrop-filter: blur(18px);
            -webkit-backdrop-filter: blur(18px);
            box-shadow: -18px 0 50px rgba(0, 0, 0, 0.18);
            transform: translateX(100%);
            transition: transform 0.25s ease;
            display: flex;
            flex-direction: column;
            gap: 14px;
        }
        .mobile-menu.is-open .mobile-menu__panel { transform: translateX(0); }

        .mobile-menu__header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 6px 2px 10px;
            border-bottom: 1px solid rgba(26, 58, 82, 0.10);
        }
        .mobile-menu__title {
            font-family: 'Inter', sans-serif; font-weight: 700;
            color: var(--primary-dark);
            letter-spacing: 0.2px;
        }
        .mobile-menu__close {
            width: 40px;
            height: 40px;
            border-radius: var(--radius-sm);
            border: 1px solid rgba(26, 58, 82, 0.14);
            background: rgba(255, 255, 255, 0.70);
            cursor: pointer;
            font-size: 26.4px;
            line-height: 1;
            color: var(--primary-dark);
        }

        .mobile-menu__links {
            display: flex;
            flex-direction: column;
            gap: 10px;
            padding-top: 10px;
        }
        .mobile-menu__links a {
            font-family: 'Inter', sans-serif; font-weight: 500;
            font-size: 17px;
            color: var(--primary-dark);
            padding: 12px 10px;
            border-radius: var(--radius-md);
            background: rgba(232, 244, 248, 0.55);
        }
        .mobile-menu__cta {
            margin-top: auto;
            width: 100%;
            text-align: center;
            justify-content: center;
        }
        nav a:hover::after {
            width: 100%;
        }

        .cta-btn-small {
            background-color: var(--primary-dark);
            color: var(--white);
            padding: 0.65rem 1.25rem;
            border-radius: var(--radius-sm);
            font-weight: 600;
            font-size: 14px;
            font-family: 'Inter', sans-serif;
            white-space: nowrap;
            transition: all 0.2s;
        }

        .cta-btn-small:hover {
            background-color: var(--accent);
        }

        /* For Investors nav CTA: turn green when active */
        a.cta-btn-small[data-page="for-investors"].is-current,
        .mobile-menu a.cta-btn-small[data-page="for-investors"].is-current {
            background-color: #00b858 !important;
            color: #ffffff !important;
        }
        a.cta-btn-small[data-page="for-investors"].is-current:hover,
        .mobile-menu a.cta-btn-small[data-page="for-investors"].is-current:hover {
            background-color: #00b858 !important;
        }

        /* Green CTA variant (matches header CTA shape) */
        .cta-btn-green{
            background-color: var(--accent);
            color: var(--white);
        }
        .cta-btn-green:hover{
            background-color: var(--primary-dark);
        }
        
/* Navy CTA (matches button typography from Request Information) */
.cta-btn-navy{background:var(--navy);color:#fff;}
.cta-btn-navy:hover{background:#0b2b41;}
.trial-card .trial-cta{display:inline-flex;align-items:center;gap:10px;margin-top:14px;}
.client-learn-more-btn{
            margin-top: 2.25rem; /* 3x previous spacing */
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            text-decoration: none;
        }

        /* Hero Section */
        .hero {
            position: relative;
            width: 100%;
            height: 900px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            padding: 0 clamp(16px, 5vw, 120px);
            gap: clamp(10px, 1.6vw, 26px);
            background: transparent;
            overflow: visible;
            margin-top: 0; /* handled by #pages padding-top */
        
            --hero-bg-offset: 0px;
            --hero-text-offset: 0px;
        }

        /* Hero Background Carousel (behind hero text) */
        .hero-carousel {
            position: absolute;
            inset: 0;
            z-index: 1;
            overflow: hidden;
        }
        .hero-carousel__slides {
            position: absolute;
            inset: 0;
            pointer-events: none;
            overflow: hidden;
        }
        .hero-carousel__slide {
            position: absolute;
            inset: 0;
            opacity: 0;
            transition: opacity 900ms ease;
            pointer-events: none;
        }
        /* No tint over slide image */
        .hero-carousel__slide::after {
            content: '';
            position: absolute;
            inset: 0;
            background: rgba(255, 255, 255, 0);
            pointer-events: none;
        }
        .hero-carousel__slide.is-active { opacity: 1; }
        .hero-carousel__slide img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center 20%;
            display: block;
            transform: none;
        }
        .hero-carousel__bg {
            position: absolute;
            inset: 0;
            z-index: 0;
            overflow: hidden;
        }

        /* Prevent inner scrollbars from appearing within the hero region on some browsers */
        .hero-carousel,
        .hero-carousel__slides,
        .hero-carousel__slide,
        .hero-carousel__bg {
            overflow: hidden;
        }
        .hero-carousel__bg .hero-bg-img {
            position: absolute;
            top: -20%;
            left: 0;
            width: 100%;
            height: 140%;
            object-fit: cover;
            object-position: center 20%;
            display: block;
        }

        .hero-carousel__dots {
            position: absolute;
            left: 50%;
            bottom: 26px;
            transform: translateX(-50%);
            display: flex;
            gap: 12px;
            z-index: 12;
            padding: 0;
            background: transparent;
            border: none;
            border-radius: 0;
            backdrop-filter: none;
            -webkit-backdrop-filter: none;
        }
        .hero-dot {
            width: 10px;
            height: 10px;
            border-radius: var(--radius-sm);
            border: 1px solid rgba(26, 58, 82, 0.30);
            background: rgba(255, 255, 255, 0.60);
            cursor: pointer;
            padding: 0;
        }
        .hero-dot.is-active {
            background: var(--accent);
            border-color: rgba(0, 152, 69, 0.35);
        }
        .hero-dot:focus-visible {
            outline: 3px solid rgba(0, 152, 69, 0.35);
            outline-offset: 3px;
        }

        .hero-content {
            position: relative;
            z-index: 10;
        }

/* --- Hero panel: solid green treatment --- */
.hero-content .hero-label{
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 6px 12px;
            border-radius: 999px;
            border: 1px solid rgba(255,255,255,0.85);
            color: #fff;
            background: transparent;
            text-shadow: none;
        }
.hero-content .hero-accent { 
    color: var(--accent-emphasis); 
    -webkit-text-fill-color: var(--accent-emphasis);
    font-weight: 700; 
}

.hero-content h1{
            color: #fff;
            text-shadow: none;
        }
.hero-content .hero-subhead{
            color: #fff;
            text-shadow: none;
            font-size: clamp(28px, 3vw, 40px);
        }

.hero-content .hero-stats .stat{
            background: rgba(255,255,255,0.16);
            border: 1px solid rgba(255,255,255,0.14);
        }
.hero-content .stat-number,
.hero-content .stat-label{
            color: #fff;
        }


        /* Hero panel sizing + placement (smaller + lower; allow slight overlap below hero) */
        .hero .label { font-size: 11px; margin-bottom: 14px; padding: 5px 11px; letter-spacing: 1.4px; }
        .hero h1 { font-size: clamp(32px, 3.4vw, 58px); margin-bottom: 18px; }
        .hero .hero-subhead { font-size: clamp(16px, 1.5vw, 19px); margin-bottom: 10px; }
        .hero .hero-stats { gap: 10px; margin-top: 12px; }
        .hero .hero-stats .stat { padding: 10px 12px; border-radius: var(--radius-md); min-width: 150px; }
        .hero .hero-stats .stat-number { font-size: clamp(22px, 2vw, 32px); }
        .hero .hero-stats .stat-label { font-size: 13px; }



        @media (max-width: 640px) {
            /* Mobile: hero image first, then the hero panel BELOW the photo (no overlap, no nested scrollbars) */
            .hero{
                height: min(85vh, 700px);
                min-height: 500px;
                padding: 0;
                justify-content: flex-start;
            }
            .hero-carousel{
                position: absolute;
                inset: 0;
                z-index: 1;
            }
            /* Ensure slides keep covering the carousel area */
            .hero-carousel__slides,
            .hero-carousel__slide,
            .hero-carousel__bg{
                position: absolute;
                inset: 0;
            }

            .hero-content{
                position: absolute;
                left: 0;
                right: auto;
                bottom: 0;
                top: 0;
                transform: none;
                max-width: none;
                width: 100%;
                margin: 0;
                z-index: 10;
            }

            .hero .hero-stats{
                flex-direction: column;
            }
            .hero .hero-stats .stat{
                min-width: 0;
                width: 100%;
            }
        }




        .label {
            font-family: 'Inter', sans-serif; font-weight: 500;
            font-size: 12px;
            text-transform: uppercase;
            letter-spacing: 1.6px;
            color: var(--accent);
            margin-bottom: 20px;
            display: inline-block;
            background: rgba(0, 152, 69, 0.08);
            padding: 7px 14px;
            border-radius: var(--radius-sm);
        }

        h1 {
font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: clamp(36px, 4vw, 64px);
line-height: 1.15;
            color: var(--primary-dark);
            margin-bottom: 28px;
        }

        /* Gradient text treatment — non-hero headings only */
        .about h1,
        .features h1,
        .lead-section h1:not(.hero-content h1),
        .investors h1 {
            background: linear-gradient(90deg, #1A3A52 0%, #2C5F85 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .hero p {
            font-family: 'Inter', sans-serif; font-weight: 400;
            font-size: 17px;
            line-height: 1.65;
            color: var(--text-grey);
            margin-bottom: 36px;
            max-width: 600px;
        }

        

        /* Hero text on photo carousel */
        .hero h1 {
            color: var(--primary-dark);
            background: none;
            -webkit-background-clip: initial;
            -webkit-text-fill-color: var(--primary-dark);
            text-shadow: 0 0 18px rgba(255, 255, 255, 0.85), 0 0 42px rgba(255, 255, 255, 0.55);
        }
        .hero p {
            color: var(--primary-dark);
            text-shadow: 0 0 14px rgba(255, 255, 255, 0.75), 0 0 32px rgba(255, 255, 255, 0.45);
        }        .hero-label {
            color: var(--primary-dark);
            text-shadow: 0 0 12px rgba(255, 255, 255, 0.70), 0 0 28px rgba(255, 255, 255, 0.40);
        }
        .hero-accent {
            color: var(--accent);
        }
        .hero-subhead {
            margin-top: 8px;
            margin-bottom: 16px;
            font-family: 'Inter', sans-serif; font-weight: 400;
            font-size: clamp(17px, 1.6vw, 22px);
            line-height: 1.5;
            color: var(--primary-dark);
            text-shadow: 0 0 14px rgba(255, 255, 255, 0.75), 0 0 32px rgba(255, 255, 255, 0.45);
        }
        .hero-stats {
            display: flex;
            flex-wrap: wrap;
            gap: 14px;
            margin-top: 18px;
        }
        .hero-stats .stat {
            display: flex;
            flex-direction: column;
            justify-content: center;
            padding: 14px 16px;
            border-radius: var(--radius-lg);
            background: rgba(255, 255, 255, 0.70);
            border: 1px solid rgba(12, 33, 56, 0.12);
            min-width: 147px;
            backdrop-filter: blur(6px);
        }
        .hero-stats .stat-number {
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: clamp(24px, 2.4vw, 38px);
            line-height: 1.0;
            color: var(--primary-dark);
            text-shadow: 0 0 14px rgba(255, 255, 255, 0.70), 0 0 30px rgba(255, 255, 255, 0.45);
        }
        .hero-stats .stat-label {
            margin-top: 5px;
            font-family: 'Inter', sans-serif; font-weight: 400;
            font-size: 13px;
            letter-spacing: 0.2px;
            color: rgba(12, 33, 56, 0.78);
        }
        @media (max-width: 640px) {
            .hero-stats .stat {
                width: 100%;
                min-width: 0;
            }
        }
.hero-copy {
            position: relative;
            min-height: clamp(190px, 26vw, 270px);
            will-change: transform;
        }

.hero-copy__item {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            opacity: 0;
            transition: opacity 900ms ease;
            will-change: opacity;
            pointer-events: none;
        }
        .hero-copy__item.is-active {
            opacity: 1;
            pointer-events: auto;
        }

.hero-buttons {
            display: flex;
            gap: 20px;
        }

        .btn-primary {
            padding: clamp(12px, 1vw, 16px) clamp(18px, 2.2vw, 36px);
            white-space: nowrap;
            background-color: var(--accent);
            color: var(--white);
            border-radius: var(--radius-xl);
            font-family: 'Inter', sans-serif; font-weight: 600;
            font-size: clamp(13px, 0.9vw, 16px);
            transition: all 0.3s ease;
            box-shadow: 0 8px 18px rgba(0, 152, 69, 0.2);
            display: flex;
            align-items: center;
            gap: 8px;
            border: none;
            cursor: pointer;
            appearance: none;
            text-decoration: none;
        }

        .btn-primary:hover {
            background-color: #007A36;
            transform: translateY(-2px);
            box-shadow: 0 15px 30px rgba(0, 152, 69, 0.3);
        }



        /* Home: lower "Our Pipeline" button by 20px (pushes section bottom as well) */
        .home-pipeline-cta {
            margin-top: 20px;
            display: inline-flex;
            width: auto;
            align-self: flex-start;
        }
        .btn-secondary {
            padding: clamp(12px, 1vw, 16px) clamp(14px, 1.8vw, 30px);
            white-space: nowrap;
            background-color: transparent;
            color: var(--primary-dark);
            border: 1px solid rgba(26, 58, 82, 0.2);
            border-radius: var(--radius-xl);
            font-family: 'Inter', sans-serif; font-weight: 500;
            font-size: clamp(13px, 0.85vw, 16px);
            transition: all 0.3s ease;
        }

        .btn-secondary:hover {
            border-color: var(--primary-dark);
            background-color: var(--white);
        }

        /* Stats Section */
        .stats-strip {
            position: absolute;
            bottom: 0;
            right: 0;
            width: 45%;
            background: var(--white);
            padding: 60px 80px;
            border-top-left-radius: 40px;
            box-shadow: -10px -10px 40px rgba(0,0,0,0.03);
            display: flex;
            justify-content: space-between;
        }

        .stat-item h3 {
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: 38px;
            color: var(--primary-dark);
            margin-bottom: 4px;
        }

        .stat-item span {
            color: var(--accent);
        }

        .stat-item p {
            font-size: 12px;
            color: var(--text-grey);
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        /* Features Section */
        .features {
            padding: clamp(60px, 8vw, 120px) clamp(20px, 8vw, 120px);
            background-color: var(--white);
        }

        .section-header {
            text-align: center;
            margin-bottom: clamp(40px, 5vw, 72px);
        }

        .section-header h2 {
font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: clamp(28px, 3vw, 44px);
color: var(--primary-dark);
            margin-bottom: 14px;
        }

        .section-header p {
            font-size: 17px;
            color: var(--text-grey);
            max-width: 600px;
            margin: 0 auto;
            line-height: 1.7;
        }

        /* Home: About Us intro copy — slightly larger than body but not headline-sized */
        .features .section-header p.expertise-intro {
            font-size: 19px;
            line-height: 1.75;
            color: var(--text-grey);
        }

        /* Make the Core Areas of Expertise paragraph wider on desktop */
        @media (min-width: 1024px) {
            .features .section-header p.expertise-intro {
                max-width: 1200px;
            }
        }

        .grid-container {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 40px;
        }

        .card {
            background-color: var(--white);
            border: 1px solid #EFF4F8;
            border-radius: var(--radius-lg);
            padding: 50px 40px;
            transition: all 0.4s ease;
            position: relative;
            overflow: hidden;
        }

        .card:hover {
            transform: translateY(-6px);
            box-shadow: 0 16px 40px rgba(26, 58, 82, 0.08);
            border-color: transparent;
        }

        /* Cards that should NOT lift on hover (banners, charts, validation blocks) */
        .card--static:hover,
        .lead-banner.card:hover,
        .lead-science.card:hover,
        .pipeline-chart.card:hover,
        .pipeline-mechanism.card:hover,
        .trials-intro.card:hover {
            transform: none;
            box-shadow: none;
            border-color: #EFF4F8;
        }

        
        /* Handled by .card--static / centralized :hover rules above */
@media (min-width: 900px){
  #for-investors .investor-contact{ margin-top: -72px; }
}

#for-investors .section-title{ font-weight: 800; }

#for-investors .lead-section .card{
  transition: none;
}
#for-investors .lead-section .card:hover{
  transform: none;
  box-shadow: 0 15px 40px rgba(26, 58, 82, 0.08);
  border-color: transparent;
}

.icon-box {
            width: 70px;
            height: 70px;
            background-color: var(--primary-light);
            border-radius: var(--radius-lg);
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 30px;
            color: var(--accent);
            font-size: clamp(24px, 1.8vw, 38.4px);
            transition: all 0.3s ease;
        }

        .card:hover .icon-box {
            background-color: var(--accent);
            color: var(--white);
        }

        .card h3 {
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: 21px;
            color: var(--primary-dark);
            margin-bottom: 12px;
            line-height: 1.25;
        }

        .card p {
            font-size: 16px;
            color: var(--text-grey);
            line-height: 1.7;
            margin-bottom: 24px;
        }

        .card-link {
            font-family: 'Inter', sans-serif; font-weight: 500;
            font-size: 14px;
            color: var(--primary-dark);
            display: flex;
            align-items: center;
            gap: 8px;
            transition: gap 0.3s ease;
        }

        .card:hover .card-link {
            color: var(--accent);
            gap: 12px;
        }

        /* Innovation Section */
        .innovation {
            padding: clamp(60px, 8vw, 120px) clamp(20px, 8vw, 120px);
            background-color: #F8FBFC;
            display: flex;
            align-items: center;
            gap: 80px;
            position: relative;
        }

        .innovation-image {
            flex: 1;
            height: 500px;
            background: transparent;
            border-radius: 10%;
            position: relative;
            overflow: hidden;
        }

        .innovation-photo {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            will-change: transform;
        }


        /* Abstract DNA representation */
        .dna-helix {
            width: 60%;
            height: 100%;
            position: relative;
            display: flex;
            justify-content: center;
        }
        
        .strand {
            width: 2px;
            height: 100%;
            background: rgba(0, 152, 69,0.3);
            position: absolute;
        }
        .strand-left { left: 30%; }
        .strand-right { right: 30%; }
        
        .base-pair {
            position: absolute;
            height: 2px;
            background: rgba(0, 152, 69,0.4);
            left: 30%;
            right: 30%;
            border-radius: var(--radius-sm);
        }

        .innovation-content {
            flex: 1;
        }

        .innovation-content h2 {
font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: clamp(28px, 3vw, 44px);
color: var(--primary-dark);
            margin-bottom: 20px;
        }

        .innovation-content p {
            font-size: 17px;
            color: var(--text-grey);
            line-height: 1.75;
            margin-bottom: 32px;
        }
        /* Innovation copy (multi-paragraph) */
        .innovation-content .innovation-copy p {
            font-size: 17px;
            color: var(--text-grey);
            line-height: 1.75;
            margin-bottom: 16px;
        }
        .innovation-content .innovation-copy p:last-child {
            margin-bottom: 40px;
        }


        
        /* Home: Research & Development intro box (share Clinical Trials intro box behavior) */
.innovation-content .home-rd-intro{
    max-width: 980px;
    margin: 34px auto 0;
}
.innovation-content h2:hover + .home-rd-intro{
    border-left-color: var(--primary-dark);
}
@media (max-width: 1000px) {
            .innovation-content .home-rd-intro {
                margin-top: 18px;
                max-width: 100%;
            }
        }
.check-list {
            display: flex;
            flex-direction: column;
            gap: 20px;
            margin-bottom: 40px;
        }

        .check-item {
            display: flex;
            align-items: center;
            gap: 14px;
            font-family: 'Inter', sans-serif; font-weight: 500;
            color: var(--primary-dark);
            font-size: 17px;
        }

        .check-icon {
            width: 24px;
            height: 24px;
            background-color: var(--accent);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--white);
            font-size: 16.8px;
        }

        /* Footer */
        footer { flex-shrink: 0; }

        footer {
            background-color: transparent;
            position: relative;
            isolation: isolate;
            color: var(--white);
            padding: clamp(60px, 8vw, 100px) clamp(20px, 8vw, 120px) 40px;
        }
        /* Full-width footer background (edge-to-edge) */
        footer::before {
            content: '';
            position: absolute;
            top: 0;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 100vw;
            background: var(--primary-dark);
            z-index: -1;
        }
.footer-top {
            display: flex;
            justify-content: space-between;
            margin-bottom: 80px;
        }

        .footer-brand {
            max-width: 300px;
        }

        .footer-logo {
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: clamp(16px, 1.1vw, 19px);
            margin-bottom: 18px;
            display: block;
            color: var(--white);
        }
        
        .footer-logo span {
            color: var(--accent);
        }

        .footer-brand p {
            color: rgba(255, 255, 255, 0.6);
            line-height: 1.65;
            font-size: 15px;
        }

        
        .footer-contact a {
            text-decoration: underline;
            text-underline-offset: 3px;
            text-decoration-thickness: 1px;
            color: rgba(255, 255, 255, 0.85);
        }
        .footer-contact a:hover {
            color: var(--white);
        }

        /* Footer: non-link email (keep same visual weight as links) */
        .footer-contact .footer-email-link{
            display:inline-flex;
            align-items:center;
            gap:8px;
            color: rgba(255, 255, 255, 0.85);
        
            text-decoration: none;
        }
        .footer-contact .footer-email-link i{ font-size: 16px; opacity: 0.95; }

.footer-links {
            display: flex;
            gap: 80px;
        }

        .link-group h4 {
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: 14px;
            margin-bottom: 20px;
            letter-spacing: 0.5px;
            text-transform: uppercase;
            color: var(--white);
        }

        .link-group ul li {
            margin-bottom: 12px;
        }

        .link-group ul li a {
            color: rgba(255, 255, 255, 0.6);
            font-size: 15px;
            transition: color 0.3s ease;
        }

        .link-group ul li a:hover {
            color: var(--accent);
        }

        .footer-bottom {
            border-top: 1px solid rgba(255, 255, 255, 0.1);
            padding-top: 40px;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        
        .footer-location{
            display:inline-flex;
            align-items:center;
            gap:8px;
            margin-top:10px;
            color: rgba(255,255,255,0.85);
            font-size:14px;
        }
        .footer-location i{
            font-size:16px;
            opacity:0.9;
        }
        .footer-logo-right{
            display:flex;
            align-items:flex-start;
            justify-content:flex-end;
            margin-left: 24px;
        }
        .footer-logo-right svg{
            width: 160px;
            height: auto;
        }
        @media (max-width: 640px){
            .footer-top{
                flex-direction: column;
                align-items: flex-start;
                gap: 22px;
            }
            .footer-logo-right{
                margin-left: 0;
            }
            .footer-logo-right svg{
                width: 147px;
            }
        }
.copyright {
            color: rgba(255, 255, 255, 0.4);
            font-size: 13px;
        }

        .socials {
            display: flex;
            gap: 20px;
        }

        .socials a {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background-color: rgba(255, 255, 255, 0.05);
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--white);
            transition: all 0.3s ease;
        }

        .socials a:hover {
            background-color: var(--accent);
            transform: translateY(-3px);
        }

        /* Abstract Graphic Styles for Innovation Image */
        .glass-card {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            border-radius: inherit;
            overflow: hidden;
            background: transparent;
            border: none;
            box-shadow: none;
            z-index: 2;
        }


        .glass-card--photo {
            background: transparent;
            backdrop-filter: none;
            border: none;
            overflow: hidden;
        }
        .glass-card--photo .glass-card__img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }


        .molecule-cluster {
            position: relative;
            width: 100px;
            height: 100px;
        }
        
        .m-ball {
            position: absolute;
            border-radius: 50%;
            background: var(--primary-dark);
            box-shadow: inset -2px -2px 6px rgba(0,0,0,0.2);
        }
        .m1 { width: 40px; height: 40px; top: 30px; left: 30px; z-index: 2; }
        .m2 { width: 30px; height: 30px; top: 10px; left: 60px; background: var(--accent); }
        .m3 { width: 25px; height: 25px; top: 60px; left: 60px; background: #E8F4F8; border: 1px solid #ccc; }
        .m4 { width: 20px; height: 20px; top: 40px; left: 0px; background: var(--text-grey); }

        .m-link {
            position: absolute;
            height: 3px;
            background: #999;
            transform-origin: 0 50%;
            z-index: 1;
        }
    
/* Responsive / Scalable Layout */
@media (max-width: 1024px) {
    .hero { padding: 0 60px; height: 820px; }
    .stats-strip { padding: 44px 50px; width: 55%; }
    .features { padding: 100px 60px; }
    .innovation { padding: 100px 60px; gap: 50px; }
    footer { padding: 90px 60px 40px; }
    .grid-container { grid-template-columns: repeat(2, 1fr); }
}

/* Phone breakpoint */


@media (max-width: 900px) {
  .pipeline-mechanism{padding: 4%;}

    /* Switch primary navigation to hamburger earlier to prevent logo/nav collisions */
    nav { display: none; }
    .nav-toggle { display: flex; margin-left: auto; }
    .cta-btn-small { padding: 10px 18px; font-size: 15.6px; }

    /* Stack innovation section at hamburger breakpoint so the image stays visible above the content */
    .innovation {
        flex-direction: column;
        gap: 28px;
        padding: 70px 20px;
    }
    .innovation-image {
        width: 100%;
        height: 320px;
        order: 0;
    }
    .innovation-content {
        width: 100%;
        order: 1;
    }


}
@media (max-width: 640px) {

    /* Keep header readable over hero on small screens */
    nav { display: none; }
    .nav-toggle { display: flex; margin-left: auto; }
    .cta-btn-small { padding: 10px 18px; font-size: 15.6px; margin-left: 10px; }

    .hero {
        padding: 140px 20px 90px;
        height: auto;
    }
    .hero-content { max-width: 100%; }
    .hero p { font-size: 16px; margin-bottom: 22px; }

    .hero-carousel__dots { bottom: 14px; padding: 0; gap: 10px; }
    .hero-dot { width: 9px; height: 9px; }


    .hero-buttons {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }
    .btn-primary, .btn-secondary {
        width: 100%;
        justify-content: center;
        padding: 13px 16px;
        font-size: clamp(13px, 4vw, 16px);
    }

    .stats-strip {
        position: static;
        width: 100%;
        padding: 26px 20px;
        margin-top: 28px;
        border-top-left-radius: 24px;
        border-top-right-radius: 24px;
        flex-direction: column;
        gap: 6px;
    }
    .stat-item h3 { font-size: clamp(24px, 1.8vw, 38.4px); }

    .features { padding: 70px 20px; }
    .section-header { margin-bottom: 48px; }
    .section-header p { font-size: 19.2px; }

    .features .section-header p.expertise-intro { font-size: 28.8px; line-height: 1.65; }

    .grid-container { grid-template-columns: 1fr; gap: 20px; }
    .card { padding: 34px 24px; }

    .innovation {
        padding: 70px 20px;
        flex-direction: column;
        gap: 28px;
    }
    .innovation-image { width: 100%; height: 320px; }
    .innovation-content p { font-size: 16px; }
    .check-item { font-size: 16px; }

    footer { padding: 70px 20px 28px; }
    .footer-top { flex-direction: column; gap: 40px; }
    .footer-links { flex-direction: column; gap: 30px; }

    .footer-bottom {
        flex-direction: column;
        gap: 6px;
        align-items: flex-start;
    }
}
    
        /* Page switching container (crossfade between top-nav sections) */
#pages.pages {
    position: relative;
    width: 100%;
    flex: 1 0 auto; /* allow footer to sit at bottom when content is short */
    padding-top: 0; /* body padding-top already offsets the fixed header */
}

.page {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 480ms ease;
}

.page.is-visible {
    display: block;
    visibility: visible;
}

/* The active page becomes in-flow so #pages grows naturally (prevents footer overlap on iOS). */
.page.is-active {
    display: block;
    position: relative;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}


/* Prevent hidden (fading) pages from increasing document scroll height.
   Non-active pages may remain .is-visible briefly for crossfade; make them fixed so they don't contribute to layout/scroll. */
.page.is-visible:not(.is-active){
    position: fixed;
    top: var(--site-header-h);
    left: 0;
    right: 0;
    height: calc(100vh - var(--site-header-h));
    overflow: hidden;
    pointer-events: none;
}
.page.page-placeholder {
    min-height: auto;
    }


        .page-placeholder__section {
            min-height: auto;
            padding: 90px clamp(16px, 5vw, 120px);
            background: #fff;
        }

        .page-placeholder__title {
            font-size: clamp(32px, 4vw, 56px);
            line-height: 1.1;
            color: var(--primary-dark);
            margin: 0 0 14px;
            letter-spacing: -0.02em;
        }

        .page-placeholder__subhead {
            font-size: clamp(16px, 1.4vw, 20px);
            line-height: 1.6;
            color: rgba(10, 18, 26, 0.72);
            max-width: 820px;
            margin: 0;
        }

        
        

        /* Lead Candidate */
        .lead-section {
            padding: clamp(80px, 10vw, 140px) clamp(20px, 8vw, 120px);
            background: linear-gradient(135deg, #FFFFFF 0%, #F0F7FA 100%);
        }

        .lead-container {
            max-width: 1200px;
            margin: 0 auto;
        }

        .lead-kicker {
            display: inline-block;
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: 12px;
            letter-spacing: 1.6px;
            text-transform: uppercase;
            color: var(--primary-dark);
            background: var(--white);
            border: 1px solid #EAEAEA;
            border-radius: var(--radius-sm);
            padding: 8px 18px;
            box-shadow: 0 10px 30px rgba(26, 58, 82, 0.06);
        }

        .lead-title {
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: clamp(32px, 3.2vw, 52px);
            line-height: 1.15;
            color: var(--primary-dark);
            margin-top: 16px;
        }

        .lead-grid {
            display: grid;
            grid-template-columns: 1.15fr 0.85fr;
            gap: 32px;
            margin-top: 40px;
            align-items: start;
        }

        .lead-overview {
            border-left: 6px solid var(--primary-dark);
        }

        .lead-overview p {
            font-size: 17px;
            line-height: 1.75;
            color: var(--text-grey);
            margin-bottom: 16px;
        }

        .lead-overview p:last-child {
            margin-bottom: 0;
            color: var(--primary-dark);
            font-family: 'Inter', sans-serif; font-weight: 500;
        }

        .lead-benefits {
            display: grid;
            grid-template-columns: 1fr;
            gap: 6px;
        }

        .lead-benefit {
            background: rgba(0, 152, 69, 0.08);
            border: 1px solid rgba(0, 152, 69, 0.15);
            padding: 28px 26px;
        }

        .lead-benefit .icon-box {
            width: 54px;
            height: 54px;
            border-radius: var(--radius-md);
            margin-bottom: 16px;
            background-color: rgba(0, 152, 69, 0.14);
        }

        .lead-benefit .icon-box i {
            font-size: 31.2px;
            line-height: 1;
        }

        .lead-benefit-text {
            font-family: 'Inter', sans-serif; font-weight: 500;
            font-size: 16px;
            color: var(--primary-dark);
            line-height: 1.5;
            margin: 0;
        }

        
        .lead-banner {
            grid-column: 1 / -1;
            padding: 0;
            overflow: hidden;
            border-radius: var(--radius-xl);
        }

        .lead-banner img {
            width: 100%;
            height: auto;
            display: block;
        }

/* Our Science: constrain molecule banner + Clinical Validation to the same page gutters as other sections */
#our-science .lead-banner,
#our-science .lead-science{
    max-width: var(--max-width, 1200px);
    width: calc(100% - 4rem); /* 2rem gutters on both sides */
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 560px){
    #our-science .lead-banner,
    #our-science .lead-science{
        width: calc(100% - 2.5rem); /* 1.25rem gutters on both sides (matches mobile sections) */
    }
}

/* Our Science: add breathing room below Clinical Validation block */
#our-science .lead-science{ margin-bottom: clamp(22px, 3vw, 48px); }


.lead-science {
            grid-column: 1 / -1;
            background: #E8F4F8;
            border: 1px solid #D0E6F0;
        }

        .lead-science-head {
            display: flex;
            align-items: center;
            gap: 12px;
            font-family: 'Inter', sans-serif; font-weight: 700;
            letter-spacing: 1.2px;
            text-transform: uppercase;
            color: var(--primary-dark);
            margin-bottom: 18px;
        }

        .lead-science-head i {
            font-size: 20px;
        }

        
        .lead-clinical-title{
            font-size: clamp(1.6rem, 2.6vw, 2.1rem);
            font-weight: 800;
            color: var(--primary-dark);
            letter-spacing: -0.02em;
            line-height: 1.15;
            margin: 0.6rem 0 0.65rem;
        }
        .lead-clinical-sub{
            font-size: 1.05rem;
            color: var(--text-secondary);
            line-height: 1.7;
            margin: 0 0 1.1rem;
            max-width: 900px;
        }
.lead-stats {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 6px;
        }

        .lead-stat {
            background: var(--primary-dark); border: none; border-radius: var(--radius-lg);
            padding: 22px 18px;
        }

        .lead-stat-num {
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: clamp(28px, 2.6vw, 42px);
            color: #00b858; margin-bottom: 5px;
        }

        .lead-stat-label {
            font-size: 14px;
            color: rgba(255,255,255,0.88); line-height: 1.4;
        }
        .lead-stat-note { display:block; font-size: 12px; color: rgba(255,255,255,0.70); margin-top: 4px; }




        /* Hover: big-number stat boxes lift slightly */
        .lead-stat{
            transition: transform 180ms ease, box-shadow 180ms ease;
            will-change: transform;
        }
        .lead-stat:hover{
            transform: translateY(-6px);
        }

        /* Our Science: icon highlight on hover for the 4 science points */
        #our-science .science-point i{
            transition: color 160ms ease, transform 160ms ease, filter 160ms ease;
        }
        #our-science .science-point:hover i{
            color: #00b858; /* same green as big numbers */
            filter: drop-shadow(0 0 10px rgba(0,184,88,0.35));
            transform: translateY(-1px);
        }

        .lead-science-foot {
            margin-top: 20px;
            padding-top: 16px;
            border-top: 1px solid rgba(26, 58, 82, 0.14);
            display: flex;
            align-items: flex-start;
            gap: 10px;
            color: var(--primary-dark);
            font-size: 14px;
            line-height: 1.55;
        }

        .lead-science-foot i {
            font-size: 17px;
            margin-top: 2px;
        }

        @media (max-width: 1000px) {
            .lead-grid {
                grid-template-columns: 1fr;
            }
        }

        @media (max-width: 900px) {
            .lead-section {
                padding: 90px 24px 110px;
            }

            .lead-overview p {
                font-size: 16px;
            }

            .lead-stats {
                grid-template-columns: 1fr;
            }
        }


/* Clinical Trials page (styled to match Lead Candidate conventions) */
.page-clinical .trials-section{
    min-height: auto;
}

.trials-intro{
    max-width: 980px;
    margin: 34px auto 0;
    padding: 34px 34px;
    border-left: 6px solid transparent;
    transition: border-left-color .25s ease;
}
.trials-intro p{
    color: var(--text-grey);
    font-size: 17px;
    line-height: 1.75;
    margin: 0;
}


.trials-intro:hover,
.lead-header:hover + .trials-intro{
    border-left-color: var(--primary-dark);
}

/* Disable hover effects on the Clinical Trials intro card when shown inside For Patients */
#patients-caregivers #clinical-trials .trials-intro:hover,
#patients-caregivers #clinical-trials .lead-header:hover + .trials-intro{
    border-left-color: transparent;
}
#patients-caregivers #clinical-trials .trials-intro.card:hover{
    transform: none;
    box-shadow: none;
    border-color: #EFF4F8;
}

/* Patients & Caregivers */
.patients-section .lead-container{
  max-width: 1200px;
}

/* For Patients: match Home About "pill" label and spacing */
#patients-caregivers .section-label{
  display: inline-block;
  margin-bottom: 22px; /* more space before intro paragraph */
}
.patients-intro{
  max-width: 980px;
}

#patients-caregivers p.patients-intro{
  font-size: 1.3em; /* +30% */
  line-height: 1.65;
  margin-bottom: 30px;
}

/* If .patients-intro is ever a wrapper again, keep consistent */
#patients-caregivers .patients-intro{
  font-size: inherit;
  margin-bottom: 30px;
}
.patients-media-card{
  max-width: 980px;
  margin: 26px auto 0;
  padding: 0;
  border-radius: var(--radius-xl);
}
.patients-media-card img{
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--radius-xl);
}
.patients-faq{
  max-width: 980px;
  margin: 34px auto 0;
  background: rgba(232, 244, 248, 0.55);
  border: 1px solid rgba(26, 58, 82, 0.10);
  border-radius: var(--radius-xl);
  padding: 28px 26px;
}
.patients-faq__title{
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-size: 20px;
  color: var(--primary-dark);
  letter-spacing: -0.01em;
  margin: 0 0 16px;
}
.faq-item{
  background: var(--white);
  border: 1px solid #EFF4F8;
  border-radius: var(--radius-lg);
  padding: 0;
  margin: 14px 0;
  overflow: hidden;
  transition: box-shadow .25s ease, transform .25s ease;
}
.faq-item:hover{
  transform: translateY(-4px);
  box-shadow: 0 20px 50px rgba(26, 58, 82, 0.08);
}
.faq-item summary{
  list-style: none;
  cursor: pointer;
  padding: 16px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: 17px;
  color: var(--primary-dark);
}
.faq-item summary::-webkit-details-marker{
  display: none;
}
.faq-item summary::after{
  content: "+";
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-size: 24px;
  color: rgba(26, 58, 82, 0.75);
  flex: 0 0 auto;
  transition: transform .2s ease;
}
.faq-item[open] summary::after{
  content: "–";
}
.faq-answer{
  padding: 0 22px 20px;
}
.faq-answer p{
  margin: 0;
  font-size: 16px;
  line-height: 1.7;
  color: var(--text-grey);
}
.patients-faq__cta{
  margin-top: 22px;
  display: flex;
  justify-content: center;
}
.patients-faq__cta .btn-primary{
  justify-content: center;
}
.trials-programs{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
    margin-top: 36px;
    align-items: stretch;
}

.trial-card{
    padding: 34px 34px;
    border-radius: var(--radius-xl);
    min-height: 320px;
    position: relative;
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.trial-card:hover{
    transform: translateY(-4px);
}

.trial-card--green{
    background: linear-gradient(135deg, #009845 0%, #00873d 100%);
    color: #ffffff;
    border: 1px solid rgba(255,255,255,0.08);
    box-shadow: 0 25px 60px rgba(0,0,0,0.10);
}

.trial-card--blue{
    background: rgba(232, 244, 248, 0.95);
    color: var(--primary-dark);
    border: 1px solid rgba(26, 58, 82, 0.08);
    box-shadow: 0 20px 50px rgba(26, 58, 82, 0.06);
}

.trial-tag{
    display: inline-flex;
    align-items: center;
    padding: 6px 12px;
    border-radius: var(--radius-sm);
    font-size: 11px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 16px;
    background: rgba(255,255,255,0.22);
    color: #ffffff;
}

.trial-tag--blue{
    background: rgba(26, 58, 82, 0.10);
    color: var(--primary-dark);
}

.trial-title{
    font-family: 'Inter', sans-serif; font-weight: 700;
    font-size: clamp(20px, 1.5vw, 28px);
    line-height: 1.2;
    margin: 0 0 12px 0;
}

.trial-card--green .trial-title{color:#ffffff;}

.trial-meta{
    font-family: 'Inter', sans-serif; font-weight: 600;
    font-size: 15px;
    opacity: 0.92;
}

.trial-divider{
    height: 1px;
    width: 100%;
    background: rgba(255,255,255,0.30);
    margin: 22px 0 18px;
}
.trial-divider--blue{
    background: rgba(26, 58, 82, 0.12);
}

.trial-foot{
    font-size: 16px;
    line-height: 1.6;
    opacity: 0.95;
    max-width: 520px;
}

.trial-icon{
    position: absolute;
    top: 26px;
    right: 26px;
    font-size: 36px;
    opacity: 0.45;
}
.trial-icon--blue{
    opacity: 0.28;
    color: var(--primary-dark);
}

.trials-final{margin-top: 58px;}

.trials-action{
    display: flex;
    justify-content: center;
    margin-top: 34px;
}

.trials-btn{
    text-decoration: none;
}

.trials-quote{
    position: relative;
    text-align: center;
    margin-top: 58px;
}
.trials-quote-icon{
    font-size: 74.4px;
    color: rgba(232, 244, 248, 0.9);
    position: absolute;
    top: -40px;
    left: 50%;
    transform: translateX(-50%);
    pointer-events: none;
}
.trials-quote-text{
    font-family: 'Source Serif 4', Georgia, serif; font-weight: 400;
    font-size: clamp(22px, 1.8vw, 34px);
    color: var(--primary-dark);
    line-height: 1.45;
    max-width: 900px;
    margin: 0 auto;
}

.trials-timeline{
    margin-top: 56px;
    padding: 28px 28px 22px;
}
.trials-timeline-head{
    font-family: 'Inter', sans-serif; font-weight: 700;
    color: var(--primary-dark);
    font-size: 12px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 16px;
}
.trials-timeline-graphic{
    position: relative;
    width: 100%;
    max-width: 980px;
    height: 94px;
    margin: 0 auto 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.ttl-line{
    position: absolute;
    inset: 50% 0 auto 0;
    height: 2px;
    transform: translateY(-50%);
    background: linear-gradient(90deg, rgba(180,180,180,0.65) 0%, rgba(0,152,69,0.95) 60%, rgba(180,180,180,0.65) 100%);
}
.ttl-point{
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #ffffff;
    position: relative;
    z-index: 2;
    border: 3px solid #009845;
}
.ttl-point--navy{ border-color: var(--primary-dark); }
.ttl-point--green{ border-color: #009845; }
.ttl-point--grey{ border-color: #9aa6af; background: #e7e7e7; }
.ttl-point--filled{ background: rgba(232, 244, 248, 1); }

.ttl-label{
    position: absolute;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 14.4px;
    color: rgba(0,0,0,0.45);
    white-space: nowrap;
}


.ttl-sub{
    position:absolute;
    top: 24px;
    left:50%;
    transform: translateX(-50%);
    font-size: 12.5px;
    font-weight: 700;
    color: rgba(0,0,0,0.45);
    white-space: nowrap;
}
.ttl-sub--green{ color: #009845; }

.trials-timeline-note{
    text-align: center;
    font-size: 13px;
    color: rgba(0,0,0,0.52);
    font-style: italic;
}

@media (max-width: 1000px){
    .trials-programs{
        grid-template-columns: 1fr;
    }
    .trials-intro{
        margin-top: 18px;
        max-width: 100%;
    }
    .trial-card--blue{
        margin-top: 0;
    }
}



/* Patients: lift content up 100px */
#patients-caregivers .patients-section.lead-section{
  padding-top: 10px; /* 140px - 100px */
}

@media (min-width: 901px){
  /* Lift For Patients content (below hero + square) up on desktop */
  /* (forced to override any later padding/margin rules) */
  #patients-caregivers .patients-section.lead-section{
    padding-top: 0px;
    margin-top: -20px;
  }
}
@media (max-width: 900px){
  #patients-caregivers .patients-section.lead-section{
    padding-top: 0px; /* 90px - 90px */
  }
}
/* Our Science page (responsive, based on provided comp) */
        .page-science .science-section{
            min-height: auto;
            padding: 90px clamp(16px, 5vw, 120px);
            padding-top: calc(90px + var(--site-header-h));
            background: radial-gradient(circle at 50% 0%, #ffffff 0%, #f0f7fa 100%);
        }
        .science-container{
            max-width: 1400px;
            margin: 0 auto;
        }

        /* Our Science: match Home About typography + pill label */
        .page-science .science-section .section-label{
            display: inline-block;
            background: rgba(0, 152, 69, 0.10);
            color: var(--accent);
            padding: 0.5rem 1rem;
            border-radius: var(--radius-xl);
            font-size: 0.85rem;
            font-weight: 700;
            letter-spacing: 1px;
            text-transform: uppercase;
            margin-bottom: 1.5rem;
            border: 1px solid rgba(0, 152, 69, 0.18);
        }
        .page-science .science-section .section-title{
            font-size: clamp(2rem, 4vw, 3rem);
            font-weight: 800;
            color: var(--navy, var(--primary-dark));
            margin: 0 0 1.25rem;
            line-height: 1.2;
            letter-spacing: -0.02em;
        }
        .page-science .science-section .section-subtitle{
            font-size: 1.25rem;
            color: var(--navy, var(--gray-600));
            max-width: 900px;
            margin: 0 0 2.2rem;
            line-height: 1.7;
        }
        @media (max-width: 720px){
            .page-science .science-section .section-subtitle{ font-size: 1.08rem; margin-bottom: 1.8rem; }
        }
        /* Tuck the Our Science lead cards nicely into the existing grid */
        .page-science .science-section .science-lead-grid{
            margin-top: 0;
            gap: 18px;
        }

        .science-header-card{
            background: rgba(232, 244, 248, 0.85);
            border: 1px solid rgba(216, 232, 240, 0.9);
            border-radius: var(--radius-xl);
            padding: clamp(22px, 2.8vw, 40px);
            text-align: center;
            box-shadow: 0 10px 40px rgba(26, 58, 82, 0.05);
        }
        .science-eyebrow{
            display: inline-block;
            text-transform: uppercase;
            letter-spacing: 1.6px;
            font-size: 12px;
            color: rgba(0, 152, 69, 0.9);
            font-family: 'Inter', sans-serif; font-weight: 700;
            margin-bottom: 12px;
        }
        .science-title{
            margin: 0;
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: clamp(2rem, 4vw, 3rem);
            line-height: 1.08;
            color: var(--primary-dark);
            letter-spacing: -0.02em;
        }
        .science-subhead{
            margin: 12px auto 0;
            max-width: 900px;
            font-size: clamp(16px, 1.2vw, 20px);
            line-height: 1.65;
            color: rgba(10, 18, 26, 0.74);
        }

        .science-grid{
            margin-top: 26px;
            display: grid;
            grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
            gap: clamp(18px, 2.2vw, 28px);
            align-items: start;
        }

        .science-card{
            background: #fff;
            border-radius: var(--radius-xl);
            padding: clamp(22px, 2.4vw, 36px);
            box-shadow: 0 10px 40px rgba(26, 58, 82, 0.05);
        }

        .science-body{
            border-left: 6px solid rgba(216, 232, 240, 1);
        }
        .science-body p{
            font-size: clamp(16px, 1vw, 18px);
            line-height: 1.75;
            color: rgba(10, 18, 26, 0.82);
            margin: 0 0 16px;
        }
        .science-body p:last-child{ margin-bottom: 0; }
        .science-highlight{
            font-family: 'Inter', sans-serif; font-weight: 500;
            color: var(--accent);
        }

        .science-points{
            margin-top: clamp(14px, 1.8vw, 20px);
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 14px;
        }
        .science-point{
            background-color: var(--white);
            border: 1px solid #EFF4F8;
            border-radius: var(--radius-lg);
            padding: 28px 26px;
            transition: all 0.4s ease;
            position: relative;
            overflow: hidden;
            min-height: 110px;
        }
        .science-point:hover{
            transform: translateY(-10px);
            box-shadow: 0 20px 50px rgba(26, 58, 82, 0.08);
            border-color: transparent;
        }
        .science-point i{
            position: absolute;
            top: 18px;
            right: 18px;
            font-size: 28.8px;
            opacity: 0.18;
        }
        .science-point .science-point-text{
            font-family: 'Inter', sans-serif; font-weight: 500;
            font-size: clamp(14px, 0.9vw, 17px);
            line-height: 1.55;
            color: rgba(26, 58, 82, 0.92);
            padding-right: 34px;
        }

        .science-final{
            margin-top: clamp(14px, 1.8vw, 20px);
            background: rgba(216, 232, 240, 0.9);
            text-align: center;
            border-radius: var(--radius-sm);
            padding: clamp(16px, 2vw, 22px) clamp(18px, 2.2vw, 26px);
        }
        .science-final p{
            margin: 0;
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: clamp(16px, 1.2vw, 20px);
            line-height: 1.4;
            color: rgba(26, 58, 82, 0.95);
        }

        .science-media{
            display: grid;
            grid-template-columns: 1fr;
            gap: clamp(14px, 1.8vw, 18px);
        }
        .science-image-box{
            background: #fff;
            border-radius: var(--radius-xl);
            overflow: hidden;
            box-shadow: 0 10px 40px rgba(26, 58, 82, 0.05);
            border: 1px solid rgba(216, 232, 240, 0.6);
        }
        .science-image-box .science-image{
            width: 100%;
            height: clamp(220px, 20vw, 320px);
            object-fit: cover;
            display: block;
        }
        .science-image-box .science-caption{
            padding: 14px 16px 16px;
            font-size: 13px;
            line-height: 1.5;
            color: rgba(10, 18, 26, 0.68);
        }

        .science-note{
            margin-top: 14px;
            display: flex;
            gap: 10px;
            align-items: flex-start;
            background: rgba(255,255,255,0.85);
            border: 1px solid rgba(216, 232, 240, 0.7);
            border-radius: var(--radius-lg);
            padding: 11px 13px;
            color: rgba(10, 18, 26, 0.64);
            font-size: 13px;
            line-height: 1.5;
        }
        .science-note i{ color: var(--accent); }
        .science-flow{
            margin-top: 14px;
            background: rgba(255,255,255,0.85);
            border: 1px solid rgba(216, 232, 240, 0.7);
            border-radius: var(--radius-lg);
            padding: 12px 14px;
            overflow: hidden;
        }
        .science-flow-svg{
            width: 100%;
            min-width: 0;
            height: auto;
            display: block;
        }
        .science-flow-standalone{
            margin-top: 18px;
            background: rgba(255,255,255,0.85);
            border: 1px solid rgba(216, 232, 240, 0.7);
            border-radius: var(--radius-xl);
            padding: 16px 16px;
        }
        .science-flow-row{
            display: flex;
            align-items: center;
            justify-content: center;
            flex-wrap: wrap;
            gap: 14px;
        }
        .sf-step{
            width: clamp(150px, 18vw, 190px);
            aspect-ratio: 1 / 1;
            background: linear-gradient(135deg, rgba(232,244,248,0.92), rgba(255,255,255,0.92));
            border: 1px solid rgba(26,58,82,0.14);
            border-radius: var(--radius-lg); /* square footprint with consistent rounding */
            box-shadow: 0 18px 34px rgba(26,58,82,0.10);
            padding: 16px 14px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            text-align: center;
            gap: 8px;
        }
        /* Mechanism flow graphic: text-first (no icons) */
        .sf-icon{
            display: none;
        }
        .sf-icon svg{
            width: 38px;
            height: 38px;
            stroke: currentColor;
            stroke-width: 2.2;
            fill: none;
            stroke-linecap: round;
            stroke-linejoin: round;
        }
        .sf-icon--accent{ color: #009845; }
        .sf-title{
            font-size: 20px;
            font-weight: 800;
            color: #1A3A52;
            line-height: 1.15;
        }
        .sf-sub{
            font-size: 16px;
            font-weight: 600;
            color: rgba(26,58,82,0.72);
            line-height: 1.15;
        }
        .sf-arrow{
            color: rgba(26,58,82,0.72);
            flex: 0 0 auto;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }
        .sf-arrow--accent{ color: #009845; }
        .sf-arrow-svg{
            width: 54px;
            height: 18px;
            display: block;
        }
        .sf-arrow-svg line{
            stroke: currentColor;
            stroke-width: 2.6;
            stroke-linecap: round;
        }
        .sf-arrow-svg polygon{
            fill: currentColor;
        }
        @media (max-width: 760px){
            .sf-arrow{ display:none; }
            .sf-step{ width: min(220px, 92%); }
            .science-flow-row{ gap: 12px; }
        }



        @media (max-width: 1024px){
            .science-grid{ grid-template-columns: 1fr; }
            .science-points{ grid-template-columns: 1fr; }
            .science-image-box .science-image{ height: 280px; }
        }

        @media (max-width: 640px){
            .page-science .science-section{ padding: 70px 16px;
            padding-top: max(0px, calc(70px - var(--site-header-h)));
        }
            .science-image-box .science-image{ height: 240px; }
            .science-final{ border-radius: var(--radius-xl); } /* pill becomes card on very small screens */
        }
nav a.is-current,
        .mobile-menu__links a.is-current {
            color: var(--accent);
        }

        /* Ensure the molecule image never disappears on small screens */
        @media (max-width: 900px) {
            .innovation-image { height: 320px; }
        }
        @media (max-width: 640px) {
            .innovation-image { height: 280px; }
        }

.footer-email-link{
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Our Team: keep photos flush-left with text (prevents centered images at mid breakpoints) */
#our-team .team-photo-card{
  justify-content: flex-start;
}

/* Divider between bios in Our Team */
#our-team .team-photo-strip .team-photo-card + .team-photo-card{
  border-top: 1px solid rgba(14, 46, 68, 0.12);
  margin-top: 20px;
  padding-top: 20px;
}
#our-team .team-photo{
  margin: 0;
  align-self: flex-start;
}


/* Our Science: navy feature pills (science-point cards) */
#our-science .science-point{
  background: #0E2E44;
  border-color: rgba(255,255,255,0.14);
}
#our-science .science-point:hover{
  box-shadow: 0 22px 52px rgba(12,33,56,0.24);
  border-color: rgba(255,255,255,0.22);
}
#our-science .science-point i{
  color: rgba(255,255,255,0.55);
  opacity: 1;
}
#our-science .science-point-text{
  color: rgba(255,255,255,0.95);
}

/* Our Science: mechanism diagram — circular nodes instead of rounded squares */
#our-science .science-flow-standalone .sf-step{
  border-radius: 999px;
}


        /* Pipeline page */
        .pipeline-section .lead-container { max-width: 1200px; }
        .pipeline-intro {
            width: 100%;
            max-width: none;
            margin: 26px 0 36px;
            padding: 34px 34px;
            background: var(--primary-light);
            border-color: rgba(26, 58, 82, 0.06);
        }
        .pipeline-intro p {
            margin: 0;
            color: #2B2B2B;
            font-size: clamp(16px, 1vw, 18px);
            line-height: 1.75;
            font-family: 'Inter', sans-serif; font-weight: 500;
        }

        .pipeline-chart {
            width: 100%;
            max-width: none;
            margin: 0;
            padding: 34px 34px;
        }

        .pipeline-chart.card:hover {
            transform: none;
            box-shadow: none;
            border-color: #EFF4F8;
        }

        /* Scale the entire Pipeline chart as a single unit (desktop/tablet only). */
        .chart-scale {
            position: relative;
            width: 100%;
            margin: 0 0 50px;
            overflow: hidden;
        }
        .chart-scale__inner {
            position: absolute;
            top: 0;
            left: 0;
            transform-origin: top left;
            will-change: transform;
        }
        /* Ensure the chart card itself doesn't contribute margins inside the absolute layer. */
        .chart-scale .pipeline-chart {
            margin: 0;
        }

        @media (max-width: 900px) {
            .chart-scale {
                height: auto !important;
                overflow: visible;
                margin: 0 0 50px;
            }
            .chart-scale__inner {
                position: relative;
                transform: none !important;
                width: auto !important;
            }
        }


        .pipeline-chart__headers,
        .pipeline-chart__row {
            display: grid;
            grid-template-columns: 22% 28% 25% 25%;
            gap: 6px;
            align-items: center;
        }

        .pipeline-chart__headers {
            padding: 0 6px 14px;
            margin: 0 0 18px;
            border-bottom: 1px solid rgba(26, 58, 82, 0.10);
        }

        .pipeline-chart__h {
            display: flex;
            align-items: center;
            gap: 10px;
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: 14.4px;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            color: rgba(26, 58, 82, 0.72);
            white-space: nowrap;
        }

        .pipeline-chart__rows {
            display: flex;
            flex-direction: column;
            gap: 16px;
        }

        .pipeline-chart__row {
            border-radius: var(--radius-xl);
            padding: 22px 24px;
            min-height: 104px;
            box-shadow: 0 12px 34px rgba(0, 0, 0, 0.04);
            border: 1px solid rgba(26, 58, 82, 0.06);
            position: relative;
            overflow: hidden;
                    transition: transform 0.25s ease, box-shadow 0.25s ease;
        }


        .pipeline-chart__row:hover {
            transform: translateY(-2px);
            box-shadow: 0 18px 44px rgba(26, 58, 82, 0.10);
        }

        .pipeline-chart__row--green {
            background: var(--accent);
            color: #FFFFFF;
            border-color: rgba(255, 255, 255, 0.18);
        }

        .pipeline-chart__row--blue {
            background: var(--primary-light);
            color: var(--primary-dark);
        }

        .pipeline-chart__label {
            display: none;
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: 13.2px;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            opacity: 0.65;
            margin-bottom: 4px;
        }

        .pipeline-chart__value {
            font-family: 'Inter', sans-serif; font-weight: 500;
            font-size: clamp(19.2px, 1.3vw, 26.4px);
            line-height: 1.25;
        }

        .pipeline-chart__program {
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: clamp(21.6px, 1.45vw, 28.8px);
            line-height: 1.15;
        }

        .pipeline-chart__stage {
            display: flex;
            align-items: center;
            gap: 12px;
            flex-wrap: wrap;
        }

        .pipeline-chart__dot {
            width: 11px;
            height: 11px;
            border-radius: 50%;
            flex: 0 0 11px;
        }

        .pipeline-chart__row--green .pipeline-chart__dot {
            background: #FFFFFF;
            box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.28);
        }

        .pipeline-chart__row--blue .pipeline-chart__dot {
            background: var(--accent);
            box-shadow: 0 0 0 4px rgba(0, 152, 69, 0.16);
        }

        .pipeline-chart__badge {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 7px 14px;
            border-radius: var(--radius-sm);
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: 14.4px;
            letter-spacing: 0.02em;
            white-space: nowrap;
        }

        .pipeline-chart__row--green .pipeline-chart__badge {
            background: rgba(255, 255, 255, 0.18);
            color: #FFFFFF;
        }

        .pipeline-chart__row--blue .pipeline-chart__badge {
            background: #FFFFFF;
            color: var(--accent);
            border: 1px solid rgba(0, 152, 69, 0.14);
        }

        .pipeline-chart__row--green::before {
            content: '';
            position: absolute;
            right: -60px;
            top: -60px;
            width: 320px;
            height: 320px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(255,255,255,0.10) 0%, rgba(255,255,255,0) 68%);
            pointer-events: none;
        }

        @media (max-width: 900px) {
            .pipeline-chart { padding: 22px 18px; }

            .pipeline-chart__headers { display: none; }

            .pipeline-chart__headers,
            .pipeline-chart__row {
                grid-template-columns: 1fr;
                gap: 10px;
            }

            .pipeline-chart__row { padding: 18px 18px; min-height: 0; }

            .pipeline-chart__label { display: block; }

            .pipeline-chart__stage { justify-content: flex-start; }
        }

        .pipeline-list {
            display: flex;
            flex-direction: column;
            gap: 6px;
            width: 100%;
        }

        .pipeline-row {
            display: grid;
            grid-template-columns: 1.25fr 0.95fr 1.15fr 0.85fr;
            align-items: center;
            gap: 6px;
            padding: 26px 34px;
            border-radius: var(--radius-sm);
            border: 1px solid rgba(26, 58, 82, 0.06);
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.03);
            transition: transform 0.25s ease, box-shadow 0.25s ease;
        }
        .pipeline-row:hover {
            transform: scale(1.01);
            box-shadow: 0 14px 30px rgba(0, 0, 0, 0.06);
            z-index: 2;
        }

        .pipeline-name { font-family: 'Inter', sans-serif; font-weight: 700; font-size: clamp(21.6px, 1.6vw, 33.6px); }
        .pipeline-disease { font-size: clamp(18px, 1.1vw, 21.6px); opacity: 0.92; }
        .pipeline-type { font-size: clamp(16.8px, 1.05vw, 20.4px); opacity: 0.9; font-style: italic; }
        .pipeline-stage {
            display: inline-flex;
            align-items: center;
            justify-content: flex-end;
            gap: 10px;
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: 16.8px;
            letter-spacing: 0.6px;
            text-transform: uppercase;
            white-space: nowrap;
        }
        .pipeline-stage-note {
            font-size: 14.4px;
            letter-spacing: 0.2px;
            text-transform: none;
            opacity: 0.85;
            font-weight: 500;
        }
        .pipeline-stage-note--muted { color: rgba(255,255,255,0.85); }
        .pipeline-dot {
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background: currentColor;
            opacity: 0.55;
        }
        .pipeline-dot--accent { background: var(--accent); opacity: 1; }

        .pipeline-row--accent { background: var(--accent); color: #fff; border-color: rgba(255,255,255,0.18); }
        .pipeline-row--accent .pipeline-dot { background: #fff; opacity: 0.9; }
        .pipeline-row--accent2 { background: #1A7B5A; color: #fff; border-color: rgba(255,255,255,0.18); }
        .pipeline-row--accent2 .pipeline-dot { background: #fff; opacity: 0.9; }
        .pipeline-row--accent3 { background: #3A985E; color: #fff; border-color: rgba(255,255,255,0.18); }
        .pipeline-row--accent3 .pipeline-dot { background: #fff; opacity: 0.9; }
        .pipeline-row--light { background: var(--primary-light); color: var(--primary-dark); }
        .pipeline-row--light .pipeline-dot { background: var(--accent); opacity: 1; }
        .pipeline-row--light .pipeline-type { color: #5A7080; opacity: 1; }

        .pipeline-final {
            margin-top: 70px;
            background: var(--primary-dark);
            color: #fff;
            border-radius: var(--radius-sm);
            padding: 28px 42px;
            text-align: center;
            box-shadow: 0 20px 50px rgba(26, 58, 82, 0.18);
        }
        .pipeline-final h2 {
            margin: 0;
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-size: clamp(26.4px, 2vw, 40.8px);
            letter-spacing: 0.2px;
        }

        
        .pipeline-mechanism {margin-top: 26px;
            padding: 7.5%;
            aspect-ratio: 1 / 1;
            overflow: hidden;background:#fff;}
        .pipeline-mechanism svg {
            width: 100%;
            height: 100%;
            display: block;
        }
        .pipeline-mechanism__caption {
            margin-top: 12px;
            font-family: 'Inter', sans-serif; font-weight: 500;
            color: var(--text-grey);
            font-size: 16.8px;
            line-height: 1.4;
            text-align: center;
        }
@media (max-width: 900px) {
            .pipeline-intro { margin-left: 0; margin-right: 0; }
            .pipeline-row {
                grid-template-columns: 1fr;
                gap: 10px;
                border-radius: var(--radius-xl);
                padding: 20px 18px;
            }
            .pipeline-stage { justify-content: flex-start; white-space: normal; }
            .pipeline-stage-note--muted { color: rgba(255,255,255,0.9); }
        }

    
/* pipeline-mechanism hover handled by centralized .card--static rule */

/* Override: do not lift the chart container on hover; only nodes lift */
.sbpm-card:hover,
.sbpm-container:hover,
.shared-mechanism-card:hover,
.pipeline-mechanism-card:hover {
  transform: none;
  box-shadow: inherit;
}
/* --- Our Team (scoped) --- */
#our-team .team-layout{
  padding: clamp(80px, 10vw, 140px) clamp(20px, 8vw, 120px);
  background: linear-gradient(135deg, #FFFFFF 0%, #F0F7FA 100%);
}
@media (max-width: 900px){
  #our-team .team-layout{ padding: 90px 24px 110px; }
}

#our-team .team-subsection{ margin-top: 44px; }
#our-team .lt,
#our-team .lt *{
  box-sizing: border-box;
}

#our-team .lt{
  position: relative;
  width: 100%;
  color: #333;
  overflow: hidden;
  font-family: 'Inter', sans-serif; font-weight: 400;
}

/* Decorative circles */
#our-team .lt .deco-circle{
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(26, 58, 82, 0.06);
  z-index: 0;
}
#our-team .lt .deco-1{ top: -140px; left: -160px; width: 520px; height: 520px; }
#our-team .lt .deco-2{ bottom: 160px; right: -80px; width: 360px; height: 360px; border-color: rgba(0, 152, 69, 0.08); }
#our-team .lt .deco-3{ top: 44%; left: 18%; width: 96px; height: 96px; background: rgba(232, 244, 248, 0.9); border: none; }

#our-team .lt .container{
  position: relative;
  z-index: 1;
  max-width: 1200px;
  margin: 0 auto;
}

/* Header */
#our-team .lt .header-section{
  margin-bottom: 26px;
}
#our-team .lt .page-title{
  display: inline-block;
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-size: 12px;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--primary-dark);
  background: #E8F4F8;
  padding: 8px 18px;
  border-radius: var(--radius-sm);
  border: 1px solid rgba(26,58,82,0.08);
  box-shadow: 0 10px 30px rgba(26, 58, 82, 0.06);
  margin-bottom: 16px;
}
#our-team .lt .headline{
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-size: clamp(32px, 3.2vw, 52px);
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--primary-dark);
  margin: 0;
  max-width: 900px;
}

/* Intro text: match Lead Candidate behavior */
#our-team .lt .team-intro{
  margin-top: 26px;
  max-width: 980px;
}
#our-team .lt .team-intro.lead-overview p{
  font-size: 17px;
  line-height: 1.75;
}
@media (max-width: 900px){
  #our-team .lt .team-intro.lead-overview p{ font-size: 16px; }
}

/* Grid */
#our-team .lt .organic-grid{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 22px;
  margin-top: 40px;
  margin-bottom: 60px;
  align-items: stretch;
}

/* Card tuning (scoped; prevents global “giant” feel) */
#our-team .lt .organic-grid .card{
  border-radius: var(--radius-xl);
  padding: 32px 28px;
  box-shadow: 0 15px 40px rgba(26, 58, 82, 0.08);
}
#our-team .lt .organic-grid .card:hover{
  transform: translateY(-8px);
}

/* Variants */
#our-team .lt .card-green{ background: #009845; color: #fff; border-color: transparent; }
#our-team .lt .card-dark-green{ background: #1A7B5A; color: #fff; border-color: transparent; }
#our-team .lt .card-light-blue{ background: #E8F4F8; color: #1A3A52; }
#our-team .lt .card-green .card-title,
#our-team .lt .card-green .card-desc,
#our-team .lt .card-dark-green .card-title,
#our-team .lt .card-dark-green .card-desc{ color: #fff; }

/* Photo cards */
#our-team .lt .card-photo{
  padding: 0 !important;
  overflow: hidden;
  aspect-ratio: 1 / 1;
}
#our-team .lt .card-photo img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
#our-team .lt .card-photo{
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
#our-team .lt .card-photo img,
#our-team .lt .card-photo .photo-caption{
  display: none !important;
}
#our-team .lt .item-jay-photo{ background-image: url('images/team01.png'); }
#our-team .lt .item-sub-photo{ background-image: url('images/team02.png'); }
#our-team .lt .item-mark-photo{ background-image: url('images/team03.png'); }

#our-team .lt .photo-caption{
  position: absolute;
  bottom: 14px;
  left: 14px;
  background: rgba(255,255,255,0.92);
  padding: 8px 14px;
  border-radius: var(--radius-sm);
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-size: 15.6px;
  color: var(--primary-dark);
  backdrop-filter: blur(6px);
  max-width: calc(100% - 28px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Typography inside cards */
#our-team .lt .card-title{
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-size: 20px;
  margin: 8px 0 8px;
  line-height: 1.25;
}
#our-team .lt .card-subtitle{
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: 11px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  opacity: 0.85;
  margin-bottom: 6px;
}
#our-team .lt .card-desc{
  font-size: 15px;
  line-height: 1.65;
  opacity: 0.95;
}

/* Pill tag */
#our-team .lt .pill-tag{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  border-radius: var(--radius-sm);
  font-size: 14.4px;
  font-family: 'Inter', sans-serif; font-weight: 500;
  background: rgba(255,255,255,0.18);
  border: 1px solid rgba(255,255,255,0.22);
  width: fit-content;
}
#our-team .lt .card-light-blue .pill-tag{
  background: rgba(26,58,82,0.08);
  border-color: rgba(26,58,82,0.10);
}

/* Grid placement (desktop) */
#our-team .lt .item-jay-photo{ grid-column: span 3; }
#our-team .lt .item-jay-bio{ grid-column: span 5; }
#our-team .lt .item-filler-1{ grid-column: span 4; background: transparent; box-shadow: none; padding: 0; border: none; }

#our-team .lt .item-sub-bio{ grid-column: span 5; }
#our-team .lt .item-sub-photo{ grid-column: span 3; }

#our-team .lt .item-mark-photo{ grid-column: span 3; }
#our-team .lt .item-mark-bio{ grid-column: span 5; }

#our-team .lt .item-gary{ grid-column: span 4; }
#our-team .lt .item-kush{ grid-column: span 4; }

/* Advisors + quote */
#our-team .lt .advisors-title{
  grid-column: 1 / -1;
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-size: 26px;
  color: var(--primary-dark);
  margin-top: 16px;
  margin-bottom: 4px;
  padding-left: 12px;
  border-left: 6px solid #009845;
  line-height: 1.15;
}
#our-team .lt .advisor-card{
  background: #1A7B5A;
  color: #fff;
  border-color: transparent;
  min-height: 180px;
}
#our-team .lt .adv-1,
#our-team .lt .adv-2,
#our-team .lt .adv-3{ grid-column: span 4; }
#our-team .lt .adv-4,
#our-team .lt .adv-5{ grid-column: span 6; background: #3A985E; }

#our-team .lt .quote-container{
  grid-column: 1 / -1;
  background: #009845;
  color: #fff;
  padding: 46px 44px;
  border-radius: var(--radius-xl);
  text-align: center;
  margin-top: 8px;
}
#our-team .lt .quote-icon{ font-size: 42px; opacity: 0.28; margin-bottom: 12px; }
#our-team .lt .quote-text{
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-size: clamp(20px, 1.8vw, 30px);
  line-height: 1.3;
  margin-bottom: 14px;
}
#our-team .lt .quote-author{
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: 14px;
  opacity: 0.9;
}

/* Responsive behavior: no overlaps, no off-canvas */
@media (max-width: 1024px){
  #our-team .lt .organic-grid{ grid-template-columns: repeat(6, 1fr); }
  #our-team .lt .item-jay-photo{ grid-column: span 3; }
  #our-team .lt .item-jay-bio{ grid-column: span 3; }
  #our-team .lt .item-filler-1{ grid-column: span 6; }

  #our-team .lt .item-sub-bio{ grid-column: span 3; }
  #our-team .lt .item-sub-photo{ grid-column: span 3; }

  #our-team .lt .item-mark-photo{ grid-column: span 3; }
  #our-team .lt .item-mark-bio{ grid-column: span 3; }

  #our-team .lt .item-gary{ grid-column: span 3; }
  #our-team .lt .item-kush{ grid-column: span 3; }

  #our-team .lt .adv-1,
  #our-team .lt .adv-2,
  #our-team .lt .adv-3{ grid-column: span 6; }
  #our-team .lt .adv-4,
  #our-team .lt .adv-5{ grid-column: span 6; }
}

@media (max-width: 720px){
  /* Mobile: 2 equal columns, square cards */
  #our-team .lt .organic-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }

  /* Remove any desktop spans/placements */
  #our-team .lt .organic-grid > *{
    grid-column: auto / span 1 !important;
  }

  #our-team .lt .item-filler-1{ display: none; }

  /* Square cards + safe internal layout */
  #our-team .lt .organic-grid .card{
    padding: 16px 14px;
    border-radius: var(--radius-xl);
    aspect-ratio: 1 / 1;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
  }

  /* Photos should fill square */
  #our-team .lt .card-photo{
    padding: 0 !important;
    aspect-ratio: 1 / 1;
    position: relative;
  }
  #our-team .lt .card-photo img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  #our-team .lt .photo-caption{
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 12px;
    margin: 0 !important;
    display: inline-flex;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 24px);
  }

  /* Typography safety (override inline sizes) */
  #our-team .lt .pill-tag{
    font-size: 13.2px !important;
    padding: 6px 10px !important;
    border-radius: 999px !important;
  }
  #our-team .lt .card-title{
    font-size: 21.6px !important;
    line-height: 1.15 !important;
  }
  #our-team .lt .card-desc{
    font-size: 15.6px !important;
    line-height: 1.35 !important;
    opacity: 0.92;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
  }

  /* Decorative quote marks/icons: smaller */
  #our-team .lt .float-shape{ font-size: 55.2px !important; opacity: 0.08 !important; }
}


/* Partnerships map */
#partnerships .partnerships-map{
  margin-top: 28px;
  border-radius: var(--radius-xl);
  background: rgba(255,255,255,0.62);
  padding: 18px 18px 8px;
  box-shadow: var(--shadow-soft);
  overflow: hidden;
}
#partnerships .partnerships-map svg{ width:100%; height:auto; display:block; }
#partnerships .partnerships-map svg *{ fill: rgba(12,45,63,0.18) !important; }
@media (max-width: 720px){
  #partnerships .partnerships-map{ padding: 14px 14px 6px; border-radius: var(--radius-lg); }
}

/* --- Home About section (from client reference; Inter in global font stack) --- */
.home-about {
  padding: clamp(48px, 6vw, 90px) 2rem;
  max-width: var(--max-width, 1200px);
  margin: 0 auto;
  background: linear-gradient(135deg, var(--gray-50, #F7FAFC) 0%, #ffffff 100%);
}

.home-about .section-label {
  display: inline-block;
  background: rgba(0, 152, 69, 0.10);
  color: var(--accent);
  padding: 0.5rem 1rem;
  border-radius: var(--radius-xl);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 1.5rem;
  border: 1px solid rgba(0, 152, 69, 0.18);
}

.home-about .section-title {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  color: var(--navy, var(--primary-dark));
  margin-bottom: 1.5rem;
  line-height: 1.2;
  letter-spacing: -0.02em;
}


        /* About mini icons above headline (from client style cues) */
        #about .about-miniicons{
            display:flex;
            gap:12px;
            align-items:center;
            margin: 18px 0 14px;
        }
        #about .about-miniicon{
            width:44px;
            height:44px;
            border-radius: var(--radius-md);
            background: rgba(255,255,255,0.9);
            border: 1px solid rgba(12,33,56,0.10);
            display:flex;
            align-items:center;
            justify-content:center;
            box-shadow: 0 10px 26px rgba(0,0,0,0.06);
            transition: transform 0.25s ease, box-shadow 0.25s ease;
        }
        #about .about-miniicon i{
            font-size: 24px;
            color: var(--navy, var(--primary-dark));
            opacity: 0.92;
        }
        #about .about-miniicon:hover{
            transform: translateY(-3px);
            box-shadow: 0 16px 34px rgba(0,0,0,0.10);
        }

        /* Make About headline weight match hero H1 */
        #about .about-title-hero{
            font-family: 'Inter', sans-serif; font-weight: 700;
            font-weight: 900;
        }
.home-about .section-subtitle {
  font-size: 1.25rem;
  color: var(--navy, var(--gray-600));
  max-width: 900px;
  margin-bottom: 3rem;
  line-height: 1.7;
}

.home-about .about-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 2rem;
  margin-top: 0;
}

.home-about .about-card {
  background: #ffffff;
  padding: 2rem;
  border-radius: var(--radius-md);
  border: 1px solid rgba(0, 0, 0, 0.08);
  transition: transform 0.3s, box-shadow 0.3s, border-color 0.3s;
}

.home-about .about-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.10);
  border-color: var(--accent);
}

.home-about .about-icon {
  width: 48px;
  height: 48px;
  background: var(--accent);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5rem;
  box-shadow: 0 10px 18px rgba(0, 148, 67, 0.18);
}

.home-about .about-icon i {
  font-size: 1.35rem;
  color: #ffffff;
  line-height: 1;
}

.home-about .about-card h3 {
  font-size: 1.25rem;
  font-weight: 900;
  font-family: 'Inter', sans-serif; font-weight: 700;
  color: var(--navy, var(--primary-dark));
  margin-bottom: 1rem;
  letter-spacing: -0.01em;
}
.home-about .about-card p {
  color: var(--navy, var(--gray-600));
  line-height: 1.7;
}

@media (max-width: 640px) {
  .home-about { padding: 3.5rem 1.25rem; }
  .home-about .section-subtitle { font-size: 1.05rem; }
  .home-about .about-card { padding: 1.5rem; }
}


}




/* --- Our Science: About-style intro tweaks (match Home About) --- */
#our-science{ --os-content-shift: 0px; }

#our-science .science-about{
  /* tighter top spacing now that the intro title block is removed */
  padding-top: clamp(12px, 2.2vw, 22px);
  margin-top: var(--os-content-shift);
}

/* Our Science: make About-style headlines match Home About weight */
#our-science .about-title-hero{
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-weight: 900;
}




.science-pipeline-intro{
  /* Pipeline block below divider, aligned to page gutters */
  margin: 0 auto 0;
  padding: clamp(22px, 3.5vw, 48px) 2rem;
  max-width: var(--max-width, 1200px);
  background: linear-gradient(135deg, var(--gray-50, #F7FAFC) 0%, #ffffff 100%);
}
@media (max-width: 899px){
  .science-pipeline-intro{
    margin-top: clamp(18px, 5vw, 32px);
    padding: clamp(38px, 7vw, 72px) 1.25rem;
  }
}
/* Our Science: make Pipeline intro block match Home "About" layout + appear as its own block */
#our-science .science-about--pipeline{
  /* lift Pipeline block (and everything below) up by ~2x the pill label height */
  margin-top: max(0px, calc(clamp(56px, 6vw, 120px) - 64px));
}
#our-science .science-pipeline-intro{
  margin-top: clamp(24px, 4vw, 56px);
}
#our-science .science-pipeline-intro .section-title{
  margin-bottom: 1rem;
}
#our-science .science-pipeline-intro .section-subtitle{
  margin-bottom: 0;
  max-width: 980px;
}


/* Pipeline body copy (inserted before table) */
#our-science .science-pipeline-intro .pipeline-body-card{
  margin-top: clamp(18px, 3vw, 32px);
  background: #ffffff;
  border: 1px solid rgba(10, 33, 55, 0.10);
  border-radius: var(--radius-lg);
  padding: clamp(18px, 2.5vw, 28px);
  box-shadow: 0 20px 60px rgba(5, 22, 40, 0.10);
}
#our-science .science-pipeline-intro .pipeline-body-card p{
  margin: 0 0 14px;
  color: #0E2E44;
  font-size: clamp(0.98rem, 1.2vw, 1.06rem);
  line-height: 1.65;
}
#our-science .science-pipeline-intro .pipeline-body-card p:last-child{
  margin-bottom: 0;
}
@media (max-width: 899px){
  #our-science .science-pipeline-intro .pipeline-body-card{
    border-radius: var(--radius-lg);
    padding: 16px 16px;
  }
  #our-science .science-pipeline-intro .pipeline-body-card p{
    font-size: 0.98rem;
  }
}
/* Our Science: Pipeline intro as its own Home-About block */
#our-science .science-about--pipeline{
  /* match Home About padding/margins */
  padding: clamp(48px, 6vw, 90px) 2rem;
  max-width: var(--max-width, 1200px);
  margin: 0 auto;
  background: linear-gradient(135deg, var(--gray-50, #F7FAFC) 0%, #ffffff 100%);
}
#our-science .section-title--heavy{
  font-weight: 800;
}
.section-title--superbold{
  /* visually thicker on fonts that lack heavier weights */
  text-shadow: 0.5px 0 0 currentColor, -0.5px 0 0 currentColor, 0 0.5px 0 currentColor, 0 -0.5px 0 currentColor;
}
#pipeline .lead-title--heavy{
  font-weight: 900;
}
/* Our Science: pull content up on desktop to remove excessive white gap under the shorter hero */
@media (min-width: 900px){
  /* Lift Our Science content up on desktop to remove the large white gap under the shorter hero */
  #our-science{ --os-content-shift: calc(var(--site-header-h) * -1); }
  #our-science .science-about{
    margin-top: var(--os-content-shift);
    padding-top: 10px; /* keep a bit of breathing room under the floating box */
  }
}

@media (max-width: 899px){
  /* Mobile: keep content close to hero (no overlap, no huge gap) */
  #our-science{ --os-content-shift: calc(var(--site-header-h) * 0.35); }
  #our-science .science-about{
    margin-top: var(--os-content-shift);
    padding-top: 10px;
  }
}

/* Soft divider for stacking more content below */
.section-divider{
  height: 1px;
  background: rgba(12,33,56,0.10);
  max-width: var(--max-width, 1200px);
  width: calc(100% - 4rem); /* match section gutters */
  margin: clamp(18px, 2.2vw, 28px) auto clamp(14px, 2vw, 22px);
}
@media (max-width: 560px){
  .section-divider{
    width: calc(100% - 2.5rem); /* match mobile gutters */
  }
}

/* Our Science: tighten vertical whitespace above Pipeline block */
#our-science .science-pipeline-intro{
  margin-top: clamp(12px, 2vw, 24px);
  padding-top: clamp(28px, 3vw, 48px);
}
@media (max-width: 899px){
  #our-science .science-pipeline-intro{
    margin-top: clamp(10px, 3vw, 18px);
    padding-top: clamp(22px, 5vw, 36px);
  }
}

/* --- Imported from client: Investors + Market --- */
.safety-note i {
  color: var(--success);
  font-size: 1.5rem;
  flex-shrink: 0;
}

.safety-note p {
  margin: 0;
  font-size: 1.05rem;
}

/* Market Opportunity */
.market {
  background: white;
}

/* Market Opportunity (Investors cards layout) */
#investors .market-grid,
#for-investors .market-grid{
  display: grid;
  gap: 2rem;
  margin-top: 3rem;
  grid-template-columns: 1fr; /* stacked (mobile) */
}

/* Tablet / small desktop: 2x2 grid (2 columns) */
@media (min-width: 720px){
  #investors .market-grid,
  #for-investors .market-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Desktop: horizontal row (3 columns) */
@media (min-width: 1100px){
  #investors .market-grid,
  #for-investors .market-grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* For Investors: tighten gap below the 3rd market card */
#for-investors .market-grid{ margin-bottom: 10px; }

.inv-cta-row{
  margin-top: 3.25rem;
}

.inv-learnmore-btn{
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: 'Inter', sans-serif; font-weight: 700;
}

.inv-learnmore-btn:hover{
  background: var(--navy);
  border-color: var(--navy);
  color: #fff;
}


.market-card {
  background: var(--gray-50, #F7FAFC);
  padding: 2rem;
  border-radius: var(--radius-md);
  border: 1px solid rgba(0, 0, 0, 0.08);
  transition: all 0.3s;
}

.market-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.1);
  border-color: var(--accent);
}

.market-icon {
  width: 48px;
  height: 48px;
  background: linear-gradient(135deg, var(--accent) 0%, var(--primary-blue) 100%);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5rem;
}

.market-icon i {
  font-size: 1.5rem;
  color: white;
}

.market-card .data {
  font-size: 2rem;
  font-weight: 800;
  color: var(--accent);
  margin-bottom: 0.5rem;
}

.market-card h3 {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--primary-dark);
  margin-bottom: 1rem;
}

.market-card p {
  color: var(--gray-600);
  line-height: 1.6;
}

/* Team */
.team {
  background: linear-gradient(135deg, var(--gray-50, #F7FAFC) 0%, #ffffff 100%);
}

.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 2.5rem;
  margin-top: 3rem;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}

.team-member {
  text-align: center;
}

.team-photo {
  width: 140px;
  height: 140px;
  border-radius: 50%;
  background: var(--gray-100);
  margin: 0 auto 1.5rem;
  border: 4px solid var(--accent);
  overflow: hidden;
}

.t

/* Investors Section */
.investors {
  background: #f8fcfe;
  padding: 0;
}

.investors-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: clamp(60px, 6vw, 96px) 2rem clamp(180px, 12vw, 240px);
}
#investors-page .investors-inner{
  margin-top:-20px;
}




/* FOR INVESTORS: tighten vertical spacing + ensure headline weight */
#investors-page .investors-inner,
#investors .investors-inner{
  /* reduce top padding by 20px to lift content under the hero */
  padding-top: calc(clamp(60px, 6vw, 96px) - 30px) !important;
  margin-top: 0 !important;
}
#investors-page .section-title,
#investors .section-title{
  font-weight: 800 !important;
}

/* FOR INVESTORS: remove any bottom decorative image blocks if present */
#investors-page .inv-bottom-image,
#investors-page .investors-bottom-image,
#investors-page .investors-illustration,
#investors-page .investors-diagram,
#investors-page .investors-graphic,
#investors-page .hero-square,
#investors-page img.solution-diagram{
  display: none !important;
}

/* Override: keep hero-square visible on For Investors page */
#investors-page .hero-square{ display:block !important; }

/* FOR INVESTORS PAGE: show the floating hero square image */
#for-investors .hero-square{ display:block !important; }
/* For Investors — contact form */
#for-investors .investor-contact{
  max-width: 1200px;
  margin: -22px auto 0;
  padding: 18px 2rem 0;
  border-top: 1px solid rgba(14,46,68,.10);
}

#for-investors .investor-contact__intro{
  max-width: 920px;
  margin: 0 0 18px 0;
  color: #3a4b57;
  line-height: 1.6;
}

#for-investors .investor-form{ max-width: 980px; }

#for-investors .if-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px 16px;
}

#for-investors .if-field label{
  display:block;
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #506371;
  margin: 0 0 6px 0;
}

#for-investors .if-field input{
  width: 100%;
  padding: 12px 12px;
  border: 1px solid rgba(14,46,68,.14);
  border-radius: var(--radius-md);
  background: #fff;
  outline: none;
}

#for-investors .if-field select{
  width: 100%;
  padding: 12px 12px;
  border: 1px solid rgba(14,46,68,.14);
  border-radius: var(--radius-md);
  background: #fff;
  outline: none;
  appearance: none;
}

#for-investors .if-field select:focus{
  border-color: rgba(0,184,88,.65);
  box-shadow: 0 0 0 3px rgba(0,184,88,.12);
}

#for-investors .if-field input:focus{
  border-color: rgba(0,184,88,.65);
  box-shadow: 0 0 0 3px rgba(0,184,88,.12);
}

#for-investors .if-span2{ grid-column: span 2; }

#for-investors .if-checks{
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px 14px;
  padding: 10px 12px;
  border: 1px solid rgba(14,46,68,.10);
  border-radius: var(--radius-md);
  background: rgba(243,248,252,.70);
}

#for-investors .if-check{
  display:flex;
  gap: 8px;
  align-items:center;
  font-size: 14px;
  color: #1e2d36;
  text-transform: none;
  letter-spacing: 0;
}

#for-investors .if-other{
  grid-column: span 2;
  margin-top: 2px;
  background: #fff;
}

#for-investors .if-actions{
  display:flex;
  gap: 14px;
  align-items:center;
  margin-top: 16px;
}

#for-investors .if-note{
  margin: 0;
  font-size: 13px;
  color: #5a6b78;
}

#for-investors .if-status{
  margin-top: 10px;
  font-size: 14px;
}

@media (max-width: 720px){
  #for-investors .investor-contact{ padding: 18px 1.25rem 0; }
  #for-investors .if-grid{ grid-template-columns: 1fr; }
  #for-investors .if-span2{ grid-column: auto; }
  #for-investors .if-checks{ grid-template-columns: 1fr; }
  #for-investors .if-other{ grid-column: auto; }
  #for-investors .if-actions{ flex-direction: column; align-items:flex-start; }
}
  #for-investors .if-span2{ grid-column: auto; }
  #for-investors .if-checks{ grid-template-columns: 1fr; }
  #for-investors .if-other{ grid-column: auto; }
  #for-investors .if-actions{ flex-direction: column; align-items:flex-start; }
}
.inv-top{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:10px;
}
.inv-pill-wrap{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}

.inv-label{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0.55rem 1.05rem;
  border-radius:999px;
  background:rgba(0,148,67,0.14);
  border:1px solid rgba(0,148,67,0.35);
  color:#009443;
  font-family: 'Inter', sans-serif; font-weight: 800;
  font-size:0.85rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  line-height:1;
  white-space:nowrap;
  width:fit-content;
}

.inv-pill{
  display:block;
  margin-top:1.2em;
  margin-bottom:10px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:rgba(10,26,36,0.78);
  font-family: 'Inter', sans-serif; font-weight: 800;
  font-size:0.72rem;
  letter-spacing:0.10em;
  text-transform:uppercase;
  line-height:1.2;
}


.inv-title{
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-weight:700;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height:1.08;
  color:var(--navy);
  letter-spacing:-0.02em;
  margin:14px 0 10px;
}


.inv-title span {
  color: var(--accent);
}

.inv-subtitle {
  font-size: 1.25rem;
  color: var(--gray-600);
  margin-bottom: 3rem;
  line-height: 1.7;
}

.inv-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 2rem;
  margin-bottom: 3rem;
}

.inv-stat {
  background: white;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: var(--radius-md);
  padding: 2rem;
  text-align: center;
  transition: all 0.3s;
}

.inv-stat:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
}

.inv-stat-num {
  font-size: 2.5rem;
  font-weight: 800;
  color: var(--accent);
  margin-bottom: 0.5rem;
}

.inv-stat-label {
  font-size: 0.95rem;
  color: var(--gray-600);
  font-weight: 600;
}

.inv-ctas {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}

.inv-footnote {
  font-size: 0.95rem;
  color: var(--gray-600);
  max-width: 700px;
}

.inv-footnote strong {
  color: var(--primary-dark);
}
/* --- End import --- */

/* --- Headline weight tweaks (Investors) --- */
#investors .inv-title{
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-weight:700;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height:1.08;
  color:var(--primary-dark);
  letter-spacing:-0.02em;
  margin:14px 0 10px;
}
#investors .section-title{
  font-weight: 900 !important;
}
#investors .market-card .data{
  font-weight: 900 !important;
}
#investors .market-card h3{
  font-weight: 800 !important;
}


/* --- Bold headline treatment for Investors block (Inter uses font-weight instead) --- */
#investors .investors-hero-title,
#investors .section-title,
#investors .market-card .data,
#investors .market-card h3{
  font-family: 'Inter', sans-serif !important; font-weight: 700 !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em;
}



/* Hero overlay square (image panel) */
.hero{
    /* Reserve space for the portion of the square that sits below the hero */
    margin-bottom: clamp(120px, 12vw, 180px);
}
.hero-square{
    position: absolute;
    z-index: 6;
    left: clamp(20px, 6vw, 84px);
    bottom: 0;
    width: clamp(260px, 32vw, 520px);
    aspect-ratio: 1 / 1;
    background-color: #0E2E44;
    
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: clamp(22px, 2.7vw, 44px);
    box-shadow: 0 22px 60px rgba(0,0,0,.18);
    transform: translateY(25%); /* 25% of box height sticks out below the hero */
}


/* Our Science: shorter hero banner + different floating box image */
#our-science .hero.hero--short{
    height: 450px; /* 2x shorter than default 900px */
    margin-bottom: clamp(180px, 14vw, 240px); /* push content lower on desktop */
}
#our-science .hero-square{
    

    transform: translateY(18%); /* lift the box higher (desktop/tablet) */
}

/* For Patients: hero banner + floating box image */
#patients-caregivers .hero.hero--short{
    height: 450px; /* match Our Science short hero */
    margin-bottom: clamp(180px, 14vw, 240px);
}
#our-team .hero.hero--short{
    height: 450px; /* match Our Science short hero */
    margin-bottom: clamp(180px, 14vw, 240px);
}
#for-investors .hero.hero--short{
    height: 450px; /* match Our Science short hero */
    margin-bottom: clamp(180px, 14vw, 240px);
}

@media (max-width: 1024px){
    #our-team .hero.hero--short{ height: 410px; }
    #for-investors .hero.hero--short{ height: 410px; }
}
@media (max-width: 640px){
    /* Match Our Science mobile behavior (banner media height + square alignment) */
    #our-team .hero.hero--short,
    #for-investors .hero.hero--short{
        --os-hero-media-h: max(180px, min(31vh, 260px));
        margin-bottom: 0;
    }
    #our-team .hero.hero--short .hero-carousel,
    #for-investors .hero.hero--short .hero-carousel{
        height: var(--os-hero-media-h);
        min-height: 180px;
    }
    #our-team .hero.hero--short .hero-square,
    #for-investors .hero.hero--short .hero-square{
        top: var(--os-hero-media-h);
        bottom: auto;
        transform: translateY(-60%);
    }
}

#patients-caregivers .hero-square{
    
    transform: translateY(18%);
}
#for-investors .hero-square{
    
    transform: translateY(18%);

}

#our-team .hero-square{
    
    transform: translateY(18%);

}

@media (max-width: 1024px){
    #patients-caregivers .hero.hero--short{ height: 410px; }
}
@media (max-width: 640px){
    /* Match Our Science mobile behavior (banner media height + square alignment) */
    #patients-caregivers .hero.hero--short{
        --os-hero-media-h: max(180px, min(31vh, 260px));
    }
    #patients-caregivers .hero.hero--short .hero-carousel{
        height: var(--os-hero-media-h);
        min-height: 180px;
    }
    #patients-caregivers .hero.hero--short .hero-square{
        top: var(--os-hero-media-h);
        bottom: auto;
        transform: translateY(-60%);
    }
    /* Let the square overlap the section below (same as Our Science) */
    #patients-caregivers .hero.hero--short{
        margin-bottom: 0;
    }
}
@media (max-width: 1024px){
    #our-science .hero.hero--short{ height: 410px; } /* 2x shorter than 820px */
}
@media (max-width: 640px){
    /* Keep same behavior as Home hero, but reduce banner photo height */
    #our-science .hero.hero--short{
        --os-hero-media-h: max(180px, min(31vh, 260px));
    }
    #our-science .hero.hero--short .hero-carousel{
        height: var(--os-hero-media-h);
        min-height: 180px;
    }
    /* Our Science (mobile): align square box center to bottom of the banner media */
    #our-science .hero.hero--short .hero-square{
        top: var(--os-hero-media-h);
        bottom: auto;
        transform: translateY(-60%);
    }
    /* Mobile (Our Science): let the square overlap the section below by 25% of its own height */
    #our-science .hero.hero--short{
        margin-bottom: 0;
    }
}

/* Home: Lead Candidate block (inserted between Our Science and For Investors) */
.client-lead-candidate{
  background: linear-gradient(135deg, var(--gray-50, #F7FAFC) 0%, #ffffff 100%);
  max-width: var(--max-width, 1200px);
  margin: 0 auto;
  padding: clamp(48px, 6vw, 90px) 2rem;
}
.client-lead-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 22px;
  margin-top: 36px;
}
.client-lead-card{
  padding: 26px 26px 24px;
}
.client-lead-card h3{
  margin: 6px 0 10px;
  font-size: 24px;
  font-weight: 700;
  color: var(--primary);
}
.client-lead-card p{
  margin: 0;
  color: var(--gray-600);
  line-height: 1.6;
}



/* Home: Patients & Caregivers block */
.client-patients{
  background: #fff;
  max-width: var(--max-width, 1200px);
  margin: 0 auto;
  padding: clamp(48px, 6vw, 90px) 2rem;
}
.client-patients-content{
  margin-top: 28px;
  max-width: 980px;
}
.client-patients-subhead{
  margin: 28px 0 8px;
  font-size: clamp(20px, 1.7vw, 28px);
  font-weight: 700;
  color: var(--primary);
  letter-spacing: -0.02em;
}
.client-patients-subhead:first-child{
  margin-top: 10px;
}
.client-patients-body{
  margin: 0;
  color: var(--gray-600);
  line-height: 1.75;
  font-size: 17px;
}
.client-patients-btn{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 28px;
  padding: 15px 28px;
  border-radius: var(--radius-md);
  font-size: 17px;
  font-weight: 700;
}



/* Global type scale — 100% = 16px browser default; keeps rem-based values accurate */
html{font-size:100%;}

/* Subheads: match head weight */
h3,
.science-title,
.lead-title,
.client-patients-subhead{
  font-weight: 900;
}



/* Home Our Science: mechanism steps as square tiles */
.client-mechanism-steps{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: 18px;
}
.client-step{
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(0, 152, 69, 0.14);
  border-radius: var(--radius-lg);
  padding: 18px 18px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  aspect-ratio: 1 / 1;
  box-shadow: 0 10px 24px rgba(10, 18, 26, 0.06);
}
.client-step-number{
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 18px;
}
.client-step-content h4{
  margin: 4px 0 0;
  font-weight: 900;
  color: var(--primary-dark);
  letter-spacing: -0.01em;
}
.client-step-content p{
  margin: 0;
  color: rgba(10, 18, 26, 0.74);
  line-height: 1.55;
  font-size: 16px;
}




/* Our Science: 2x2 tiles as one square block + CTA below (no overlap) */
.client-mechanism-steps{
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-rows: 1fr;
  gap: 6px;
  align-items: stretch;
  width: 100%;
  max-width: 760px;
  margin: 18px auto 0;
  aspect-ratio: 1 / 1;
}
.client-step{
  height: 100%;
  min-width: 0;
  overflow: hidden;
  position: relative;
  margin: 0;
}
/* keep the badge + text inside the tile without causing layout overflow */
.client-step-content h4{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.client-step-content p{
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.client-mechanism-cta{
  width: 100%;
  max-width: 760px;
  margin: 18px auto 0;
}
.client-mechanism-cta .client-learn-more-btn{
  margin: 0;
  display: inline-flex;
}


/* Our Science tiles: uniform responsive type within square */
.client-mechanism-steps{
  --tileTitle: clamp(14px, 1.2vw, 18px);
  --tileBody: clamp(12px, 1.0vw, 16px);
  --tileBadge: clamp(14px, 1.1vw, 18px);
  --tileBadgeSize: clamp(34px, 2.6vw, 44px);
  --tilePad: clamp(12px, 1.6vw, 18px);
}
.client-step{
  padding: var(--tilePad) !important;
}
.client-step-number{
  width: var(--tileBadgeSize) !important;
  height: var(--tileBadgeSize) !important;
  font-size: var(--tileBadge) !important;
}
.client-step-content h4{
  font-size: var(--tileTitle) !important;
}
.client-step-content p{
  font-size: var(--tileBody) !important;
}



/* Home Our Science: bottom CTA spacing */
.client-science-bottom-cta{
  margin-top: 34px;
  padding-top: 10px;
  padding-bottom: 10px;
}


/* Home Lead Candidate: bottom CTA spacing */
.client-lead-bottom-cta{
  margin-top: 34px;
  padding-top: 10px;
  padding-bottom: 10px;
}



/* Block header pills: dark navy outline + transparent fill (unified across sections) */
.section-label,
.client-section-label,
.inv-label{
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: 0.55rem 1.05rem !important;
  border-radius: 999px !important;
  background: #fff !important;
  border: 1px solid rgba(10, 26, 44, 0.30) !important;
  color: rgba(10, 26, 44, 0.78) !important;
  font-family: 'Inter', sans-serif !important; font-weight: 800 !important;
  font-size: 0.85rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
}


/* Market cards: align with shared card/icon styles */
.market-grid .card.client-lead-card .data{
  margin-top: 6px;
}


/* Market cards (Investors): keep data styling without overriding shared card/icon look */
/* For Investors: big, heavier headline numbers */
.market-grid .card .data{
  font-size: clamp(48px, 4.4vw, 76px);
  font-weight: 1000;
  font-family: 'Inter', sans-serif; font-weight: 800;
  color: var(--accent);
  margin: 6px 0 10px;
  letter-spacing: -0.035em;
  line-height: 0.93;
  text-shadow: 0 0.6px 0 currentColor;
}
.market-grid .card h3{
  margin-top: 0;
}


/* Home: unify section width (match Our Science) + consistent dividers */
.page#home > section:not(.hero){
  max-width: var(--max-width, 1200px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
  border-top: 1px solid rgba(0, 152, 69, 0.18);
}
.page#home > section:not(.hero):first-of-type{
  border-top: none;
}

/* Home: keep Investors content within the same section width */
.page#home > section.investors .investors-inner,
.page#home > section.investors .investors-content{
  width: 100%;
  max-width: 100%;
}




/* Home: All blocks share Our Science background */
.page#home > section:not(.hero){
  background: linear-gradient(180deg, rgba(0,152,69,0.04) 0%, rgba(0,152,69,0.00) 60%);
}


/* Patients block: heavier subheadlines */
.client-patients-subhead,
.client-patients-content h3{
  font-weight: 950 !important;
  font-family: 'Inter', sans-serif !important; font-weight: 800 !important;
  letter-spacing: -0.015em;
  text-shadow: 0 0.4px 0 currentColor;
}


/* Unified green Learn More buttons (all instances) */
a.cta-btn-green{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 18px 34px !important;
  border-radius: var(--radius-md) !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  background: var(--accent) !important;
  color: #fff !important;
  border: 1px solid rgba(0,0,0,0) !important;
  box-shadow: 0 14px 28px rgba(0, 152, 69, 0.18) !important;
  transition: background 160ms ease, transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
}
a.cta-btn-green:hover{
  background: var(--primary) !important;
  color: #fff !important;
  opacity: 1 !important;
  visibility: visible !important;
}
a.cta-btn-green:active{
  background: var(--primary) !important;
  color: #fff !important;
  opacity: 1 !important;
}


/* Fix: ensure green CTA never disappears on hover (only bg changes to navy) */
.page a.cta-btn-green,
.page a.cta-btn-green:visited{
  display: inline-flex !important;
  position: relative !important;
  z-index: 2 !important;
  background-color: var(--accent) !important;
  background-image: none !important;
  background: var(--accent) !important;
  color: #fff !important;
  opacity: 1 !important;
  visibility: visible !important;
  box-shadow: 0 14px 28px rgba(0, 152, 69, 0.18) !important;
}
.page a.cta-btn-green:hover,
.page a.cta-btn-green:focus-visible{
  background-color: var(--primary-dark) !important;
  background-image: none !important;
  background: var(--primary-dark) !important;
  color: #fff !important;
  opacity: 1 !important;
  visibility: visible !important;
  box-shadow: 0 14px 28px rgba(10, 18, 26, 0.18) !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
}

/* Our Science: solution tiles fill content width and get corner diagrams (responsive scale) */
.client-mechanism-steps{
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

/* Step cards: reserve space for the corner image so text never overlaps */
.client-step{
  position: relative;
  --diagSize: clamp(120px, 14vw, 240px);
  --diagPad: 22px;
  padding-right: calc(var(--diagSize) + var(--diagPad));
  padding-bottom: calc(var(--diagSize) + var(--diagPad));
}

/* On smaller viewports, scale diagram to card size more aggressively */
@media (max-width: 820px){
  .client-step{
    --diagSize: clamp(96px, 24vw, 160px);
    --diagPad: 18px;
  }
}
@media (max-width: 520px){
  .client-step{
    --diagSize: clamp(84px, 30vw, 140px);
    --diagPad: 16px;
  }
}

/* Corner diagram (square) */
.client-step-diagram{
  position: absolute;
  right: var(--diagPad);
  bottom: var(--diagPad);
  width: var(--diagSize);
  height: var(--diagSize);
  object-fit: cover;
  border-radius: var(--radius-md);
  border: 1px solid rgba(0,0,0,0.07);
  background: #fff;
  box-shadow: 0 12px 26px rgba(10,18,26,0.10);
  pointer-events: none;
}

/* Our Science: single solution diagram (replaces 4 tiles) */
.solution-diagram-wrap{
  width: 100%;
  margin-top: 24px;
}
.solution-diagram{
  display: block;
  width: min(900px, 100%);
  margin: 0 auto;
  aspect-ratio: 1 / 1;
  height: auto;
  object-fit: contain;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  background: transparent !important;
}

/* For Investors standalone page: ensure content clears fixed header without adding hero/square */
#for-investors{
  padding-top: 0; /* body already offsets fixed header */
}
#for-investors .investors{
  margin-top: 0;
}


/* For Investors (standalone) — lift content below hero/square (v236)
   NOTE: this must live in the main page CSS (not inside the embedded SVG).
*/
#for-investors .investors-inner{
  /* baseline: lift content up without breaking mobile */
  padding-top: calc(clamp(56px, 7vw, 96px) - 80px) !important;
}

/* Desktop: lift more */
@media (min-width: 901px){
  #for-investors .investors-inner{
    padding-top: calc(clamp(56px, 7vw, 96px) - 260px) !important;
  }
}

/* Mobile: keep it readable */
@media (max-width: 720px){
  #for-investors .investors-inner{
    padding-top: calc(clamp(44px, 8vw, 80px) - 70px) !important;
  }
}

/* For Investors (standalone) — Partnerships layout fixes (v206)
   - Place benefit cards UNDER the overview text block
   - 4-across on desktop, 2x2 on tablet, stacked on mobile
   - Remove hover motion on the overview text block
*/
#for-investors .lead-grid{
  grid-template-columns: 1fr !important;
}

#for-investors .lead-benefits{
  grid-template-columns: 1fr;
  gap: 22px;
}

/* Tablet / small desktop: 2x2 */
@media (min-width: 720px){
  #for-investors .lead-benefits{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Desktop: 4 across */
@media (min-width: 1100px){
  #for-investors .lead-benefits{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* Remove hover state over the overview text block */
#for-investors .lead-overview{
  transition: none !important;
}
#for-investors .lead-overview:hover{
  transform: none !important;
  box-shadow: none !important;
  border-color: #EFF4F8 !important;
}

/* v211: Our Team spacing + remove blue circle */
#our-team .hero--short{
  margin-bottom: clamp(40px, 6vw, 80px) !important; /* pull section up closer to hero */
}
#our-team .team-layout{
  padding-top: clamp(40px, 6vw, 80px) !important;
}
/* remove decorative circles in Our Team */
#our-team .team-layout .deco-circle{ display:none; }

/* For Investors — light blue form container */
#for-investors .investor-form-wrap{
  background: rgba(14,46,68,.05);
  border: 1px solid rgba(14,46,68,.10);
  border-radius: var(--radius-xl);
  padding: 26px;
  margin-top: 0; /* outside spacing (tight to cards) */
}
@media (max-width: 720px){
  #for-investors .investor-form-wrap{ padding: 18px; }
}


/* Unify button font with Request Information button */
.btn, .btn-primary, .btn-secondary,
a.cta-btn-small, a.cta-btn-green, a.cta-btn-big,
.cta-btn-small, .cta-btn-green, .cta-btn-big{
  font-family: 'Inter', sans-serif !important; font-weight: 500 !important;
}



/* For Investors form: make "Request Information" match Learn More button styling (incl hover) */
#for-investors .investor-form .btn-primary{
  border-radius: var(--radius-sm) !important;
  padding: 0.75rem 1.5rem !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}
#for-investors .investor-form .btn-primary:hover,
#for-investors .investor-form .btn-primary:focus-visible{
  background-color: var(--primary-dark) !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Ensure all CTA/buttons use the same font as the "Request Information" button */
a.cta-btn,
a.cta-btn-small,
a.cta-btn-green,
button.btn,
.btn,
.btn-primary{
  font-family: 'Inter', sans-serif !important; font-weight: 500 !important;
}


/* Match "Request Information" button typography on all CTA buttons */
a.cta-btn-small, a.cta-btn-green, a.cta-btn-big,
.cta-btn-small, .cta-btn-green, .cta-btn-big,
nav a.cta-btn-small{
  font-family: 'Inter', sans-serif !important; font-weight: 500 !important;
  font-size: clamp(14.4px, 1vw, 19.2px) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}

/* Investor form thank-you modal */

/* Invisible hotspot (lower-right of investor form) for previewing thank-you modal */
#for-investors .investor-form{ position: relative; }
#for-investors .ty-preview-hotspot{
  position: absolute;
  right: 10px;
  bottom: 10px;
  width: 28px;
  height: 28px;
  opacity: 0;
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
  z-index: 5;
}

.thank-overlay{
  position:fixed;
  inset:0;
  background:rgba(255,255,255,.80);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9999;
}
.thank-overlay.is-open{ display:flex; }
.thank-modal{
  width:min(560px, calc(100% - 32px));
  background:#fff;
  border:1px solid rgba(14,46,68,.12);
  border-radius: var(--radius-lg);
  padding:22px 22px 18px;
  box-shadow:0 22px 70px rgba(14,46,68,.22);
  position:relative;
}
.thank-modal h3{
  margin:0 0 8px;
  color:var(--navy, #0E2E44);
  font-family: var(--font-sans, inherit);
  font-weight: 800;
  font-size: 22px;
}
.thank-modal p{
  margin:0;
  color:#3a4b57;
  line-height:1.6;
  font-size:14px;
}
.thank-close{
  position:absolute;
  top:10px;
  right:10px;
  width:38px;
  height:38px;
  border-radius: var(--radius-md);
  border:1px solid rgba(14,46,68,.14);
  background:rgba(14,46,68,.04);
  color:#0E2E44;
  cursor:pointer;
  font-size:22px;
  line-height:1;
}
.thank-close:hover{ background:rgba(14,46,68,.08); }

/* v250: For Investors — Why Now matches Phase 3 Ready headline */
#for-investors h2.section-title{
  font-family: 'Inter', sans-serif !important; font-weight: 700 !important;
  font-weight:700 !important;
  font-size: clamp(2rem, 4vw, 3rem) !important;
  line-height:1.08 !important;
  letter-spacing:-0.02em !important;
  color: var(--navy) !important;
}

/* v250: For Investors — remove hover states from Partnerships block (including text) */
#for-investors .lead-section .card,
#for-investors .lead-section .card *{
  transition:none !important;
}
#for-investors .lead-section .card:hover,
#for-investors .lead-section .card:hover *{
  transform:none !important;
  box-shadow: inherit !important;
  border-color: inherit !important;
  color: inherit !important;
}
#for-investors .lead-section a:hover{
  color: inherit !important;
  text-decoration: none !important;
}


/* v259: restore Partnerships (For Investors) paragraph + card hover styles */
#for-investors .lead-section .card{
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}
#for-investors .lead-overview{
  box-shadow: var(--shadow-soft) !important;
}
#for-investors .lead-overview:hover{
  transform: none !important;
  box-shadow: var(--shadow-soft) !important;
  border-color: rgba(14,46,68,.10) !important;
}

/* Restore hover on benefit cards (outer box only) */
#for-investors .lead-benefit:hover{
  transform: translateY(-6px) !important;
  box-shadow: 0 18px 46px rgba(26,58,82,0.14) !important;
  border-color: rgba(0,0,0,0) !important;
}
/* Ensure no text-shadow anywhere in cards on hover */
#for-investors .lead-benefit,
#for-investors .lead-benefit *{
  text-shadow: none;
}
/* White icon on hover (outer icon box) */
#for-investors .lead-benefit:hover .icon-box{
  background: var(--primary) !important;
}
#for-investors .lead-benefit:hover .icon-box i{
  color: #fff !important;
}

/* Remove forced hover-kill rules if present elsewhere by overriding */
#for-investors .lead-section .card:hover *{
  box-shadow: none !important;
}
#for-investors .lead-section a:hover{
  color: inherit !important;
  text-decoration: none !important;
}


/* ====== Overrides: Partnerships (For Investors) ====== */
/* remove left navy bracket on overview text box */
#for-investors .lead-overview,
#for-investors .lead-section .lead-overview{
  border-left: none !important;
  box-shadow: none !important;
}
/* ensure no hover effects on partnerships paragraph/overview */
#for-investors .lead-overview:hover,
#for-investors .lead-overview *:hover{
  transform:none !important;
  box-shadow:none !important;
  text-shadow: none;
}
/* cards: no outline/border, subtle shadow, jump on hover */
#for-investors .partner-card,
#for-investors .partner-cards .partner-card{
  border: none !important;
  outline: none !important;
  box-shadow: 0 10px 28px rgba(14,46,68,.10) !important;
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease !important;
}
#for-investors .partner-card:hover,
#for-investors .partner-cards .partner-card:hover{
  transform: translateY(-6px) !important;
  box-shadow: 0 18px 46px rgba(26,58,82,0.14) !important;
  border-color: rgba(0,0,0,0) !important;
}
/* kill any text-shadow effects on hover */
#for-investors .partner-card:hover *,
#for-investors .partner-cards .partner-card:hover *{
  text-shadow: none;
}
/* icon: green tile + white glyph on hover */
#for-investors .partner-card:hover .icon-box,
#for-investors .partner-cards .partner-card:hover .icon-box{
  background: #00B858 !important;
}
#for-investors .partner-card:hover .icon-box svg,
#for-investors .partner-card:hover .icon-box path,
#for-investors .partner-cards .partner-card:hover .icon-box svg,
#for-investors .partner-cards .partner-card:hover .icon-box path{
  stroke: #ffffff !important;
  fill: none !important;
}
#for-investors .partner-card:hover .icon-box .icon,
#for-investors .partner-cards .partner-card:hover .icon-box .icon{
  color: #ffffff !important;
}
/* remove focus outlines (mouse/keyboard) for these cards */
#for-investors .partner-card:focus,
#for-investors .partner-card:focus-visible,
#for-investors .partner-cards .partner-card:focus,
#for-investors .partner-cards .partner-card:focus-visible{
  outline: none !important;
  box-shadow: 0 18px 42px rgba(14,46,68,.18) !important;
}

/* Our Science: Upstream Intervention step cards (match About Us card style/hover) */
.solution-steps-grid{
  margin-top: 1.25rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2rem;
}
@media (max-width: 720px){
  .solution-steps-grid{ grid-template-columns: 1fr; gap: 1.25rem; }
}

/* === LOCKED LAYOUT: square tiles, badge TL, image TR (~1/2 square), text full-width under image (no wrap) === */
.solution-step-card{
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  padding: 18px;
  --stepPad: 18px;
  /* image about half of the square's inner area */
  --stepImg: min(260px, calc((100% - (var(--stepPad) * 2)) * 0.48));
}

/* Ensure no breakpoint ever rearranges internal layout */
.solution-step-card .solution-step-media{
  position: static;
  margin: 0;
  padding: 0;
  height: 0;
}

.solution-step-card .step-badge{
  position: absolute;
  top: var(--stepPad);
  right: var(--stepPad);
  width: 68px;
  height: 68px;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-size: 32px;
  line-height: 1;
  z-index: 3;
}

/* Image locked to upper-right */
.solution-step-card .step-img{
  position: absolute;
  top: var(--stepPad);
  left: var(--stepPad);
  width: var(--stepImg);
  height: var(--stepImg);
  border-radius: var(--radius-xl);
  background: rgba(14,46,68,0.06);
  overflow: hidden;
  z-index: 2;
}
.solution-step-card .step-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display:block;
}

/* Text locked under the image: full width (L->R with padding), never wraps on resize */
.solution-step-card .solution-step-copy{
  position: absolute;
  left: var(--stepPad);
  right: var(--stepPad);
  top: calc(var(--stepPad) + var(--stepImg) + 14px);
  bottom: var(--stepPad);
  margin: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.solution-step-card .solution-step-title,
.solution-step-card .solution-step-desc{
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  word-break: normal;
}
.solution-step-card .solution-step-title{
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-weight: 700;
  font-size: clamp(20px, 2.4vw, 28px);
  line-height: 1.15;
}
.solution-step-card .solution-step-desc{
  font-size: clamp(17px, 2.0vw, 22px);
  line-height: 1.25;
}

/* If the card gets extremely narrow, shrink image a touch rather than rearrange */
@media (max-width: 420px){
  .solution-step-card{ --stepImg: min(210px, calc((100% - (var(--stepPad) * 2)) * 0.52)); }
  .solution-step-card .solution-step-title{ font-size: clamp(17px, 4.3vw, 21px); }
  .solution-step-card .solution-step-desc{ font-size: clamp(15px, 4vw, 19px); }
}

/* === Clinical Development Milestones: bolder, subway-map style === */
/* Trials timeline: bigger & bolder, subway-map style */
.trials-timeline-graphic{
  height: 280px;           /* 2x taller */
  max-width: 920px;
  margin: 24px auto 0;
  display: flex;
  align-items: center;     /* centers the circles vertically */
  justify-content: space-between;
  position: relative;
}
.trials-timeline-graphic .ttl-line{
  position: absolute;
  left: calc(var(--ttl-dot) / 2);
  right: calc(var(--ttl-dot) / 2);
  top: 50%;
  transform: translateY(-50%);
  height: 10px;            /* thick subway line */
  border-radius: 999px;
  background: rgba(0,184,88,0.28);
}
.trials-timeline-graphic .ttl-point{
  position: relative;
  width: var(--ttl-dot);
  height: var(--ttl-dot);
  border-radius: 50%;
  border: 5px solid #009845;
  background: #fff;        /* hollow by default */
  box-shadow: 0 14px 28px rgba(0,0,0,0.12);
  z-index: 2;
}
.trials-timeline-graphic .ttl-point.ttl-point--filled{
  background: #009845;     /* filled dots */
  border-color: #009845;
}
.trials-timeline-graphic .ttl-point.ttl-point--grey{
  border-color: #A5B3BD;   /* approval is not filled */
  background: #fff;
}
.trials-timeline-graphic .ttl-label{
  position: absolute;
  left: 50%;
  top: -54px;              /* phase above dot */
  transform: translateX(-50%);
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #0E2E44;
  white-space: nowrap;
}
.trials-timeline-graphic .ttl-sub{
  position: absolute;
  left: 50%;
  top: 42px;               /* name below dot */
  transform: translateX(-50%);
  font-weight: 800;
  font-size: 14px;
  color: #009845;
  white-space: nowrap;
}

/* Tablet */
@media (max-width: 900px){
  .trials-timeline-graphic{ height: 240px; max-width: 640px; }
  .trials-timeline-graphic .ttl-line{ left: 6%; right: 6%; height: 10px; }
}
/* Mobile */
@media (max-width: 560px){
  .trials-timeline-graphic{ height: 210px; max-width: 360px; }
  .trials-timeline-graphic .ttl-label{ font-size: 13px; top: -50px; }
  .trials-timeline-graphic .ttl-sub{ font-size: 13px; top: 40px; }
}

Our Team: leadership bios layout (v214) --- */
#our-team .team-photo-strip{
  display:flex;
  flex-direction:column;
  gap: 116px;
  margin-top: 34px;
  max-width: 1100px;
  margin-left:auto;
  margin-right:auto;
}

#our-team .team-photo-card{
  display:flex;
  gap: 28px;
  align-items:flex-start;
  width:100%;
  padding: 12px 0;
}

#our-team .team-photo{
  width: clamp(150px, 18vw, 210px);
  flex: 0 0 clamp(150px, 18vw, 210px);
  aspect-ratio: 1 / 1;
  height: auto !important;
  border-radius: var(--radius-xl) !important;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: 0 18px 45px rgba(22, 62, 88, 0.10);
  position: relative; /* fallback square lock */
  overflow: hidden;
}
/* Fallback for browsers that ignore aspect-ratio */
#our-team .team-photo::before{
  content:"";
  display:block;
  padding-top:100%;
}

#our-team .team-text{
  flex:1;
  min-width: 0;
  padding-top: 6px;
}

#our-team .team-name{
  margin-top: 0;
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-size: 22px;
  line-height: 1.15;
  color: var(--primary-dark);
}

#our-team .team-title{
  margin-top: 8px;
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: 16px;
  line-height: 1.25;
  color: rgba(12,45,63,0.75);
}

#our-team .team-bio{
  margin-top: 14px;
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: 16px;
  line-height: 1.6;
  color: rgba(12,45,63,0.85);
}

#our-team .team-bio p{ margin: 0 0 12px; }
#our-team .team-bio p:last-child{ margin-bottom: 0; }

@media (max-width: 820px){
  #our-team .team-photo-card{
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    gap: 18px;
  }
  #our-team .team-photo{
    width: min(260px, 78vw);
    flex-basis: auto;
  }
  #our-team .team-text{
    padding-top: 0;
    max-width: 680px;
  }
}


@media (max-width: 720px){
  #our-team .team-photo-strip{ gap: 72px; }
  #our-team .team-photo-card{
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    gap: 14px;
  }
  #our-team .team-text{ text-align: left; }
  #our-team .team-photo{ margin: 0; }
  #our-team .team-name, #our-team .team-title{ text-align:left; }
}


/* --- Our Team: Scientific Advisors section align + margins (v218) --- */
#our-team .team-subsection{
  max-width: 1200px; /* match .container width so pill aligns with Leadership pill */
  margin: 64px auto 0;
  padding: 0; /* rely on .team-layout padding */
}
#our-team .team-subsection .section-header{
  display:flex;
  justify-content:flex-start;
  align-items:center;
  margin: 0 0 6px 0;
  padding: 0;
}
#our-team .team-subsection .section-label{
  margin-left: 0 !important;
  margin-right: 0 !important;
}
#our-team .team-photo-strip--advisors{
  margin-top: 26px;
}

@media (max-width: 720px){
  /* keep Scientific Advisors block left-justified like other content on mobile */
  #our-team .team-subsection{
    max-width: none;
    width: 100%;
    margin: 44px 0 0;
    padding: 0 clamp(16px, 5vw, 120px);
  }
}




/* =============================================================================
   HIDE OLD HERO-SQUARE (Replaced by .hero-content with real text)
   ============================================================================= */

.hero-square {
    display: none !important;
}

/* Hero-content display handled by final block below */


/* Make text scale as a unit to prevent reflow (like images did) */
/* Hero inner wrapper */
.hero-content-inner {
    width: 100%;
}

/* Ensure consistent sizing regardless of viewport */
.hero-content h1 {
    white-space: pre-line;  /* Preserve line breaks */
}


/* =============================================================================
   HERO CONTENT - Clean Final Version
   ============================================================================= */

/* Hide old hero-square */
.hero-square {
    display: none !important;
}

/* Hero box container — gradient screen over photo */
.hero-content {
    position: absolute;
    left: 0;
    bottom: 0;
    top: 0;
    width: clamp(340px, 40vw, 600px);
    max-width: 600px;
    background: linear-gradient(
        to right,
        rgba(14, 46, 68, 0.82) 0%,
        rgba(14, 46, 68, 0.55) 65%,
        rgba(14, 46, 68, 0.0) 100%
    );
    border-radius: 0;
    box-shadow: none;
    transform: none;
    padding: clamp(32px, 4vw, 56px) clamp(28px, 4vw, 56px);
    padding-right: clamp(48px, 6vw, 80px);
    z-index: 10;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}

/* No hard edge — the gradient IS the fade */
.hero-content::after {
    display: none;
}

/* Badge — FDA designation: prominent, institutional treatment */
.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255, 255, 255, 0.08);
    border: 1.5px solid rgba(255, 255, 255, 0.30);
    border-radius: var(--radius-sm);
    padding: 9px 16px;
    margin-bottom: 20px;
    font-family: 'Inter', sans-serif; font-weight: 700;
    font-size: clamp(10px, 0.9vw, 12px);
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.9);
}
.hero-badge::before {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--accent-light);
    box-shadow: 0 0 6px var(--accent-light);
    flex-shrink: 0;
}

/* Override dark blue from .hero h1 */
.hero .hero-content h1,
.hero-content h1 {
    font-family: 'Inter', sans-serif !important; font-weight: 700 !important;
    font-size: clamp(26px, 3vw, 42px) !important;
    line-height: 1.2 !important;
    color: #FFFFFF !important;
    background: none !important;
    -webkit-text-fill-color: #FFFFFF !important;
    margin: 0 0 14px 0 !important;
    text-shadow: none !important;
}

/* Tagline */
.hero-tagline {
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    font-size: clamp(14px, 1.3vw, 17px);
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.85);
    margin: 0 0 24px 0;
    padding-bottom: 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

/* Stats container - ALWAYS horizontal */
.hero-stats-home {
    display: flex;
    flex-direction: row;
    gap: 12px;
}

/* Stat bubbles */
.hero-stat-item {
    flex: 1;
    background: rgba(255, 255, 255, 0.08);
    border: 2px solid rgba(255, 255, 255, 0.15);
    border-radius: var(--radius-lg);
    padding: 16px 12px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100px;
}

/* Numbers - bright green */
.hero-stat-number {
    font-family: 'Inter', sans-serif; font-weight: 700;
    font-size: clamp(28px, 3vw, 36px);
    line-height: 1;
    color: #4FBF7A;
    margin-bottom: 6px;
    white-space: nowrap;
}

/* Labels */
.hero-stat-label {
    font-family: 'Inter', sans-serif; font-weight: 400;
    font-size: clamp(11px, 0.85vw, 13px);
    color: rgba(255, 255, 255, 0.88);
    line-height: 1.3;
}

/* Wider on large screens */
@media (min-width: 1200px) {
    .hero-content {
        width: clamp(480px, 36vw, 620px);
        max-width: 620px;
    }
    
    .hero .hero-content h1,
    .hero-content h1 {
        font-size: clamp(30px, 3.2vw, 46px) !important;
    }
}

/* Mobile positioning — narrower gradient, same treatment */
@media (max-width: 768px) {
    .hero-content {
        width: 100% !important;
        max-width: none !important;
        padding: 24px 20px !important;
        padding-right: 30% !important;
        left: 0 !important;
        top: 0 !important;
        bottom: 0 !important;
        transform: none !important;
        position: absolute !important;
        border-radius: 0 !important;
        background: linear-gradient(
            to right,
            rgba(14, 46, 68, 0.85) 0%,
            rgba(14, 46, 68, 0.55) 55%,
            rgba(14, 46, 68, 0.0) 100%
        ) !important;
        box-shadow: none !important;
    }
    .hero-content::after {
        display: none;
    }
    
    .hero {
        margin-bottom: 0 !important;
    }
    
    .hero-stats-home {
        flex-direction: column !important;
        gap: 8px !important;
    }
    
    .hero-stat-item {
        min-height: auto !important;
        padding: 10px 12px !important;
    }
}

/* Margin for content below */
.home-about,
.about.home-about {
    margin-top: clamp(48px, 6vw, 80px);
}


/* =============================================================================
   PAGE VISIBILITY FIX - Ensure pages show/hide properly
   ============================================================================= */

/* Hide all pages by default */
.page {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

/* Show only the active page */
.page.is-active {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}


/* =============================================================================
   PIPELINE TABLE
   ============================================================================= */

.science-pipeline-table {
    padding: 60px 20px;
    background: #fff;
}

.pipeline-table-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    overflow-x: auto;
}

.pipeline-table {
    width: 100%;
    border-collapse: collapse;
    background: white;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    border-radius: var(--radius-sm);
    overflow: hidden;
}

.pipeline-table thead {
    background: linear-gradient(135deg, #2A5A7A 0%, #1A3A52 100%);
}

.pipeline-table th {
    padding: 14px 18px;
    text-align: left;
    color: #FFFFFF;
    font-family: 'Inter', sans-serif; font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    border-bottom: 3px solid #00B858;
}

.pipeline-table tbody tr {
    border-bottom: 1px solid #E5E7EB;
    transition: background 0.2s ease;
}

.pipeline-table tbody tr:hover {
    background: #F9FAFB;
}

.pipeline-table tbody tr.highlight-row {
    background: #F0F9FF;
}

.pipeline-table tbody tr.highlight-row:hover {
    background: #E0F2FE;
}

.pipeline-table td {
    padding: 18px;
    font-family: 'Inter', sans-serif; font-weight: 400;
    font-size: 14px;
    color: #374151;
    vertical-align: top;
}

.pipeline-table td strong {
    color: #1A3A52;
    font-family: 'Inter', sans-serif; font-weight: 600;
}

.stage-badge {
    display: inline-block;
    padding: 6px 12px;
    margin: 2px 4px 2px 0;
    background: #E5E7EB;
    color: #374151;
    border-radius: var(--radius-lg);
    font-size: 13px;
    font-family: 'Inter', sans-serif; font-weight: 500;
    font-weight: 500;
    white-space: nowrap;
}

.stage-badge.stage-primary {
    background: #DBEAFE;
    color: #1E40AF;
    border: 1px solid #3B82F6;
}

.stage-badge.stage-success {
    background: #D1FAE5;
    color: #065F46;
    border: 1px solid #00B858;
}

/* Mobile responsive */
@media (max-width: 768px) {
    .pipeline-table {
        font-size: 14px;
    }
    
    .pipeline-table th,
    .pipeline-table td {
        padding: 12px 10px;
    }
    
    .stage-badge {
        font-size: 12px;
        padding: 4px 8px;
    }
}
