* {
    font-size: 0.98em;
    font-family: "Inter", sans-serif;
    --main-text-color: #666666;
    --white-text-color: #ffffff;
    --alt-text-color: #a60a27;
    --alt2-text-color: #0A3873;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
}

a {
    text-decoration: none;
    color: var(--main-text-color) !important;
}

a:hover {
    text-decoration: none;
    color: var(--alt-text-color) !important;
}

.top-gradient {
    background-image: url('/images/top-gradient.png');
    background-attachment: scroll;
    background-repeat: no-repeat;
}

.nav-split {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    padding: 0.6rem 0;
}

.nav-split-left,
.nav-split-right {
    display: flex;
    flex-wrap: wrap;
}

.nav-logo {
    display: flex;
    align-items: center;
    padding: 0 1rem;
}

.top-nav > li > a {
    font-weight: bold;
    color: var(--white-text-color) !important;
}

.top-nav > li > a:hover {
    color: #cacaca !important;
}

.top-nav > li > a.active {
    font-weight: bold;
    color: var(--alt-text-color) !important;
}

a.btn-white {
    background-color: #ffffff;
    color: #333333;
}

a.nav-contact-btn {
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.4);
    border-radius: 4px;
    padding: 6px 16px !important;
    color: #ffffff !important;
    transition: background 0.15s ease;
}

a.nav-contact-btn:hover {
    background: rgba(255,255,255,0.28) !important;
    color: #ffffff !important;
}

span.emphasize {
    background-image: url('/images/underline-stroke.png');
    background-repeat: no-repeat;
    background-position-x: 50%;
    background-position-y: 100%;
    background-size: 100% 100%;
}

/* ===================================
   HERO SECTION (Landing Page)
=================================== */
.hero-section {
    background: linear-gradient(135deg, #0A3873 0%, #0d1b3e 55%, #6b0a1b 100%);
    min-height: 90vh;
    display: flex;
    align-items: center;
    padding: 80px 0 60px;
}

.hero-label {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.5);
    display: block;
    margin-bottom: 1.5rem;
}

.hero-headline {
    font-size: 2.8rem;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.2;
    margin-bottom: 1.5rem;
}

.hero-sub {
    font-size: 1.15rem;
    color: rgba(255,255,255,0.72);
    margin-bottom: 2.5rem;
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
}

.btn-hero-cta {
    background-color: #ffffff;
    color: #0A3873 !important;
    font-weight: 700;
    padding: 14px 36px;
    border-radius: 4px;
    font-size: 1rem;
    letter-spacing: 0.3px;
    transition: background-color 0.2s ease;
    display: inline-block;
}

.btn-hero-cta:hover {
    background-color: #e8e8e8 !important;
}

/* ===================================
   SECTION TYPOGRAPHY
=================================== */
.section-label {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--alt-text-color);
    display: block;
    margin-bottom: 0.6rem;
}

.section-title {
    font-size: 2.1rem;
    font-weight: 700;
    color: #1a1a2e;
    margin-bottom: 0.6rem;
    line-height: 1.25;
}

.section-sub {
    font-size: 1.05rem;
    color: var(--main-text-color);
    margin-bottom: 3rem;
}

/* ===================================
   PILLAR CARDS (Partnership Section)
=================================== */
.pillar-card {
    text-align: center;
    padding: 2rem 1.25rem;
    border-radius: 8px;
    border: 1px solid #e8e8e8;
    height: 100%;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.pillar-card:hover {
    box-shadow: 0 8px 28px rgba(0,0,0,0.09);
    transform: translateY(-3px);
}

.pillar-icon {
    font-size: 2.4rem;
    margin-bottom: 1rem;
}

.pillar-card h5 {
    font-weight: 700;
    color: #1a1a2e;
    margin-bottom: 0.5rem;
}

.pillar-card p {
    color: var(--main-text-color);
    font-size: 0.9rem;
    margin: 0;
}

/* ===================================
   3-STEP PROCESS
=================================== */
.step-wrap {
    text-align: center;
    padding: 1.5rem 1rem;
}

.step-number {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--alt2-text-color);
    color: #ffffff;
    font-size: 1.3rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.25rem;
}

.step-wrap h5 {
    font-weight: 700;
    color: #1a1a2e;
    margin-bottom: 0.5rem;
}

.step-wrap p {
    color: var(--main-text-color);
    font-size: 0.92rem;
    margin: 0;
}

.step-tag {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--alt-text-color);
    display: block;
    margin-bottom: 0.35rem;
}

/* ===================================
   MOAT / PATENT SECTION
=================================== */
.moat-section {
    background: #0d1b3e;
    padding: 80px 0;
}

.moat-section .section-title {
    color: #ffffff;
}

.moat-section .section-sub {
    color: rgba(255,255,255,0.65);
}

.moat-badge {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    background: rgba(255,255,255,0.07);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 8px;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1rem;
    transition: background 0.2s ease;
}

.moat-badge:hover {
    background: rgba(255,255,255,0.11);
}

.moat-badge-icon {
    font-size: 1.9rem;
    color: #f0a500;
    flex-shrink: 0;
    margin-top: 2px;
}

.moat-badge-text strong {
    color: #ffffff;
    display: block;
    font-size: 0.95rem;
    margin-bottom: 3px;
}

.moat-badge-text span {
    color: rgba(255,255,255,0.6);
    font-size: 0.85rem;
}

/* ===================================
   FINAL CTA SECTION
=================================== */
.cta-section {
    background: linear-gradient(135deg, #a60a27 0%, #7a0019 100%);
    padding: 80px 0;
    text-align: center;
}

.cta-section h2 {
    color: #ffffff;
    font-size: 2.1rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
}

.cta-section p {
    color: rgba(255,255,255,0.78);
    margin-bottom: 2.25rem;
    font-size: 1.05rem;
}

.btn-cta-outline {
    background: transparent;
    border: 2px solid #ffffff;
    color: #ffffff !important;
    font-weight: 700;
    padding: 14px 36px;
    border-radius: 4px;
    font-size: 1rem;
    display: inline-block;
    transition: all 0.2s ease;
    margin: 4px;
}

.btn-cta-outline:hover {
    background: #ffffff !important;
    color: #a60a27 !important;
}

/* ===================================
   PAGE HERO (Inner pages)
=================================== */
.page-hero {
    background: linear-gradient(135deg, #0A3873 0%, #0d1b3e 100%);
    padding: 70px 0 60px;
    text-align: center;
}

.page-hero h1 {
    color: #ffffff;
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
}

.page-hero p {
    color: rgba(255,255,255,0.72);
    font-size: 1.1rem;
    max-width: 580px;
    margin: 0 auto;
}

.page-hero-label {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.5);
    display: block;
    margin-bottom: 0.6rem;
}

/* ===================================
   CAPABILITY SECTION (Lab page)
=================================== */
.capability-block {
    padding: 70px 0;
}

.capability-block:nth-child(even) {
    background: #f8f9fa;
}

.capability-icon {
    font-size: 3rem;
    margin-bottom: 1.25rem;
}

.tech-tag {
    display: inline-block;
    background: #e9ecef;
    color: #495057;
    font-size: 0.76rem;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 3px;
    margin: 3px 2px;
}

.capability-list {
    list-style: none;
    padding: 0;
    margin: 0 0 1.25rem;
}

.capability-list li {
    padding: 6px 0;
    color: var(--main-text-color);
    font-size: 0.93rem;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.capability-list li::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--alt2-text-color);
    flex-shrink: 0;
}

/* ===================================
   ROADMAP TIMELINE
=================================== */
.roadmap-phase {
    position: relative;
    padding-left: 80px;
    margin-bottom: 2.5rem;
}

.roadmap-phase::after {
    content: '';
    position: absolute;
    left: 26px;
    top: 54px;
    bottom: -20px;
    width: 2px;
    background: #dee2e6;
}

.roadmap-phase:last-child::after {
    display: none;
}

.roadmap-dot {
    position: absolute;
    left: 0;
    top: 0;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background: var(--alt2-text-color);
    color: #ffffff;
    font-weight: 700;
    font-size: 0.8rem;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1.2;
}

.roadmap-dot.accent {
    background: var(--alt-text-color);
}

.roadmap-phase h5 {
    font-weight: 700;
    color: #1a1a2e;
    margin-bottom: 0.4rem;
    padding-top: 12px;
}

.roadmap-phase p {
    color: var(--main-text-color);
    font-size: 0.93rem;
    margin: 0;
    line-height: 1.6;
}

.deliverable-box {
    background: #f0f5ff;
    border: 1px solid #c8d9f5;
    border-left: 4px solid var(--alt2-text-color);
    border-radius: 6px;
    padding: 1.5rem 1.75rem;
}

.deliverable-box h5 {
    font-weight: 700;
    color: var(--alt2-text-color);
    margin-bottom: 1rem;
}

/* ===================================
   CASE STUDY CARDS
=================================== */
.case-card {
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    overflow: hidden;
    height: 100%;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.case-card:hover {
    box-shadow: 0 8px 28px rgba(0,0,0,0.1);
    transform: translateY(-3px);
}

.case-card-img {
    height: 180px;
    background: #e9ecef;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #adb5bd;
    font-size: 2.5rem;
}

.case-card-header {
    padding: 1.5rem 1.5rem 1rem;
    border-bottom: 1px solid #f0f0f0;
}

.case-card-header h5 {
    font-weight: 700;
    color: #1a1a2e;
    margin-bottom: 0.3rem;
    font-size: 1.05rem;
}

.case-category {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--alt-text-color);
    display: block;
    margin-bottom: 0.4rem;
}

.psr-block {
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #f5f5f5;
}

.psr-block:last-child {
    border-bottom: none;
}

.psr-label {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    display: inline-block;
    padding: 2px 8px;
    border-radius: 3px;
    margin-bottom: 0.4rem;
}

.psr-label.problem { background: #fde8ec; color: #a60a27; }
.psr-label.solution { background: #e8f0fe; color: #0A3873; }
.psr-label.result { background: #e8f8ee; color: #198754; }

.psr-block p {
    color: var(--main-text-color);
    font-size: 0.9rem;
    margin: 0;
    line-height: 1.6;
}

/* ===================================
   CONTACT FORM
=================================== */
.contact-wrap {
    max-width: 680px;
    margin: 0 auto;
}

.stage-option {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.9rem 1.1rem;
    border: 2px solid #dee2e6;
    border-radius: 6px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
    margin-bottom: 0.6rem;
    width: 100%;
}

.stage-option input[type=radio] {
    accent-color: var(--alt2-text-color);
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    margin-top: 2px;
}

.stage-option span {
    font-size: 0.93rem;
    color: #333;
    line-height: 1.4;
}

.stage-option:has(input:checked) {
    border-color: var(--alt2-text-color);
    background: #f0f5ff;
}

.contact-info-block {
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
    padding-top: 0.5rem;
}

.contact-info-item {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
}

.contact-info-icon {
    width: 36px;
    height: 36px;
    border-radius: 6px;
    background: #f0f5ff;
    color: var(--alt2-text-color);
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 2px;
}

.contact-info-label {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--alt-text-color);
    margin-bottom: 0.3rem;
}

.contact-info-block address {
    font-style: normal;
    color: var(--main-text-color);
    font-size: 0.92rem;
    line-height: 1.65;
    margin-bottom: 0.3rem;
}

.success-banner {
    background: #e8f8ee;
    border: 1px solid #b8dfca;
    border-left: 4px solid #198754;
    border-radius: 6px;
    padding: 1.25rem 1.5rem;
    margin-bottom: 2rem;
}

.success-banner h5 {
    color: #198754;
    font-weight: 700;
    margin-bottom: 0.25rem;
}

.success-banner p {
    color: #3a6b4d;
    font-size: 0.93rem;
    margin: 0;
}
