:root {
    --color-primary: #143C35;
    --color-primary-dark: #0D2A25;
    --color-accent: #B08D57;
    --color-accent-light: #E7D9BE;
}

#siteHeader {
    transition: box-shadow 0.3s ease, background-color 0.3s ease;
}
#siteNav {
    transition: padding-top 0.3s ease, padding-bottom 0.3s ease;
}
#siteLogoLink {
    transition: height 0.3s ease;
}
#siteLogo {
    transition: height 0.3s ease;
}

#siteHeader.is-scrolled {
    box-shadow: 0 10px 30px -10px rgba(13, 42, 37, 0.18);
}
#siteHeader.is-scrolled #siteNav {
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
}
#siteHeader.is-scrolled #siteLogoLink {
    height: 1.75rem;
}
#siteHeader.is-scrolled #siteLogo {
    height: 3rem; 
}

/* Shrink the menu text and CTA button padding when scrolled */
#siteHeader.is-scrolled #desktopNav {
    font-size: 0.875rem; /* Equivalent to text-sm */
}
#siteHeader.is-scrolled #strategyCallBtn {
    padding-top: 0.5rem;    /* py-2 (originally py-3) */
    padding-bottom: 0.5rem;
    padding-left: 1.25rem;  /* px-5 (originally px-6) */
    padding-right: 1.25rem;
}

@media (min-width: 1024px) {
    #siteHeader.is-scrolled #siteLogoLink {
        height: 2.5rem; 
    }
    #siteHeader.is-scrolled #siteLogo {
        height: 4.5rem; 
    }
}

body {
    font-family: 'Plus Jakarta Sans', sans-serif;
    scroll-behavior: smooth;
}

.gradient-bg {
    background: linear-gradient(135deg, #0D2A25 0%, #143C35 100%);
}

.text-gradient {
    background: linear-gradient(to right, #B08D57, #E7D9BE);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.cursor {
    display: inline-block;
    width: 4px;
    height: 1em;
    background-color: #B08D57;
    margin-left: 4px;
    animation: blink 0.8s infinite;
    vertical-align: middle;
}
@keyframes blink { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }

@keyframes float {
    0% { transform: translate(0px, 0px) rotate(0deg); }
    33% { transform: translate(30px, -50px) rotate(2deg); }
    66% { transform: translate(-20px, 20px) rotate(-1deg); }
    100% { transform: translate(0px, 0px) rotate(0deg); }
}
.animate-float { animation: float 15s ease-in-out infinite; }
.animate-float-delayed { animation: float 18s ease-in-out infinite reverse; animation-delay: 2s; }

.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 1s cubic-bezier(0.4, 0, 0.2, 1), transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}
.reveal.active { opacity: 1; transform: translateY(0); }

/* Mobile slide-in menu */
#mobileMenuPanel {
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
#mobileMenuBackdrop {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}
body.menu-open #mobileMenuPanel { transform: translateX(0); }
body.menu-open #mobileMenuBackdrop { opacity: 1; pointer-events: auto; }
body.menu-open { overflow: hidden; }

.calendar-day:hover:not(.disabled) { background-color: var(--color-accent); color: white; cursor: pointer; }
.calendar-day.selected { background-color: var(--color-primary); color: white; }
.time-slot:hover { border-color: var(--color-accent); color: var(--color-accent); }
.time-slot.selected { background-color: var(--color-accent); color: white; border-color: var(--color-accent); }

.loading-dots:after { content: '.'; animation: dots 1.5s steps(5, end) infinite; }
@keyframes dots { 0%, 20% { content: '.'; } 40% { content: '..'; } 60% { content: '...'; } 80%, 100% { content: ''; } }

.client-logo-track { animation: scroll-left 40s linear infinite; }
.client-logo-track:hover { animation-play-state: paused; }
@keyframes scroll-left { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.shine-card { position: relative; overflow: hidden; }
.shine-card::after {
    content: '';
    position: absolute;
    top: 0;
    left: -60%;
    width: 40%;
    height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,0.55), transparent);
    transform: skewX(-20deg);
    transition: left 0.8s ease;
    pointer-events: none;
    z-index: 5;
}
.shine-card:hover::after { left: 130%; }

@keyframes ekgBeatDraw {
    0%   { stroke-dashoffset: 1; }
    10%  { stroke-dashoffset: 0; }
    100% { stroke-dashoffset: 0; }
}
@keyframes ekgBeatFade {
    0%     { opacity: 1; }
    26%    { opacity: 1; }
    26.01% { opacity: 0; }
    100%   { opacity: 0; }
}
.ekg-beat-draw { stroke-dasharray: 1 1; animation: ekgBeatDraw 9s linear infinite backwards; }
.ekg-beat-fade { animation: ekgBeatFade 9s linear infinite backwards; }
.ekg-beat-1 { animation-delay: 0s; }
.ekg-beat-2 { animation-delay: 3s; }
.ekg-beat-3 { animation-delay: 6s; }

@keyframes pulseGlow { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
.heading-pulse { animation: pulseGlow 2.4s ease-in-out infinite; }

@keyframes pharmaFloat1 { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-18px) rotate(4deg); } }
@keyframes pharmaFloat2 { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(16px) rotate(-5deg); } }
@keyframes pharmaFloat3 { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-12px) rotate(-3deg); } }
@keyframes pharmaFloat4 { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(14px) rotate(5deg); } }
@keyframes pharmaFloat5 { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-15px) rotate(-4deg); } }
@keyframes pharmaFloat6 { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(13px) rotate(4deg); } }
.pharma-float-1 { animation: pharmaFloat1 6s ease-in-out infinite; }
.pharma-float-2 { animation: pharmaFloat2 7.5s ease-in-out infinite; animation-delay: .6s; }
.pharma-float-3 { animation: pharmaFloat3 5.5s ease-in-out infinite; animation-delay: 1.2s; }
.pharma-float-4 { animation: pharmaFloat4 8s ease-in-out infinite; animation-delay: .3s; }
.pharma-float-5 { animation: pharmaFloat5 6.8s ease-in-out infinite; animation-delay: .9s; }
.pharma-float-6 { animation: pharmaFloat6 7.2s ease-in-out infinite; animation-delay: 1.5s; }

@keyframes clientBob1 { 0%, 100% { transform: translateY(0) scale(1); }     50% { transform: translateY(-7px) scale(1.02); } }
@keyframes clientBob2 { 0%, 100% { transform: translateY(0) scale(1); }     50% { transform: translateY(-4px) scale(1.015); } }
@keyframes clientBob3 { 0%, 100% { transform: translateY(0) scale(1); }     50% { transform: translateY(-9px) scale(1.02); } }
@keyframes clientBob4 { 0%, 100% { transform: translateY(0) scale(1); }     50% { transform: translateY(-5px) scale(1.01); } }
@keyframes clientBob5 { 0%, 100% { transform: translateY(0) scale(1); }     50% { transform: translateY(-8px) scale(1.025); } }
@keyframes clientBob6 { 0%, 100% { transform: translateY(0) scale(1); }     50% { transform: translateY(-3px) scale(1.01); } }
.client-bob-1 { animation: clientBob1 3.6s ease-in-out infinite; }
.client-bob-2 { animation: clientBob2 4.8s ease-in-out infinite; animation-delay: .5s; }
.client-bob-3 { animation: clientBob3 4.1s ease-in-out infinite; animation-delay: 1.1s; }
.client-bob-4 { animation: clientBob4 5.4s ease-in-out infinite; animation-delay: .2s; }
.client-bob-5 { animation: clientBob5 3.9s ease-in-out infinite; animation-delay: .9s; }
.client-bob-6 { animation: clientBob6 5.0s ease-in-out infinite; animation-delay: 1.4s; }

#pagePreloader {
    opacity: 1;
    transition: opacity 0.4s ease;
}
#pagePreloader.loaded {
    opacity: 0;
    pointer-events: none;
}