/* --- RESET & BASICS --- */
:root {
    --primary-color: #2f80ed; 
    --dark-bg: #071426;       
    --light-bg: #f7f9fc;      
    --text-main: #334155;     
    --text-light: #eef4fb;    
    --font-main: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --accent-green: #2f80ed;
}

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

body {
    font-family: var(--font-main);
    line-height: 1.6;
    color: var(--text-main);
    background-color: #fff;
}

/* --- UTILITIES --- */
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.btn {
    display: inline-block;
    padding: 12px 24px;
    background-color: var(--primary-color);
    color: white;
    text-decoration: none;
    border-radius: 6px;
    font-weight: 600;
    transition: background 0.3s;
    border: none;
    cursor: pointer;
    font-family: var(--font-main);
    font-size: 1rem;
}

.btn:hover { 
    background-color: #009ac0; 
}

.btn-large {
    padding: 16px 32px;
    font-size: 1.1rem;
}

.btn-primary {
    background-color: var(--primary-color);
    color: white;
}

.btn-outline {
    background-color: transparent;
    border: 2px solid var(--primary-color);
    color: var(--primary-color);
}

.btn-outline:hover {
    background-color: var(--primary-color);
    color: white;
}

/* --- RESPONSIVE TOGGLES --- */
.mobile-only { 
    display: none !important; 
}

.desktop-only { 
    display: inline-block !important; 
}

/* --- FLOATING CONTACT BUTTON --- */
.floating-contact-btn {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 60px;
    height: 60px;
    z-index: 999;
}

.floating-contact-btn a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: var(--primary-color);
    border-radius: 50%;
    font-size: 1.5rem;
    box-shadow: 0 4px 12px rgba(0,189,189,0.4);
    text-decoration: none;
    transition: transform 0.3s;
}

.floating-contact-btn a:hover {
    transform: scale(1.1);
}

/* --- NAVIGATION --- */
.navbar {
    background: white;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    position: sticky;
    top: 0;
    z-index: 1000;
}

.nav-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 80px;
}

.logo-container {
    display: flex;
    align-items: center;
}

.logo-link {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: var(--text-main);
}

.logo-img {
    height: 50px;
    width: auto;
    margin-right: 10px;
}

.logo-text {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--dark-bg);
}

.nav-menu { 
    display: flex; 
    gap: 30px; 
    align-items: center;
    list-style: none;
}

.nav-item {}

.nav-link { 
    text-decoration: none; 
    color: var(--text-main); 
    font-weight: 500; 
    transition: color 0.3s; 
}

.nav-link:hover { 
    color: var(--primary-color); 
}

.nav-link.active {
    color: var(--primary-color);
    font-weight: 600;
}

/* Mobile menu toggle */
.mobile-menu-toggle {
    display: none;
    flex-direction: column;
    gap: 4px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 5px;
}

.mobile-menu-toggle span {
    width: 25px;
    height: 3px;
    background: var(--text-main);
    transition: all 0.3s;
}

.mobile-menu-toggle.active span:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
}

.mobile-menu-toggle.active span:nth-child(2) {
    opacity: 0;
}

.mobile-menu-toggle.active span:nth-child(3) {
    transform: rotate(-45deg) translate(7px, -6px);
}

.mobile-menu {
    display: none;
    position: fixed;
    top: 80px;
    left: 0;
    right: 0;
    background: white;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    z-index: 999;
}

.mobile-menu.active {
    display: block;
}

.mobile-menu ul {
    list-style: none;
    padding: 20px;
}

.mobile-menu ul li {
    padding: 15px 0;
    border-bottom: 1px solid #e5e7eb;
}

.mobile-menu ul li:last-child {
    border-bottom: none;
}

.mobile-menu ul li a {
    color: var(--text-main);
    text-decoration: none;
    font-weight: 500;
    font-size: 1.1rem;
}

/* --- SECTION HEADER --- */
.section-header {
    text-align: center;
    margin-bottom: 60px;
}

.section-header h2 { 
    font-size: 2.5rem; 
    color: var(--dark-bg); 
    margin-bottom: 10px; 
}

.section-header p { 
    font-size: 1.1rem; 
    color: #6b7280; 
}

/* --- MANAGED PLANS SECTION --- */
.plans {
    padding: 100px 0;
    background-color: var(--light-bg);
}

.plans-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
    align-items: flex-start;
}

.plan-card {
    background: white;
    padding: 40px;
    border-radius: 12px;
    box-shadow: 0 10px 15px rgba(0,0,0,0.05);
    border: 1px solid #e5e7eb;
    flex: 1 1 300px; 
    max-width: 350px;
    width: 100%;
    position: relative;
    transition: transform 0.2s;
}

.plan-card:hover { 
    transform: translateY(-5px); 
    border-color: var(--primary-color); 
}

.plan-card.featured {
    border: 2px solid var(--primary-color);
    transform: scale(1.05);
    z-index: 10;
}

.plan-card.featured:hover { 
    transform: scale(1.05) translateY(-5px); 
}

.plan-tag {
    background: var(--primary-color);
    color: white;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
}

.plan-title { 
    font-size: 1.5rem; 
    margin-bottom: 10px; 
    font-weight: 800; 
    color: var(--dark-bg); 
}

.plan-desc { 
    color: #6b7280; 
    font-size: 0.95rem; 
    margin-bottom: 30px; 
    min-height: 40px; 
}

.plan-features { 
    list-style: none; 
    margin-bottom: 30px; 
    text-align: left; 
}

.plan-features li { 
    margin-bottom: 12px; 
    font-size: 0.95rem; 
    color: #4b5563; 
    display: flex; 
    align-items: center; 
}

.plan-features li::before { 
    content: "✓"; 
    color: var(--accent-green); 
    font-weight: 900; 
    margin-right: 10px; 
    font-size: 1.1rem;
}

/* --- CONTACT SECTION --- */
#contact {
    padding: 100px 0;
    background-color: var(--dark-bg);
    background-image: linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
    background-size: 40px 40px;
}

.contact-methods {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    justify-content: center;
    margin-top: 50px;
    margin-bottom: 60px;
}

.contact-card {
    background: white;
    padding: 30px;
    border-radius: 12px;
    text-decoration: none;
    flex: 1;
    min-width: 250px;
    max-width: 300px;
    text-align: center;
    transition: transform 0.3s, box-shadow 0.3s;
    position: relative;
}

.contact-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,189,189,0.3);
}

.contact-icon {
    font-size: 2rem;
    color: var(--primary-color);
    margin-bottom: 10px;
}

.contact-title {
    font-weight: 700;
    color: var(--dark-bg);
    margin-bottom: 5px;
}

.contact-detail {
    color: #6b7280;
    font-size: 0.9rem;
}

/* --- CONTACT FORM --- */
.contact-form-container {
    background: white;
    padding: 40px;
    border-radius: 12px;
    max-width: 600px;
    margin: 0 auto;
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}

.contact-form-container h3 {
    text-align: center;
    margin-bottom: 10px;
    color: var(--dark-bg);
    font-size: 1.8rem;
}

.contact-form-container .form-subtitle {
    text-align: center;
    color: #6b7280;
    margin-bottom: 30px;
    font-size: 0.95rem;
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    margin-bottom: 5px;
    font-weight: 600;
    color: var(--text-main);
    font-size: 0.9rem;
}

.form-group input,
.form-group textarea,
.form-group select {
    width: 100%;
    padding: 12px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    font-family: var(--font-main);
    font-size: 1rem;
    transition: border-color 0.3s;
}

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
    outline: none;
    border-color: var(--primary-color);
}

.form-group textarea {
    resize: vertical;
    min-height: 120px;
}

.form-note {
    font-size: 0.85rem;
    color: #6b7280;
    margin-top: 5px;
}

/* --- CONTACT PREFERENCE MODAL --- */
.preference-modal-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    z-index: 10000;
    align-items: center;
    justify-content: center;
}

.preference-modal-overlay.active {
    display: flex;
}

.preference-modal {
    background: white;
    border-radius: 12px;
    padding: 40px;
    max-width: 450px;
    width: 90%;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    position: relative;
}

.preference-modal h3 {
    color: var(--dark-bg);
    font-size: 1.5rem;
    margin-bottom: 10px;
    text-align: center;
}

.preference-modal .subtitle {
    color: #6b7280;
    font-size: 0.95rem;
    text-align: center;
    margin-bottom: 30px;
}

.preference-option {
    display: flex;
    align-items: center;
    padding: 15px;
    margin-bottom: 10px;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s;
}

.preference-option:hover {
    border-color: var(--primary-color);
    background: var(--light-bg);
}

.preference-option.selected {
    border-color: var(--primary-color);
    background: #e0f7f7;
}

.preference-option input[type="radio"] {
    margin-right: 15px;
    width: 20px;
    height: 20px;
    cursor: pointer;
}

.preference-option-content {
    flex: 1;
}

.preference-option-title {
    font-weight: 600;
    color: var(--dark-bg);
    font-size: 1rem;
}

.preference-option-desc {
    font-size: 0.85rem;
    color: #6b7280;
    margin-top: 2px;
}

.preference-remember {
    display: flex;
    align-items: center;
    margin: 20px 0;
    padding: 15px;
    background: var(--light-bg);
    border-radius: 8px;
}

.preference-remember input[type="checkbox"] {
    margin-right: 10px;
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.preference-remember label {
    font-size: 0.9rem;
    color: var(--text-main);
    cursor: pointer;
}

.preference-buttons {
    display: flex;
    gap: 10px;
    margin-top: 20px;
}

.preference-buttons button {
    flex: 1;
    padding: 12px;
    border: none;
    border-radius: 6px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s;
    font-size: 1rem;
}

.preference-btn-cancel {
    background: #e5e7eb;
    color: var(--text-main);
}

.preference-btn-cancel:hover {
    background: #d1d5db;
}

.preference-btn-connect {
    background: var(--primary-color);
    color: white;
}

.preference-btn-connect:hover {
    background: #009ac0;
}

.preference-btn-connect:disabled {
    background: #9ca3af;
    cursor: not-allowed;
}

/* Settings Icon */
.contact-settings-icon {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 1.2rem;
    color: #9ca3af;
    cursor: pointer;
    transition: all 0.3s;
    padding: 5px;
    border-radius: 50%;
}

.contact-settings-icon:hover {
    color: var(--primary-color);
    background: var(--light-bg);
}

/* --- FOOTER --- */
.footer {
    background: var(--dark-bg);
    color: #9ca3af;
    padding: 60px 0 30px;
}

.footer-content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 40px;
    margin-bottom: 40px;
}

.footer-section h3 {
    color: var(--primary-color);
    margin-bottom: 20px;
    font-size: 1.2rem;
}

.footer-section p {
    margin-bottom: 15px;
}

.footer-section ul {
    list-style: none;
}

.footer-section ul li {
    margin-bottom: 10px;
}

.footer-section ul li a {
    color: #9ca3af;
    text-decoration: none;
    transition: color 0.3s;
}

.footer-section ul li a:hover {
    color: var(--primary-color);
}

.location-badge {
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(255,255,255,0.05);
    padding: 15px;
    border-radius: 8px;
    margin-top: 15px;
}

.location-icon {
    font-size: 1.5rem;
}

.location-title {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--primary-color);
}

.location-subtitle {
    font-size: 0.85rem;
    color: #d1d5db;
}

.footer-bottom {
    text-align: center;
    padding-top: 30px;
    border-top: 1px solid rgba(255,255,255,0.1);
    font-size: 0.9rem;
}

/* --- MOBILE ADAPTATION --- */
@media (max-width: 768px) {
    .mobile-only { 
        display: inline-block !important; 
    }
    
    .desktop-only { 
        display: none !important; 
    }

    .mobile-menu-toggle {
        display: flex;
    }

    .nav-menu {
        display: none;
    }

    .hero h1 { 
        font-size: 2.2rem; 
    }
    
    .hero p { 
        font-size: 1.1rem; 
        padding: 0 10px; 
    }
    
    .nav-container { 
        height: auto; 
        padding: 15px 0; 
    }
    
    .plans-grid { 
        flex-direction: column; 
        align-items: center; 
    }
    
    .plan-card.featured { 
        transform: none; 
    }
    
    .plan-card.featured:hover { 
        transform: translateY(-5px); 
    }
    
    .contact-form-container { 
        padding: 30px 20px; 
    }
    
    .floating-contact-btn {
        bottom: 15px;
        right: 15px;
        width: 55px;
        height: 55px;
    }

    .floating-contact-btn a {
        font-size: 1.3rem;
    }

    .footer-content {
        grid-template-columns: 1fr;
        text-align: center;
    }
}


/* --- 2026 JCB MARKETING SYSTEM --- */
html{scroll-behavior:smooth} body{font-size:16px} main{overflow:hidden}.narrow{max-width:920px}.page-hero{background:#111827;color:var(--text-light);padding:108px 0 92px;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:40px 40px}.page-hero h1{font-size:clamp(2.35rem,5.2vw,4.05rem);line-height:1.04;letter-spacing:-.04em;margin:12px 0 24px;max-width:980px}.page-hero .lead{font-size:clamp(1.15rem,2.2vw,1.45rem);line-height:1.65;color:#d1d5db;max-width:850px}.page-hero p:not(.eyebrow):not(.lead){max-width:820px;color:#cbd5e1;font-size:1.04rem}.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;font-weight:800;color:#45d9d9}.eyebrow.dark{color:#007f86}.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}.btn-outline-light{background:transparent;border:2px solid #6b7280;color:#fff}.btn-outline-light:hover{background:#fff;color:#111827;border-color:#fff}.trust-line{margin-top:34px;color:#9ca3af;font-size:.9rem;border-top:1px solid #374151;padding-top:22px}.section{padding:88px 0}.section.alt{background:#f7f9fa}.split{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:start}.section h2{color:#111827;font-size:clamp(1.9rem,3.4vw,2.65rem);line-height:1.15;letter-spacing:-.025em;margin:8px 0 22px}.section h3{color:#111827}.section p{font-size:1.05rem;line-height:1.75;margin-bottom:16px}.section-header{text-align:center;max-width:850px;margin:0 auto 48px}.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:28px;box-shadow:0 8px 28px rgba(17,24,39,.04)}.card h3{font-size:1.25rem;margin-bottom:12px}.card p{font-size:.98rem;margin:0}.alt .card{box-shadow:none}.outcome-list{display:grid;gap:13px}.outcome{display:flex;gap:12px;background:#f7f9fa;border:1px solid #e5e7eb;border-radius:10px;padding:15px 18px;font-weight:600;color:#243042}.outcome:first-letter{color:#009a9a}.check-list{list-style:none;padding:0;display:grid;gap:12px}.check-list li{position:relative;padding:14px 16px 14px 44px;background:#fff;border:1px solid #e5e7eb;border-radius:10px}.check-list li:before{content:'✓';position:absolute;left:16px;top:13px;color:#008f93;font-weight:900}.credential-panel,.contact-panel{background:#111827;color:#e5e7eb;border-radius:16px;padding:32px}.credential-panel h3,.contact-panel h2,.contact-panel h3{color:var(--text-light)}.credential-panel .check-list li{background:#1f2937;border-color:#374151;color:#e5e7eb}.service-note{background:#effcfc;border-left:4px solid var(--primary-color);padding:16px 18px;border-radius:6px;font-size:.94rem!important}.text-link{color:#008d91;font-weight:700;text-decoration:none}.pillar-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}.pillar{background:#fff;border:1px solid #dfe5e8;border-radius:16px;padding:36px}.pillar-number{color:#00a9ad;font-weight:900;font-size:.85rem}.pillar h3{font-size:1.8rem;margin:10px 0}.pillar ul{margin:18px 0 28px;padding-left:20px}.pillar li{margin:8px 0}.industry-links{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}.industry-links a{padding:12px 18px;border:1px solid #d1d5db;border-radius:999px;text-decoration:none;color:#243042;background:#fff;font-weight:600}.industry-links a:hover{border-color:#00a9ad;color:#007d82}.cta-band{background:#0b2930;color:var(--text-light);padding:64px 0}.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:40px}.cta-band h2{font-size:clamp(1.9rem,3.4vw,2.65rem);line-height:1.1;margin:6px 0 14px}.cta-band p{color:#cbd5e1;max-width:720px}.industry-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.industry-card{padding:30px;border:1px solid #e5e7eb;border-radius:14px;text-decoration:none;color:inherit;background:#fff;transition:.2s}.industry-card:hover{transform:translateY(-3px);border-color:#00a9ad;box-shadow:0 12px 30px rgba(0,0,0,.06)}.industry-card h2{font-size:1.35rem;margin:0 0 10px}.industry-card p{font-size:.96rem}.industry-card span{color:#008d91;font-weight:700}.timeline{max-width:900px;margin:auto}.timeline article{border-left:3px solid #00bdbd;padding:4px 0 34px 28px;margin-left:10px}.timeline article span{font-size:.8rem;text-transform:uppercase;letter-spacing:.12em;font-weight:800;color:#00898d}.timeline h2{font-size:1.8rem;margin:8px 0}.experience-note{max-width:900px;margin:32px auto 0}.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}.steps>div{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:22px}.steps span{font-weight:900;color:#009b9f}.steps h3{margin:8px 0}.steps p{font-size:.92rem}.number-list{counter-reset:item;list-style:none;padding:0}.number-list li{counter-increment:item;padding:14px 0 14px 48px;position:relative;border-bottom:1px solid #e5e7eb}.number-list li:before{content:counter(item);position:absolute;left:0;top:10px;background:#111827;color:#fff;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800}.contact-panel .full{width:100%;text-align:center;margin:12px 0 24px}.contact-row{display:flex;justify-content:space-between;gap:20px;padding:16px 0;border-top:1px solid #374151;color:#e5e7eb;text-decoration:none}.contact-row:hover span{color:#45d9d9}.contact-region{border-top:1px solid #374151;margin-top:8px;padding-top:18px}.contact-region p{font-size:.94rem;color:#cbd5e1}.navbar .nav-menu{gap:22px}.mobile-menu{max-height:calc(100vh - 80px);overflow:auto}
@media(max-width:980px){.split{grid-template-columns:1fr;gap:36px}.card-grid,.industry-grid{grid-template-columns:1fr 1fr}.steps{grid-template-columns:1fr 1fr}.pillar-grid{grid-template-columns:1fr}.cta-inner{display:block}.cta-inner .btn{margin-top:18px}}
@media(max-width:640px){.page-hero{padding:78px 0 64px}.section{padding:64px 0}.card-grid,.industry-grid,.steps{grid-template-columns:1fr}.hero-actions{display:grid}.hero-actions .btn{text-align:center}.contact-row{display:block}.contact-row span{display:block;margin-top:4px}.trust-line{line-height:1.8}}


/* =========================================================
   JCB BLUE PREVIEW THEME — restrained browser test
   ========================================================= */
:root{
  --primary-color:#2f80ed;
  --primary-deep:#1d4ed8;
  --primary-soft:#eaf3ff;
  --navy:#071426;
  --navy-2:#0b1d35;
  --steel:#6f8198;
  --cool-white:#eef4fb;
}
body{background:#fff;color:#334155}
.navbar{background:rgba(7,20,38,.97);box-shadow:0 1px 0 rgba(148,163,184,.16);backdrop-filter:blur(10px)}
.nav-link,.logo-link{color:#dce7f5}.nav-link:hover,.nav-link.active{color:#69a8ff}
.mobile-menu-toggle span{background:#eaf2fb}.mobile-menu{background:#071426;border-top:1px solid rgba(148,163,184,.16)}
.mobile-menu ul li{border-bottom-color:rgba(148,163,184,.16)}.mobile-menu ul li a{color:#e7eef7}
.dropdown-menu{background:#0c1b30!important;border:1px solid rgba(148,163,184,.18);box-shadow:0 18px 45px rgba(2,8,23,.42)!important}
.dropdown-menu a{color:#dbe7f4!important}.dropdown-menu a:hover{background:#102845!important;color:#78b3ff!important}.dropdown-divider{background:rgba(148,163,184,.18)!important}
.nav-cta{background:#2f80ed!important;color:#fff!important;box-shadow:0 6px 18px rgba(47,128,237,.22)}.nav-cta:hover{background:#256fd0!important}
.brand-wordmark{display:flex;align-items:center;line-height:1}.brand-jcb{font-size:1.65rem;letter-spacing:.03em;font-weight:800;color:#f4f7fb}.brand-jcb .brand-c{color:#4c98ff}.brand-tech{display:block;font-size:.52rem;letter-spacing:.32em;margin-top:3px;color:#a9b9cc;font-weight:700}.brand-stack{display:flex;flex-direction:column}
.page-hero{background-color:#071426;background-image:radial-gradient(circle at 82% 34%,rgba(47,128,237,.16),transparent 31%),linear-gradient(rgba(113,169,247,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(113,169,247,.045) 1px,transparent 1px);background-size:auto,40px 40px,40px 40px}
.page-hero .lead{color:#c8d6e7}.page-hero p:not(.eyebrow):not(.lead){color:#bdccde}.eyebrow{color:#71a9f8}.eyebrow.dark{color:#236bc7}.trust-line{color:#9fb0c5;border-top-color:#223853}
.btn,.btn-primary{background:#2f80ed}.btn:hover,.btn-primary:hover{background:#256fd0}.btn-outline{border-color:#2f80ed;color:#2f80ed}.btn-outline:hover{background:#2f80ed}.btn-outline-light{border-color:#71839b;color:#eef4fb}.btn-outline-light:hover{background:#eef4fb;color:#071426;border-color:#eef4fb}
.text-link{color:#236bc7}.pillar-number{color:#2f80ed}.industry-card span{color:#236bc7}.industry-card:hover,.plan-card:hover{border-color:#5c9cf1}.industry-links a:hover{border-color:#5c9cf1;color:#236bc7}.timeline article{border-left-color:#2f80ed}.timeline article span,.steps span{color:#236bc7}.check-list li:before{color:#2f80ed}
.credential-panel,.contact-panel{background:#0b1d35}.credential-panel .check-list li{background:#102845;border-color:#203b5e}.contact-row{border-top-color:#203b5e}.contact-row:hover span{color:#71a9f8}.contact-region{border-top-color:#203b5e}
.service-note{background:#eef5ff;border-left-color:#2f80ed}.cta-band{background:#081b33}.card{box-shadow:0 8px 28px rgba(15,37,66,.06)}
.footer{background:#061222!important}.footer-logo{display:none}.footer h3{color:#f1f5f9}.footer a:hover,.footer-assessment{color:#71a9f8!important}.footer-bottom{border-top-color:#223853!important}
.floating-contact-btn a{background:#2f80ed;box-shadow:0 4px 15px rgba(47,128,237,.35)}
.chat-toggle,.chat-send{background:#2f80ed!important}
@media(max-width:640px){.brand-jcb{font-size:1.45rem}.brand-tech{font-size:.46rem}}

/* === CONCEPT 2 BRAND SYSTEM — CONNECTED-NODE C === */
:root{
  --primary-color:#2f80ed;
  --primary-hover:#1f6fd2;
  --brand-blue-2:#145cc8;
  --brand-blue-soft:#78b5ff;
  --dark-bg:#071426;
  --dark-surface:#0d1f38;
  --dark-surface-2:#112942;
  --light-bg:#f5f8fc;
  --text-main:#2b3b4f;
  --text-light:#f2f6fb;
}
body{background:#fff;color:var(--text-main)}
.btn,.btn-primary{background:linear-gradient(135deg,#368cff,#256fdd);box-shadow:0 8px 24px rgba(47,128,237,.18)}
.btn:hover,.btn-primary:hover{background:linear-gradient(135deg,#2f80ed,#1f63c5);transform:translateY(-1px)}
.navbar{background:rgba(5,17,33,.97);border-bottom:1px solid rgba(114,169,248,.14);box-shadow:0 8px 30px rgba(2,10,22,.16);backdrop-filter:blur(14px)}
.nav-container{height:76px}.brand-logo-img{display:block;width:208px;height:auto;object-fit:contain}.nav-link{color:#d8e2ee}.nav-link:hover,.nav-link.active{color:#75b2ff}.mobile-menu-toggle span{background:#f2f6fb}.mobile-menu{top:76px;background:#08172a;border-top:1px solid #203958}.mobile-menu ul li{border-bottom-color:#203958}.mobile-menu ul li a{color:#e7eef7}
.dropdown-menu{background:#0b1b30;border:1px solid #213c5a;box-shadow:0 16px 40px rgba(0,0,0,.35)}.dropdown-menu a{color:#dce6f2}.dropdown-menu a:hover{background:#10294a;color:#75b2ff}.dropdown-divider{background:#213c5a}
.accent-text{color:#4c98ff}
.page-hero{background-color:#071426;background-image:radial-gradient(circle at 84% 28%,rgba(47,128,237,.18),transparent 32%),linear-gradient(rgba(95,158,247,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(95,158,247,.04) 1px,transparent 1px);background-size:auto,44px 44px,44px 44px}
.page-hero h1{font-size:clamp(2.45rem,4.8vw,3.9rem);max-width:940px}.page-hero .lead{font-size:clamp(1.08rem,2vw,1.35rem);max-width:760px}.eyebrow{color:#78b5ff}.eyebrow.dark{color:#236cc8}
.home-hero{position:relative;min-height:610px;display:flex;align-items:center;background-color:#071426;background-image:linear-gradient(90deg,rgba(4,14,28,1) 0%,rgba(4,14,28,.98) 37%,rgba(4,14,28,.84) 50%,rgba(4,14,28,.28) 72%,rgba(4,14,28,.08) 100%),url('/images/brand/hero-server-room-approved.jpg');background-size:100% 100%,auto 100%;background-repeat:no-repeat,no-repeat;background-position:center,right center;padding:90px 0 56px}
.home-hero:after{content:'';position:absolute;inset:auto 0 0;height:150px;background:linear-gradient(transparent,#071426);pointer-events:none}.home-hero-content{position:relative;z-index:1;width:100%}.home-hero h1{max-width:720px;font-size:clamp(2.6rem,5vw,4.1rem);text-shadow:0 3px 24px rgba(0,0,0,.35)}.home-hero .lead{max-width:680px;color:#d3dfec}.home-hero .hero-actions{margin-top:28px}
.hero-proof-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:54px;max-width:1040px;border-top:1px solid rgba(138,192,255,.25);padding-top:22px}.hero-proof-grid>div{padding:0 22px;border-right:1px solid rgba(138,192,255,.18)}.hero-proof-grid>div:first-child{padding-left:0}.hero-proof-grid>div:last-child{border-right:0}.hero-proof-grid strong{display:block;color:#f3f7fb;font-size:.95rem}.hero-proof-grid span{display:block;color:#9eb3ca;font-size:.78rem;line-height:1.45;margin-top:4px}
.architecture-hero{position:relative;background-image:linear-gradient(90deg,rgba(4,14,28,.96),rgba(4,14,28,.82) 48%,rgba(4,14,28,.43)),url('/images/brand/architecture-building.jpg');background-size:cover;background-position:center}.architecture-hero .container{position:relative;z-index:1}.architecture-hero:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,14,28,.1),rgba(4,14,28,.32));pointer-events:none}
.section.alt{background:#f3f7fb}.credential-panel,.contact-panel{background:linear-gradient(145deg,#071426,#0f2540);border:1px solid #1c3b5c}.cta-band{background:linear-gradient(135deg,#071426,#0d2340)}.text-link{color:#236fd0}.pillar-number,.steps span{color:#2f80ed}.service-note{background:#eef5ff;border-left-color:#2f80ed}

@media(max-width:980px){
  .brand-logo-img{width:188px}.hero-proof-grid{grid-template-columns:1fr 1fr;max-width:700px;gap:20px 0}.hero-proof-grid>div:nth-child(2){border-right:0}.home-hero{min-height:auto;background-position:64% center}.home-hero h1{max-width:650px}
}
@media(max-width:640px){
  .nav-container{height:68px}.brand-logo-img{width:164px}.mobile-menu{top:68px}.home-hero{padding:70px 0 46px;background-image:linear-gradient(180deg,rgba(4,14,28,.78),rgba(4,14,28,.97)),url('/images/brand/hero-server-room-approved.jpg');background-size:cover;background-position:58% center}.home-hero h1,.page-hero h1{font-size:clamp(2rem,9vw,2.35rem);line-height:1.07;letter-spacing:-.03em}.home-hero .lead,.page-hero .lead{font-size:1.02rem;line-height:1.55}.hero-proof-grid{grid-template-columns:1fr 1fr;margin-top:38px;gap:18px 0}.hero-proof-grid>div{padding:0 12px}.hero-proof-grid>div:first-child,.hero-proof-grid>div:nth-child(3){padding-left:0}.hero-proof-grid strong{font-size:.86rem}.hero-proof-grid span{font-size:.72rem}.section h2{font-size:clamp(1.7rem,7vw,2.05rem)}.btn-large{font-size:1rem;padding:14px 20px}.architecture-hero{background-position:64% center}
}

/* === IMAGERY TUNING + PAGE HERO EXPANSION === */
.brand-logo-img{width:182px;max-width:100%;height:auto}
@media(max-width:980px){.brand-logo-img{width:168px}}
@media(max-width:640px){.brand-logo-img{width:148px}}

.home-hero{
  background-image:
    linear-gradient(90deg,rgba(4,14,28,.95) 0%,rgba(4,14,28,.90) 34%,rgba(4,14,28,.64) 50%,rgba(4,14,28,.22) 72%,rgba(4,14,28,.05) 100%),
    url('/images/brand/hero-server-room-approved-bright.jpg');
  background-size:100% 100%, auto 108%;
  background-position:center, 74% center;
}
.architecture-hero{
  background-image:
    linear-gradient(90deg,rgba(4,14,28,.94),rgba(4,14,28,.76) 48%,rgba(4,14,28,.34)),
    url('/images/brand/architecture-building-bright.jpg');
  background-size:cover;
  background-position:center 56%;
}
.managed-it-hero,.networks-hero,.cloud-hero,.cybersecurity-hero,.ai-hero,.residential-hero,.about-hero,.contact-hero,.experience-hero,.industries-hero,.industry-hero{
  position:relative;
  overflow:hidden;
  background-size:cover;
  background-position:center;
}
.managed-it-hero{
  background-image:linear-gradient(90deg,rgba(4,14,28,.92),rgba(4,14,28,.78) 44%,rgba(4,14,28,.36)),url('/images/brand/services-managed-it.png');
  background-position:center, right center;
}
.networks-hero{
  background-image:linear-gradient(90deg,rgba(4,14,28,.90),rgba(4,14,28,.68) 42%,rgba(4,14,28,.20)),url('/images/brand/networks-rack.png');
  background-position:center, right center;
}
.cloud-hero{
  background-image:linear-gradient(90deg,rgba(4,14,28,.92),rgba(4,14,28,.77) 46%,rgba(4,14,28,.28)),url('/images/brand/cloud-infrastructure.png');
  background-position:center, right center;
}
.cybersecurity-hero{
  background-image:linear-gradient(90deg,rgba(4,14,28,.92),rgba(4,14,28,.76) 45%,rgba(4,14,28,.24)),url('/images/brand/cybersecurity-ops.png');
  background-position:center, right center;
}
.ai-hero{
  background-image:linear-gradient(90deg,rgba(4,14,28,.92),rgba(4,14,28,.76) 45%,rgba(4,14,28,.25)),url('/images/brand/ai-automation.png');
  background-position:center, right center;
}
.residential-hero{
  background-image:linear-gradient(90deg,rgba(4,14,28,.92),rgba(4,14,28,.74) 46%,rgba(4,14,28,.26)),url('/images/brand/residential-smart-home.png');
  background-position:center, center;
}
.about-hero,.experience-hero{
  background-image:linear-gradient(90deg,rgba(4,14,28,.92),rgba(4,14,28,.77) 45%,rgba(4,14,28,.32)),url('/images/brand/cloud-infrastructure.png');
  background-position:center, right center;
}
.contact-hero,.industries-hero,.industry-hero{
  background-image:linear-gradient(90deg,rgba(4,14,28,.92),rgba(4,14,28,.76) 45%,rgba(4,14,28,.30)),url('/images/brand/services-managed-it.png');
  background-position:center, right center;
}
.managed-it-hero .lead,.networks-hero .lead,.cloud-hero .lead,.cybersecurity-hero .lead,.ai-hero .lead,.residential-hero .lead,.about-hero .lead,.contact-hero .lead,.experience-hero .lead,.industries-hero .lead,.industry-hero .lead,.architecture-hero .lead{max-width:760px}

@media(max-width:980px){
  .home-hero{background-position:center, 66% center}
}
@media(max-width:640px){
  .home-hero{
    background-image:linear-gradient(180deg,rgba(4,14,28,.72),rgba(4,14,28,.95)),url('/images/brand/hero-server-room-approved-bright.jpg');
    background-size:cover;
    background-position:58% center;
  }
  .architecture-hero,.managed-it-hero,.networks-hero,.cloud-hero,.cybersecurity-hero,.ai-hero,.residential-hero,.about-hero,.contact-hero,.experience-hero,.industries-hero,.industry-hero{
    background-image:
      linear-gradient(180deg,rgba(4,14,28,.68),rgba(4,14,28,.94)),
      inherit;
  }
  .architecture-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/architecture-building-bright.jpg');background-position:62% center}
  .managed-it-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/services-managed-it.png')}
  .networks-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/networks-rack.png')}
  .cloud-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/cloud-infrastructure.png')}
  .cybersecurity-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/cybersecurity-ops.png')}
  .ai-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/ai-automation.png')}
  .residential-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/residential-smart-home.png')}
  .about-hero,.experience-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/cloud-infrastructure.png')}
  .contact-hero,.industries-hero,.industry-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/services-managed-it.png')}
}

/* === FINAL HERO CLARITY + HEADER LOGO SCALE PASS === */
.brand-logo-img{width:162px}
.home-hero{
  background-image:
    linear-gradient(90deg,rgba(4,14,28,.96) 0%,rgba(4,14,28,.91) 34%,rgba(4,14,28,.62) 49%,rgba(4,14,28,.20) 70%,rgba(4,14,28,.04) 100%),
    url('/images/brand/hero-server-room-crisp.jpg');
  background-size:100% 100%, auto 100%;
  background-position:center, right center;
}
@media(max-width:980px){
  .brand-logo-img{width:150px}
  .home-hero{background-position:center, 68% center}
}
@media(max-width:640px){
  .brand-logo-img{width:136px}
  .home-hero{
    background-image:linear-gradient(180deg,rgba(4,14,28,.68),rgba(4,14,28,.94)),url('/images/brand/hero-server-room-crisp.jpg');
    background-size:cover;
    background-position:62% center;
  }
}


/* === FINAL REFINEMENTS: sharper homepage, smaller logo, differentiated industries === */
.brand-logo-img{width:156px!important;max-width:100%;height:auto}
@media(max-width:980px){.brand-logo-img{width:146px!important}}
@media(max-width:640px){.brand-logo-img{width:136px!important}}
.home-hero{background-image:linear-gradient(90deg,rgba(4,14,28,1) 0%,rgba(4,14,28,.97) 37%,rgba(4,14,28,.82) 50%,rgba(4,14,28,.30) 72%,rgba(4,14,28,.08) 100%),url('/images/brand/hero-server-room-crisp.jpg')!important;background-size:100% 100%,auto 100%!important;background-position:center,right center!important}
.ai-hero{background-image:linear-gradient(90deg,rgba(4,14,28,.92),rgba(4,14,28,.78) 45%,rgba(4,14,28,.28)),url('/images/brand/ai-automation-alt.png')!important;background-position:center,right center!important}
.marina-hero{background-image:linear-gradient(90deg,rgba(4,14,28,.93),rgba(4,14,28,.75) 46%,rgba(4,14,28,.24)),url('/images/brand/industry-marina.png');background-size:cover;background-position:center}
.hotel-hero{background-image:linear-gradient(90deg,rgba(4,14,28,.93),rgba(4,14,28,.76) 46%,rgba(4,14,28,.22)),url('/images/brand/industry-hotel.png');background-size:cover;background-position:center}
.restaurant-hero{background-image:linear-gradient(90deg,rgba(4,14,28,.93),rgba(4,14,28,.76) 46%,rgba(4,14,28,.22)),url('/images/brand/industry-restaurant.png');background-size:cover;background-position:center}
.retail-hero{background-image:linear-gradient(90deg,rgba(4,14,28,.93),rgba(4,14,28,.76) 46%,rgba(4,14,28,.24)),url('/images/brand/industry-retail.png');background-size:cover;background-position:center}
.office-hero{background-image:linear-gradient(90deg,rgba(4,14,28,.93),rgba(4,14,28,.76) 46%,rgba(4,14,28,.24)),url('/images/brand/industry-office.png');background-size:cover;background-position:center}
.school-hero{background-image:linear-gradient(90deg,rgba(4,14,28,.93),rgba(4,14,28,.76) 46%,rgba(4,14,28,.24)),url('/images/brand/industry-school.png');background-size:cover;background-position:center}
.church-hero{background-image:linear-gradient(90deg,rgba(4,14,28,.93),rgba(4,14,28,.76) 46%,rgba(4,14,28,.22)),url('/images/brand/industry-church-option-c.png');background-size:cover;background-position:center}
.farm-hero{background-image:linear-gradient(90deg,rgba(4,14,28,.93),rgba(4,14,28,.76) 46%,rgba(4,14,28,.22)),url('/images/brand/industry-farm.png');background-size:cover;background-position:center}
.remote-hero{background-image:linear-gradient(90deg,rgba(4,14,28,.94),rgba(4,14,28,.78) 46%,rgba(4,14,28,.24)),url('/images/brand/industry-remote.png');background-size:cover;background-position:center}
@media(max-width:640px){.home-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.78),rgba(4,14,28,.97)),url('/images/brand/hero-server-room-crisp.jpg')!important;background-size:cover!important;background-position:58% center!important}.ai-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/ai-automation-alt.png')!important}.marina-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/industry-marina.png')}.hotel-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/industry-hotel.png')}.restaurant-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/industry-restaurant.png')}.retail-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/industry-retail.png')}.office-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/industry-office.png')}.school-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/industry-school.png')}.church-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/industry-church-option-c.png')}.farm-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/industry-farm.png')}.remote-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.66),rgba(4,14,28,.94)),url('/images/brand/industry-remote.png')}}

/* === VISUAL DIFFERENTIATION PASS: ABOUT, EXPERIENCE & SERVICES === */
.about-hero{
  background-image:linear-gradient(90deg,rgba(4,14,28,.97) 0%,rgba(4,14,28,.90) 45%,rgba(4,14,28,.34) 76%,rgba(4,14,28,.12) 100%),url('/images/brand/about-identity.svg')!important;
  background-size:cover!important;
  background-position:center!important;
}
.experience-hero{
  background-image:linear-gradient(90deg,rgba(4,14,28,.97) 0%,rgba(4,14,28,.90) 45%,rgba(4,14,28,.34) 76%,rgba(4,14,28,.12) 100%),url('/images/brand/experience-engineering.svg')!important;
  background-size:cover!important;
  background-position:center!important;
}
.cloud-hero{
  background-image:linear-gradient(90deg,rgba(4,14,28,.97) 0%,rgba(4,14,28,.88) 44%,rgba(4,14,28,.30) 76%,rgba(4,14,28,.10) 100%),url('/images/brand/cloud-option-b.png')!important;
  background-size:cover!important;
  background-position:center!important;
}
.cybersecurity-hero{
  background-image:linear-gradient(90deg,rgba(4,14,28,.97) 0%,rgba(4,14,28,.89) 44%,rgba(4,14,28,.30) 76%,rgba(4,14,28,.10) 100%),url('/images/brand/cybersecurity-shield.svg')!important;
  background-size:cover!important;
  background-position:center!important;
}
.ai-hero{
  background-image:linear-gradient(90deg,rgba(4,14,28,.97) 0%,rgba(4,14,28,.89) 44%,rgba(4,14,28,.30) 76%,rgba(4,14,28,.10) 100%),url('/images/brand/ai-automation-graphic.svg')!important;
  background-size:cover!important;
  background-position:center!important;
}
@media(max-width:640px){
  .about-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.72),rgba(4,14,28,.96)),url('/images/brand/about-identity.svg')!important;background-position:66% center!important}
  .experience-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.72),rgba(4,14,28,.96)),url('/images/brand/experience-engineering.svg')!important;background-position:66% center!important}
  .cloud-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.70),rgba(4,14,28,.96)),url('/images/brand/cloud-option-b.png')!important;background-position:64% center!important}
  .cybersecurity-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.70),rgba(4,14,28,.96)),url('/images/brand/cybersecurity-shield.svg')!important;background-position:64% center!important}
  .ai-hero{background-image:linear-gradient(180deg,rgba(4,14,28,.70),rgba(4,14,28,.96)),url('/images/brand/ai-automation-graphic.svg')!important;background-position:64% center!important}
}


/* User-selected imagery update: Cloud Option B and Church Option C applied on 2026-08-21. Alternate logo kept as /public/images/brand/logo-alternate-closeup.png for future review. */