/* ════════════════════════════════════════════════
   ROBODEUS LABS — main.css
   All theme styles. Loaded via functions.php.
   Google Fonts + Bootstrap loaded before this file.
════════════════════════════════════════════════ */

/* ── LENIS ── */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }

/* ════════════════════════════
   TOKENS
════════════════════════════ */
:root {
    --white:  #ffffff;
    --soft:   #f7f7f4;
    --navy:   #2b2d42;
    --green:  #58af6c;
    --green2: #11998e;
    --grad:   linear-gradient(135deg, #58af6c 0%, #11998e 100%);
    --font:   'Inter', sans-serif;
    --mono:   'JetBrains Mono', monospace;
    --expo:   cubic-bezier(0.16, 1, 0.3, 1);
    --quart:  cubic-bezier(0.76, 0, 0.24, 1);

    /* Navigation Palette (Monochrome: Black, White & Gray) */
    --nav-dark:       #000000;
    --nav-gray-tint:  rgba(0, 0, 0, 0.04);
    --nav-gray-hover: #f4f4f5;
    --nav-gray-text:  #666666;
    --nav-border:     rgba(0, 0, 0, 0.08);
}

/* ════════════════════════════
   BASE
════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; }
body {
    background: var(--white); color: var(--navy);
    font-family: var(--font); line-height: 1.6;
    overflow-x: hidden; cursor: none;
}
* { cursor: none !important; }
section { padding: clamp(90px, 11vw, 150px) 0; }
.fw-300 { font-weight: 300 !important; }
.fw-800 { font-weight: 800 !important; }
.text-outline       { color: transparent; -webkit-text-stroke: 1.5px var(--navy); }
.text-outline-white { color: transparent; -webkit-text-stroke: 1px rgba(255,255,255); }
.grad-text { background: var(--grad); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.section-tag {
    display: block; font-family: var(--mono);
    font-size: .62rem; letter-spacing: 4px;
    color: var(--green); text-transform: uppercase; margin-bottom: 1.4rem;
}
.body-copy        { font-size: .97rem; font-weight: 300; line-height: 1.82; color: rgba(43,45,66,.68); }
.body-copy-strong { font-size: 1rem;   font-weight: 500; line-height: 1.78; color: var(--navy); }
.v-divider { width:1px; height:100px; background: linear-gradient(to bottom, transparent, var(--green), transparent); }

/* Grain overlay */
body::after {
    content:''; position:fixed; inset:0; pointer-events:none; z-index:9900;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    opacity:.018;
}

/* ════════════════════════════
   CURSOR
════════════════════════════ */
.cur-dot {
    position:fixed; width:6px; height:6px; border-radius:50%;
    background:var(--green); pointer-events:none; z-index:9999;
    transform:translate(-50%,-50%);
    transition:width .3s var(--expo), height .3s var(--expo), background .3s;
}
.cur-ring {
    position:fixed; width:30px; height:30px; border-radius:50%;
    border:1px solid rgba(88,175,108,.45); pointer-events:none; z-index:9998;
    transform:translate(-50%,-50%);
    transition:width .3s var(--expo), height .3s var(--expo), border-color .3s;
}
.cur-dot.hov  { width:14px; height:14px; }
.cur-ring.hov { width:54px; height:54px; border-color:var(--green); }
.cur-dot.nav  { background:#fff; }
.cur-ring.nav { border-color:rgba(255,255,255,.28); }

/* ════════════════════════════
   SCROLL PROGRESS BAR
════════════════════════════ */
.scroll-progress {
    position:fixed; top:0; left:0; z-index:9000;
    height:2px; width:0%;
    background:var(--grad);
    transition:width .1s linear;
    pointer-events:none;
}

/* ════════════════════════════
   FULLSCREEN NAV
════════════════════════════ */
.nav-overlay {
    position: fixed; inset: 0; z-index: 7900;
    background: var(--navy);
    display: flex; flex-direction: column; justify-content: space-between;
    height: 100vh; height: 100dvh;
    padding: clamp(80px, 10vw, 130px) clamp(1.5rem, 5vw, 4.5rem) clamp(1.5rem, 3.5vw, 2.5rem);
    pointer-events: none;
    clip-path: circle(0% at calc(100% - 52px) 52px);
    transition: clip-path .85s var(--expo);
    overflow: hidden;
}
.nav-overlay.open {
    pointer-events: all;
    clip-path: circle(160% at calc(100% - 52px) 52px);
}
@media (max-width: 680px) {
    .nav-overlay {
        padding: 80px 1.25rem 1.5rem;
    }
}
.nav-overlay::before {
    content:''; position:absolute;
    top:0; left:clamp(2rem,6vw,6rem);
    width:1px; height:0;
    background:linear-gradient(to bottom, var(--green), transparent);
    transition:height .75s var(--expo) .3s;
}
.nav-overlay.open::before { height:55%; }
.nav-glow {
    position:absolute; width:700px; height:700px;
    bottom:-250px; right:-150px;
    background:radial-gradient(circle, rgba(88,175,108,.07) 0%, transparent 65%);
    pointer-events:none;
}
.nav-links { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; }
.nav-li { overflow:hidden; border-bottom:1px solid rgba(255,255,255,.05); }
.nav-li:first-child { border-top:1px solid rgba(255,255,255,.05); }
.nav-a {
    display:flex; align-items:center; justify-content:space-between;
    text-decoration:none; padding:clamp(.85rem,1.8vw,1.3rem) 0;
    transform:translateY(110%); transition:transform .65s var(--expo);
}
.nav-overlay.open .nav-a { transform:translateY(0); }
.nav-li:nth-child(1) .nav-a { transition-delay:.10s; }
.nav-li:nth-child(2) .nav-a { transition-delay:.17s; }
.nav-li:nth-child(3) .nav-a { transition-delay:.24s; }
.nav-li:nth-child(4) .nav-a { transition-delay:.31s; }
.nav-li:nth-child(5) .nav-a { transition-delay:.38s; }
.nav-word {
    font-size:clamp(2.2rem,6vw,5.5rem); font-weight:800;
    letter-spacing:-2px; line-height:1; text-transform:uppercase;
    color:rgba(255,255,255,.12);
    transition:color .35s, letter-spacing .4s var(--expo);
}
.nav-li:hover .nav-word { color:#fff; letter-spacing:-.5px; }
.nav-meta { display:flex; align-items:center; gap:.9rem; }
.nav-num { font-family:var(--mono); font-size:.58rem; letter-spacing:3px; color:rgba(255,255,255,.18); transition:color .3s; }
.nav-li:hover .nav-num { color:var(--green); }
.nav-arr {
    width:36px; height:36px; border-radius:50%;
    border:1px solid rgba(255,255,255,.08);
    display:flex; align-items:center; justify-content:center;
    color:rgba(255,255,255,.2); font-size:.8rem;
    transform:rotate(-45deg); transition:all .4s var(--expo);
}
.nav-li:hover .nav-arr { background:var(--green); border-color:var(--green); color:#fff; transform:rotate(0); }
.nav-foot {
    display:flex; align-items:flex-end; justify-content:space-between;
    opacity:0; transform:translateY(14px);
    transition:opacity .5s ease .5s, transform .5s var(--expo) .5s;
}
.nav-overlay.open .nav-foot { opacity:1; transform:translateY(0); }
.nav-foot-l { font-family:var(--mono); font-size:.68rem; letter-spacing:1px; color:rgba(255,255,255,.22); line-height:1.85; }
.nav-foot-l a { color:var(--green); text-decoration:none; }
.nav-foot-r { font-family:var(--mono); font-size:.6rem; letter-spacing:3px; text-transform:uppercase; color:rgba(255,255,255,.08); text-align:right; line-height:1.9; }

/* ════════════════════════════
   HEADER
════════════════════════════ */
.site-header {
    position: fixed; top: 0; left: 0; right: 0; z-index: 8000;
    padding: 1.15rem 0;
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
    transition: padding .4s var(--expo), box-shadow .35s, background .35s;
}
.site-header.scrolled {
    padding: 0.75rem 0;
    box-shadow: 0 8px 32px rgba(43, 45, 66, 0.06);
}
.site-header.nav-open {
    background: transparent !important;
    border-bottom-color: transparent !important;
    box-shadow: none !important;
}
.hdr-inner {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0 clamp(1.2rem, 3.5vw, 3.5rem);
    max-width: 1560px; margin: 0 auto; width: 100%;
    position: relative;
}

/* Brand Logo (Left) */
.hdr-logo {
    display: flex; align-items: center;
    text-decoration: none; flex-shrink: 0;
}
.hdr-logo img {
    width: 36px; height: auto;
    transition: filter .35s, transform .4s var(--expo);
}
.site-header.nav-open .hdr-logo img { filter: brightness(0) invert(1); }
.hdr-logo:hover img { transform: scale(1.08) rotate(-3deg); }

/* Desktop Navigation (Center) */
.hdr-nav {
    display: flex; align-items: center;
    margin: 0 auto;
}
@media (max-width: 1180px) {
    .hdr-nav { display: none; }
}
.hdr-nav-list {
    display: flex; align-items: center; gap: 4px;
    list-style: none; margin: 0; padding: 0;
}
.hdr-nav-item {
    position: relative;
}
.hdr-nav-link {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 14px;
    font-family: var(--font); font-size: 0.88rem; font-weight: 500;
    color: var(--navy); text-decoration: none;
    border-radius: 6px; border: none; background: transparent;
    transition: color .2s, background .2s;
    cursor: none;
}
.hdr-nav-link:hover,
.hdr-nav-item:hover > .hdr-nav-link,
.hdr-nav-item.is-active > .hdr-nav-link {
    color: #000000;
    background: rgba(0, 0, 0, 0.05);
}
.hdr-chevron {
    width: 8px; height: 5px;
    color: rgba(43, 45, 66, 0.38);
    transition: transform .3s var(--expo), color .2s;
}
.hdr-nav-link:hover .hdr-chevron,
.hdr-nav-item:hover .hdr-chevron,
.hdr-nav-item.is-active .hdr-chevron {
    transform: rotate(180deg);
    color: #000000;
}

/* Dropdown Base (Clean, Frosted, Monochrome) */
.hdr-dropdown {
    position: absolute; top: calc(100% + 14px);
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-top: 2px solid #000000;
    border-radius: 12px;
    box-shadow: 0 24px 60px -12px rgba(0, 0, 0, 0.12), 0 0 1px rgba(0, 0, 0, 0.08);
    opacity: 0; visibility: hidden; pointer-events: none;
    transform: translateY(8px);
    transition: opacity .22s var(--expo), transform .22s var(--expo), visibility .22s;
    z-index: 8500; overflow: hidden;
    padding: 1.1rem;
    min-width: 360px;
}
/* Safe hover bridge */
.hdr-dropdown::before {
    content: ''; position: absolute;
    top: -16px; left: 0; right: 0; height: 16px;
}
.hdr-nav-item:hover > .hdr-dropdown,
.hdr-nav-item:focus-within > .hdr-dropdown,
.hdr-dropdown.is-open {
    opacity: 1; visibility: visible; pointer-events: all;
    transform: translateY(0);
}

/* Sub-menu Grid & List Layouts */
.hdr-sub-grid {
    display: grid; list-style: none;
    margin: 0; padding: 0; gap: 0.45rem;
}
.hdr-sub-grid--2col {
    grid-template-columns: 1fr 1fr;
}
.hdr-sub-list {
    display: flex; flex-direction: column;
    list-style: none; margin: 0; padding: 0; gap: 0.45rem;
    width: 100%;
}
.hdr-sub-item {
    list-style: none; margin: 0; padding: 0;
    width: 100%;
}
.hdr-sub-link {
    display: block;
    width: 100%;
    padding: 0.8rem 1rem;
    border-radius: 8px; text-decoration: none;
    border-left: 2px solid transparent;
    background: transparent;
    transition: all .2s var(--expo);
}
.hdr-sub-link:hover {
    background: #f4f4f5;
    border-left-color: #000000;
    transform: translateX(3px);
}
.hdr-sub-title {
    display: block;
    font-family: var(--font); font-size: 0.88rem; font-weight: 600;
    color: #111111; line-height: 1.3;
    transition: color .2s;
}
.hdr-sub-link:hover .hdr-sub-title {
    color: #000000;
}
.hdr-sub-desc {
    display: block;
    font-family: var(--font); font-size: 0.76rem; font-weight: 300;
    line-height: 1.5; color: #666666;
    margin-top: 4px; margin-bottom: 0;
}

/* Specific Dropdown Dimensions */
.hdr-dropdown--solutions {
    left: -120px;
    width: clamp(740px, 58vw, 840px);
}
.hdr-dropdown--expertise {
    left: -120px;
    width: clamp(680px, 52vw, 760px);
}
.hdr-dropdown--mega {
    left: -120px;
    width: clamp(680px, 52vw, 840px);
}
.hdr-dropdown--lab,
.hdr-dropdown--single {
    left: -80px;
    width: 380px;
    max-width: calc(100vw - 40px);
}

/* Header Actions & CTA Button (Right) */
.hdr-actions {
    display: flex; align-items: center; gap: 14px;
    flex-shrink: 0;
}
.hdr-cta-btn {
    display: inline-flex; align-items: center; gap: 8px;
    background: #000000; color: #ffffff; text-decoration: none;
    font-family: var(--mono); font-size: 0.62rem; letter-spacing: 2px;
    text-transform: uppercase; font-weight: 500;
    padding: 10px 20px; border-radius: 4px;
    border: 1px solid #000000;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
    transition: transform .25s var(--expo), box-shadow .25s, background .2s, color .2s, border-color .2s;
    white-space: nowrap;
}
.hdr-cta-btn:hover {
    transform: translateY(-2px);
    background: #ffffff;
    color: #000000;
    border-color: #000000;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}
.hdr-cta-btn svg {
    transition: transform .25s var(--expo);
}
.hdr-cta-btn:hover svg {
    transform: translateX(3px);
}
.site-header.nav-open .hdr-cta-btn {
    display: none;
}
@media (max-width: 680px) {
    .hdr-cta-btn { display: none; }
}

/* Fullscreen Nav Overlay CTA Button */
.nav-overlay .hdr-cta-btn {
    background: #ffffff;
    color: #000000;
    border: 1px solid #ffffff;
    box-shadow: 0 4px 14px rgba(255, 255, 255, 0.12);
}
.nav-overlay .hdr-cta-btn:hover {
    background: #000000;
    color: #ffffff;
    border-color: #ffffff;
    box-shadow: 0 8px 24px rgba(255, 255, 255, 0.2);
}

/* Mobile Nav Overlay Updates */
.nav-glow {
    position: absolute; inset: 0;
    background: radial-gradient(ellipse at 85% 20%, rgba(255, 255, 255, 0.05) 0%, transparent 65%);
    pointer-events: none;
}
.nav-overlay-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 6px;
    padding-bottom: 2.5rem;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
    -webkit-overflow-scrolling: touch;
}
.nav-overlay-scroll::-webkit-scrollbar {
    width: 4px;
}
.nav-overlay-scroll::-webkit-scrollbar-track {
    background: transparent;
}
.nav-overlay-scroll::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.15);
    border-radius: 4px;
}
.nav-acc-item {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    padding: 0.45rem 0;
    transition: border-color .3s;
}
.nav-acc-item.is-open {
    border-bottom-color: rgba(255, 255, 255, 0.16);
}
.nav-acc-trigger {
    width: 100%; display: flex; align-items: center; justify-content: space-between;
    background: transparent; border: none; padding: 0.7rem 0;
    color: #ffffff; text-align: left; cursor: pointer;
    user-select: none; -webkit-tap-highlight-color: transparent;
    transition: transform .25s var(--expo);
}
.nav-acc-word {
    font-size: clamp(1.4rem, 3.8vw, 2.2rem); font-weight: 800;
    letter-spacing: -0.5px; text-transform: uppercase;
    color: rgba(255, 255, 255, 0.4);
    transition: color .3s, transform .3s var(--expo);
}
.nav-acc-trigger:hover .nav-acc-word,
.nav-acc-item.is-open .nav-acc-word {
    color: #ffffff;
    transform: translateX(4px);
}
.nav-acc-icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px; border-radius: 50%;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    font-family: var(--mono); font-size: 1rem; line-height: 1;
    color: rgba(255, 255, 255, 0.65);
    transition: transform .35s var(--expo), background .3s, border-color .3s, color .3s;
    flex-shrink: 0;
}
.nav-acc-trigger:hover .nav-acc-icon {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.25);
    color: #ffffff;
}
.nav-acc-item.is-open .nav-acc-icon {
    transform: rotate(45deg);
    background: rgba(88, 175, 108, 0.15);
    border-color: rgba(88, 175, 108, 0.5);
    color: #58af6c;
}
.nav-acc-body {
    max-height: 0; overflow: hidden;
    transition: max-height .5s cubic-bezier(0.16, 1, 0.3, 1), opacity .3s ease;
    opacity: 0;
}
.nav-acc-item.is-open .nav-acc-body {
    max-height: 2500px;
    opacity: 1;
}
.nav-acc-links {
    list-style: none; padding: 0.6rem 0 1.25rem; margin: 0;
    display: flex; flex-direction: column; gap: 0.65rem;
    width: 100%;
}
@media (min-width: 720px) {
    .nav-acc-links {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0.75rem 1rem;
    }
}
.nav-acc-links li {
    list-style: none; margin: 0; padding: 0;
    width: 100%; min-width: 0;
}
.nav-acc-link {
    text-decoration: none; display: block;
    width: 100%; box-sizing: border-box;
    padding: 0.85rem 1.1rem;
    background: rgba(255, 255, 255, 0.025);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-left: 2px solid transparent;
    border-radius: 8px;
    transition: all .22s var(--expo);
}
.nav-acc-link:hover,
.nav-acc-link:focus-visible {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.14);
    border-left-color: #58af6c;
    transform: translateX(4px);
}
.nav-acc-title {
    font-size: 0.94rem; font-weight: 600; line-height: 1.35;
    color: #ffffff; letter-spacing: -0.2px;
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    transition: color .2s;
}
.nav-acc-title::after {
    content: '↗';
    font-family: var(--mono); font-size: 0.8rem;
    opacity: 0; transform: translate(-3px, 3px);
    transition: opacity .2s, transform .2s var(--expo);
    color: #58af6c; flex-shrink: 0;
}
.nav-acc-link:hover .nav-acc-title::after,
.nav-acc-link:focus-visible .nav-acc-title::after {
    opacity: 1; transform: translate(0, 0);
}
.nav-acc-desc {
    font-size: 0.77rem; font-weight: 300; line-height: 1.5;
    color: rgba(255, 255, 255, 0.52);
    margin-top: 4px; margin-bottom: 0;
    transition: color .2s;
}
.nav-acc-link:hover .nav-acc-desc,
.nav-acc-link:focus-visible .nav-acc-desc {
    color: rgba(255, 255, 255, 0.82);
}
.nav-foot {
    display: flex; align-items: flex-end; justify-content: space-between;
    padding-top: 1.2rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    opacity: 0; transform: translateY(10px);
    transition: opacity .4s ease .3s, transform .4s var(--expo) .3s;
    flex-shrink: 0;
}
.nav-overlay.open .nav-foot {
    opacity: 1; transform: translateY(0);
}
.nav-foot-l {
    font-family: var(--mono); font-size: .68rem; letter-spacing: 1px;
    color: rgba(255, 255, 255, .3); line-height: 1.85;
}
.nav-foot-l a {
    color: #58af6c; text-decoration: none;
    transition: color .2s;
}
.nav-foot-l a:hover {
    color: #ffffff;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.nav-foot-r {
    font-family: var(--mono); font-size: .6rem; letter-spacing: 3px;
    text-transform: uppercase; color: rgba(255, 255, 255, .15); text-align: right; line-height: 1.9;
}
@media (max-width: 600px) {
    .nav-foot {
        flex-direction: column; align-items: flex-start; gap: 0.75rem;
    }
    .nav-foot-r { text-align: left; }
}

/* Hamburger (Mobile & Small Screens ONLY - Hidden on Desktop Wide View) */
.nav-toggle {
    display: none; /* Hidden on desktop */
    position: relative; z-index: 8100;
    width: 48px; height: 48px;
    background: transparent; border: none; padding: 0;
    flex-direction: column;
    align-items: center; justify-content: center; gap: 5px;
}
@media (max-width: 1180px) {
    .nav-toggle {
        display: flex; /* Visible on mobile & tablet only */
    }
}
.nav-toggle::before {
    content: ''; position: absolute; inset: 0; border-radius: 50%;
    border: 1px solid rgba(43, 45, 66, 0.18);
    transition: transform .6s var(--expo), border-color .35s;
}
.site-header.nav-open .nav-toggle::before { border-color: rgba(255, 255, 255, 0.28); }
.nav-toggle:hover::before { transform: scale(1.15); border-color: rgba(43, 45, 66, 0.45); }
.toggle-lbl {
    position: absolute; right: calc(100% + 12px); top: 50%; transform: translateY(-50%);
    font-family: var(--mono); font-size: .52rem; letter-spacing: 3px;
    text-transform: uppercase; white-space: nowrap;
    color: rgba(43, 45, 66, 0.3); opacity: 0; transition: opacity .3s; pointer-events: none;
}
.site-header.nav-open .toggle-lbl { color: rgba(255, 255, 255, 0.3); }
.nav-toggle:hover .toggle-lbl { opacity: 1; }
.bar {
    display: block; width: 22px; height: 1.5px;
    background: var(--navy); border-radius: 2px; transform-origin: center;
    transition: transform .5s var(--expo), opacity .3s, background .35s;
}
.site-header.nav-open .bar { background: #fff; }
.site-header.nav-open .bar-1 { transform: translateY(6.5px) rotate(45deg); }
.site-header.nav-open .bar-2 { opacity: 0; transform: scaleX(0); }
.site-header.nav-open .bar-3 { transform: translateY(-6.5px) rotate(-45deg); }

/* ════════════════════════════
   HERO
════════════════════════════ */
.hero-section {
    min-height: 100vh; background: var(--white);
    position: relative; overflow: hidden;
    display: flex; align-items: center; padding: 0;
}
#heroCanvas {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    pointer-events: none; z-index: 0;
}
.hero-ghost {
    position: absolute; bottom: -8%; right: -2%;
    font-size: 30vw; font-weight: 900;
    color: rgba(43,45,66,.022); letter-spacing: -5vw; line-height: 1;
    pointer-events: none; user-select: none; text-transform: uppercase;
    will-change: transform;
}
.hero-accent {
    position: absolute; left: 0; top: 15%; bottom: 15%; width: 3px;
    background: linear-gradient(to bottom, transparent, var(--green) 30%, var(--green) 70%, transparent);
    opacity: .3;
}
.hero-inner {
    position: relative; z-index: 5;
    padding-top: clamp(110px,14vw,160px);
    padding-bottom: clamp(50px,7vw,80px);
    width: 100%;
    display: flex; flex-direction: column; gap: 0;
}

/* Stagger reveals */
.rv  { opacity:0; transform:translateY(26px); }
.rv1 { animation:rv-up 1s var(--expo) .20s forwards; }
.rv2 { animation:rv-up 1s var(--expo) .40s forwards; }
.rv3 { animation:rv-up 1s var(--expo) .58s forwards; }
.rv4 { animation:rv-up 1s var(--expo) .76s forwards; }
.rv5 { animation:rv-up 1s var(--expo) .94s forwards; }
@keyframes rv-up { to { opacity:1; transform:translateY(0); } }

.hero-eyebrow {
    display: flex; align-items: center; gap: 12px;
    margin-bottom: clamp(1.5rem,3vw,2.5rem);
}
.pulse-dot {
    width:8px; height:8px; flex-shrink:0;
    background:var(--green); border-radius:50%;
    box-shadow:0 0 0 0 rgba(88,175,108,.5);
    animation:pulse-anim 2.5s infinite;
}
@keyframes pulse-anim {
    0%  { box-shadow:0 0 0 0   rgba(88,175,108,.5); }
    70% { box-shadow:0 0 0 10px rgba(88,175,108,0); }
    100%{ box-shadow:0 0 0 0   rgba(88,175,108,0); }
}
.eyebrow-txt {
    font-family:var(--mono); font-size:.65rem;
    letter-spacing:3px; text-transform:uppercase; color:rgba(43,45,66,.55);
}
.hero-title {
    font-size: clamp(4rem, 11vw, 11rem);
    font-weight: 900; line-height: .86;
    letter-spacing: -.05em; text-transform: uppercase;
    margin-bottom: clamp(2rem,4vw,3.5rem);
}
.hero-title .solid    { display:block; color:var(--navy); }
.hero-title .outlined { display:block; color:transparent; -webkit-text-stroke:1.5px rgba(43,45,66); }
.hero-title .green    { display:block; background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.hero-sub-row {
    display: flex; align-items: flex-end;
    justify-content: space-between; gap: 2rem;
    flex-wrap: wrap;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(43,45,66,.07);
}
.hero-sub {
    font-size: 1rem; font-weight: 300;
    color: rgba(43,45,66,.6); line-height: 1.8;
    max-width: 540px; margin: 0;
}

/* Buttons */
.btn-lab {
    display:inline-flex; align-items:center; gap:12px;
    background:var(--grad); color:#fff; text-decoration:none;
    font-family:var(--mono); font-size:.68rem; letter-spacing:3px; text-transform:uppercase;
    padding:16px 36px; position:relative; overflow:hidden;
    transition:transform .4s var(--expo), box-shadow .4s;
}
.btn-lab::before {
    content:''; position:absolute; inset:0;
    background:rgba(255,255,255,.12); transform:translateX(-101%);
    transition:transform .4s var(--expo);
}
.btn-lab:hover::before { transform:translateX(0); }
.btn-lab:hover { transform:translateY(-4px); box-shadow:0 18px 36px rgba(88,175,108,.22); color:#fff; }
.btn-arrow { transition:transform .3s; }
.btn-lab:hover .btn-arrow { transform:translateX(5px); }

.scroll-cue {
    position:absolute; bottom:36px; left:50%; transform:translateX(-50%);
    display:flex; flex-direction:column; align-items:center; gap:8px;
    opacity:0; animation:fade-in 1s ease 1.8s forwards;
}
@keyframes fade-in { to { opacity:1; } }
.sc-line { width:1px; height:48px; background:rgba(43,45,66,.07); position:relative; overflow:hidden; }
.sc-line::after {
    content:''; position:absolute; top:-100%; width:100%; height:100%;
    background:var(--green); animation:sc-drop 2.2s ease infinite;
}
@keyframes sc-drop { 0%{top:-100%;} 100%{top:100%;} }
.sc-lbl { font-family:var(--mono); font-size:.5rem; letter-spacing:3px; color:rgba(43,45,66,.18); text-transform:uppercase; }

/* ════════════════════════════
   THESIS
════════════════════════════ */
.thesis-section { background:var(--white); position:relative; overflow:hidden; }
.thesis-grid {
    position:absolute; inset:0;
    background-image:linear-gradient(rgba(43,45,66,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(43,45,66,.03) 1px,transparent 1px);
    background-size:60px 60px; pointer-events:none;
}
.thesis-bg-n {
    position:absolute; right:-1rem; top:50%; transform:translateY(-50%);
    font-size:22vw; font-weight:900; line-height:1;
    color:rgba(43,45,66,.022); pointer-events:none; user-select:none; letter-spacing:-3vw;
    will-change:transform;
}
.thesis-mantra { font-size:calc(1.9rem + 2.2vw); font-weight:400; line-height:1.12; color:var(--navy); }
.thesis-mantra em  { font-style:italic; color:var(--green); font-weight:500; }
.thesis-mantra .dim { color:rgba(43,45,66,.28); }
.thesis-card { border-left:2px solid var(--green); padding-left:2rem; }

/* ════════════════════════════
   IDENTITY
════════════════════════════ */
.identity-section { background:var(--soft); position:relative; overflow:hidden; }
.identity-img {
    position:absolute; top:0; right:0; width:40%; height:100%;
    overflow:hidden; pointer-events:none;
}
.identity-img::before {
    content:''; position:absolute; inset:0; z-index:2;
    background:linear-gradient(to right, var(--soft) 0%, rgba(247,247,244,.5) 40%, transparent 100%);
}
.identity-img img { width:100%; height:110%; object-fit:cover; filter:grayscale(60%) brightness(.85); will-change:transform; }
.identity-title { font-size:calc(2.4rem + 1.5vw); font-weight:300; line-height:1.05; letter-spacing:-.04em; color:var(--navy); }

/* ════════════════════════════
   VERTICALS
════════════════════════════ */
.verticals-section { background:var(--white); }
.vt-title { font-size:calc(3.5rem + 4vw); letter-spacing:-3px; font-weight:300; line-height:.9; }
.v-card {
    padding:2.8rem; border:1px solid rgba(43,45,66,.06);
    height:100%; position:relative; overflow:hidden;
    transition:all .5s var(--expo); background:var(--white);
}
.v-card::before {
    content:''; position:absolute; top:0; left:0;
    width:0; height:2px; background:var(--grad); transition:width .5s var(--expo);
}
.v-card:hover { border-color:rgba(88,175,108,.3); transform:translateY(-8px); box-shadow:0 24px 50px rgba(0,0,0,.05); }
.v-card:hover::before { width:100%; }
.blob-wrap { position:relative; width:64px; height:64px; margin-bottom:2rem; display:flex; align-items:center; justify-content:center; }
.blob { position:absolute; inset:0; background:var(--grad); opacity:.85; filter:blur(1px); border-radius:60% 40% 30% 70%/60% 30% 70% 40%; animation:blob-morph 8s ease-in-out infinite; }
.blob.b2 { animation-delay:-3s; }
.blob.b3 { animation-delay:-6s; }
@keyframes blob-morph { 0%,100%{border-radius:60% 40% 30% 70%/60% 30% 70% 40%;} 50%{border-radius:30% 60% 70% 40%/50% 60% 30% 60%;} }
.blob-num { position:relative; z-index:2; color:#fff; font-family:var(--mono); font-weight:700; font-size:.7rem; }
.v-label { font-family:var(--mono); font-size:.6rem; letter-spacing:2px; text-transform:uppercase; color:var(--green); margin-bottom:.7rem; }
.v-name  { font-size:2rem; font-weight:300; letter-spacing:2px; text-transform:uppercase; color:var(--navy); margin-bottom:.9rem; }

/* ════════════════════════════
   CAPABILITIES
════════════════════════════ */
.cap-section { background:var(--soft); }
.cap-title { font-size:calc(2.5rem + 2.5vw); font-weight:300; letter-spacing:-2px; line-height:.95; }
.cap-row {
    display:grid; grid-template-columns:150px 1fr 32px;
    align-items:start; gap:2rem; padding:2.4rem 0;
    border-top:1px solid rgba(43,45,66,.07); position:relative;
    transition:padding-left .4s var(--expo);
}
.cap-row::after { content:''; position:absolute; bottom:0; left:0; width:0; height:1px; background:var(--green); transition:width .5s var(--expo); }
.cap-row:last-child { border-bottom:1px solid rgba(43,45,66,.07); }
.cap-row:hover::after { width:100%; }
.cap-row:hover { padding-left:.5rem; }
.cap-row:hover .cap-name  { color:var(--green); }
.cap-row:hover .cap-arrow { color:var(--green); transform:translate(3px,-3px); }
.cap-code  { font-family:var(--mono); font-size:.58rem; letter-spacing:2px; color:var(--green); padding-top:5px; }
.cap-name  { font-size:1.22rem; font-weight:600; color:var(--navy); margin-bottom:.45rem; letter-spacing:-.3px; transition:color .3s; }
.cap-desc  { font-size:.93rem; font-weight:300; line-height:1.78; color:rgba(43,45,66,.5); }
.cap-arrow { font-size:1rem; color:rgba(43,45,66,.18); transition:all .3s; padding-top:5px; }
@media(max-width:767px){ .cap-row{grid-template-columns:1fr;gap:.7rem;} .cap-arrow{display:none;} }

/* ════════════════════════════
   CASE STUDIES — HOMEPAGE GRID
════════════════════════════ */
.work-section { background:var(--navy); position:relative; overflow:hidden; }
.work-section::before {
    content:''; position:absolute; inset:0;
    background-image:linear-gradient(rgba(88,175,108,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(88,175,108,.03) 1px,transparent 1px);
    background-size:55px 55px;
}
.work-glow {
    position:absolute; top:0; right:0; width:60vw; height:100%;
    background:radial-gradient(ellipse at 80% 40%, rgba(88,175,108,.06) 0%, transparent 65%);
    pointer-events:none;
}
.work-title {
    font-size:calc(2.8rem + 2.5vw); font-weight:300;
    letter-spacing:-2px; line-height:.95; color:rgba(255,255,255,.88);
}
.work-intro { font-size:.95rem; font-weight:300; line-height:1.8; color:rgba(255,255,255,.32); max-width:420px; }

.cs-grid {
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:1.5px;
    background:rgba(255,255,255,.04);
}
@media(max-width:991px){ .cs-grid { grid-template-columns:1fr 1fr; } }
@media(max-width:600px) { .cs-grid { grid-template-columns:1fr; } }
/* cs-card--featured — first card spans full width */
.cs-card--featured { grid-column:1 / -1; }

.cs-card {
    background:var(--navy);
    padding:2.8rem; position:relative; overflow:hidden;
    display:flex; flex-direction:column;
    transition:background .4s;
}
.cs-card:hover { background:#343650; }
.cs-img {
    width:calc(100% + 5.6rem);
    margin:-2.8rem -2.8rem 2rem -2.8rem;
    height:220px; overflow:hidden; position:relative;
}
.cs-img::after {
    content:''; position:absolute; inset:0;
    background:linear-gradient(to bottom, rgba(43,45,66,.2), var(--navy));
}
.cs-img img { width:100%; height:100%; object-fit:cover; filter:grayscale(30%) brightness(.75); transition:transform .8s var(--expo); }
.cs-card:hover .cs-img img { transform:scale(1.05); }
.cs-card--featured .cs-img { height:340px; }
.cs-card--featured .cs-body { display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:start; }
@media(max-width:767px){ .cs-card--featured .cs-body { grid-template-columns:1fr; gap:1.5rem; } }

.cs-index {
    font-family:var(--mono); font-size:.6rem; letter-spacing:3px;
    color:var(--green); margin-bottom:1.5rem;
    display:flex; align-items:center; gap:.8rem; flex-wrap:wrap;
}
.cs-pill {
    font-family:var(--mono); font-size:.55rem; letter-spacing:2px; text-transform:uppercase;
    background:rgba(88,175,108,.1); color:var(--green);
    border:1px solid rgba(88,175,108,.2); padding:3px 10px;
}
.cs-headline {
    font-size:1.25rem; font-weight:600; letter-spacing:-.3px;
    color:rgba(255,255,255,.88); line-height:1.35; margin-bottom:1rem;
}
.cs-card--featured .cs-headline { font-size:1.5rem; }
.cs-context {
    font-size:.88rem; font-weight:300; line-height:1.78;
    color:rgba(255,255,255,.35); margin-bottom:2rem; flex:1;
}
.cs-outcomes {
    border-top:1px solid rgba(255,255,255,.06); padding-top:1.5rem;
    display:grid; grid-template-columns:1fr 1fr; gap:1.2rem;
}
.cs-out-num {
    font-size:1.7rem; font-weight:800;
    background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent;
    line-height:1;
}
.cs-out-lbl { font-family:var(--mono); font-size:.58rem; letter-spacing:2px; color:rgba(255,255,255,.2); text-transform:uppercase; margin-top:4px; }
.cs-link {
    display:inline-flex; align-items:center; gap:8px; margin-top:1.5rem;
    font-family:var(--mono); font-size:.62rem; letter-spacing:2px; text-transform:uppercase;
    color:var(--green); text-decoration:none; transition:gap .3s;
}
.cs-link:hover { gap:14px; color:var(--green); }

/* ════════════════════════════
   CASE STUDY — SINGLE PAGE
════════════════════════════ */
.cs-single-hero {
    position:relative; min-height:70vh;
    background:var(--navy); overflow:hidden;
    display:flex; align-items:flex-end;
    padding-bottom:clamp(60px,8vw,100px);
}
.cs-single-img {
    position:absolute; inset:0;
}
.cs-single-img img {
    width:100%; height:100%; object-fit:cover;
    filter:grayscale(40%) brightness(.4);
}
.cs-single-img::after {
    content:''; position:absolute; inset:0;
    background:linear-gradient(to top, var(--navy) 20%, rgba(43,45,66,.5) 100%);
}
.cs-single-hero-inner { position:relative; z-index:2; width:100%; padding-top:140px; }
.cs-back {
    font-family:var(--mono); font-size:.6rem; letter-spacing:3px;
    text-transform:uppercase; color:rgba(255,255,255,.28);
    text-decoration:none; transition:color .3s;
}
.cs-back:hover { color:var(--green); }
.cs-single-title {
    font-size:calc(2rem + 2.5vw); font-weight:700;
    color:#fff; line-height:1.1; letter-spacing:-.03em;
    max-width:780px; margin-top:1rem;
}

/* Outcomes bar */
.cs-single-outcomes {
    background:rgba(43,45,66,.04);
    border-top:1px solid rgba(43,45,66,.06);
    border-bottom:1px solid rgba(43,45,66,.06);
    padding:2.5rem 0;
}
.cs-outcomes-bar {
    display:flex; gap:3rem; flex-wrap:wrap;
}
.cs-ob-item {}
.cs-single-outcomes .cs-out-num {
    font-size:2.2rem;
    background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
.cs-single-outcomes .cs-out-lbl {
    font-family:var(--mono); font-size:.6rem; letter-spacing:2px;
    color:rgba(43,45,66,.35); text-transform:uppercase; margin-top:4px;
}

/* Body content */
.cs-single-body { padding:clamp(60px,9vw,120px) 0; }
.cs-content { font-size:1.06rem; font-weight:300; line-height:1.9; color:rgba(43,45,66,.7); }
.cs-content h2 { font-size:1.5rem; font-weight:600; color:var(--navy); margin:3rem 0 1rem; }
.cs-content h3 { font-size:1.2rem; font-weight:600; color:var(--navy); margin:2.5rem 0 .8rem; }
.cs-content p  { margin-bottom:1.5rem; }
.cs-content blockquote {
    border-left:2px solid var(--green); padding-left:1.5rem;
    margin:2rem 0; font-style:italic; color:rgba(43,45,66,.55);
}

/* Next case study */
.cs-next {
    border-top:1px solid rgba(43,45,66,.07);
    padding:clamp(40px,6vw,80px) 0;
    background:var(--soft);
}
.cs-next-link {
    display:flex; align-items:center; justify-content:space-between;
    text-decoration:none; gap:2rem;
    padding:1.5rem 0;
    transition:padding-left .4s var(--expo);
}
.cs-next-link:hover { padding-left:.5rem; }
.cs-next-title {
    font-size:calc(1.4rem + 1vw); font-weight:300;
    color:var(--navy); letter-spacing:-.02em; line-height:1.2;
    transition:color .3s;
}
.cs-next-link:hover .cs-next-title { color:var(--green); }
.cs-next-arrow {
    font-size:2rem; color:rgba(43,45,66,.2);
    transition:all .4s var(--expo); flex-shrink:0;
}
.cs-next-link:hover .cs-next-arrow { color:var(--green); transform:translateX(8px); }

/* ════════════════════════════
   PARADIGM
════════════════════════════ */
.paradigm-section {
    background: var(--navy);
    padding: clamp(100px,13vw,160px) 0;
    position: relative; overflow: hidden;
}
.paradigm-noise {
    position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
    background-size: 200px; opacity: .4;
}
.paradigm-title {
    font-size: clamp(2.2rem,4.5vw,3.8rem);
    font-weight: 300; letter-spacing: -.04em;
    line-height: 1.05; color: rgba(255,255,255,.85);
    margin-top: 1.2rem; margin-bottom: 1.5rem;
}
.paradigm-title-accent {
    background: var(--grad);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    font-weight: 700;
}
.paradigm-lead {
    font-size: .95rem; font-weight: 300; line-height: 1.75;
    color: rgba(255,255,255,.4); margin-bottom: 2rem;
}
.paradigm-line { width: 40px; height: 2px; background: var(--grad); }

/* 2×2 shift card grid */
.evo-grid {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: 1.5px; background: rgba(255,255,255,.04);
    margin-bottom: 2.5rem;
}
@media(max-width:600px) { .evo-grid { grid-template-columns: 1fr; } }

.evo-card {
    background: rgba(255,255,255,.02);
    padding: clamp(1.5rem,3vw,2.2rem);
    position: relative; overflow: hidden;
    transition: background .4s var(--expo);
}
.evo-card::before {
    content: ''; position: absolute;
    left: 0; top: 0; bottom: 0; width: 2px;
    background: var(--grad);
    transform: scaleY(0); transform-origin: bottom;
    transition: transform .5s var(--expo);
}
.evo-card:hover { background: rgba(255,255,255,.05); }
.evo-card:hover::before { transform: scaleY(1); }

.evo-card-num {
    font-family: var(--mono); font-size: .5rem;
    letter-spacing: 3px; color: rgba(255,255,255,.2);
    margin-bottom: 1.2rem;
}
.evo-card-body { display: flex; flex-direction: column; gap: .7rem; }

.evo-from {
    font-family: var(--mono); font-size: .7rem;
    letter-spacing: 1px; text-transform: uppercase;
    color: rgba(255,255,255,.3);
    text-decoration: line-through;
    text-decoration-color: rgba(255,255,255,.15);
}
.evo-arrow-wrap {
    display: flex; align-items: center; gap: .5rem; color: var(--green);
}
.evo-arrow-line {
    flex: 1; height: 1px;
    background: linear-gradient(to right, rgba(88,175,108,.3), rgba(88,175,108,.7));
    transform: scaleX(0.3); transform-origin: left;
    transition: transform .5s var(--expo) .1s;
}
.evo-card:hover .evo-arrow-line { transform: scaleX(1); }
.evo-to {
    font-size: 1.05rem; font-weight: 500;
    color: rgba(255,255,255,.78); line-height: 1.3;
    letter-spacing: -.02em; transition: color .3s;
}
.evo-card:hover .evo-to { color: #fff; }

.paradigm-footnote {
    font-size: .9rem; font-weight: 300; font-style: italic;
    color: rgba(255,255,255,.3); line-height: 1.8;
    border-left: 1px solid rgba(88,175,108,.3);
    padding-left: 1.2rem;
}
.paradigm-footnote em { color: var(--green); font-style: normal; }

/* ════════════════════════════
   CTA (COMMON & EXPERTISE / SOLUTION PAGES)
════════════════════════════ */
.cta-section {
    background: #ffffff;
    text-align: center;
    padding: clamp(80px, 10vw, 140px) 0;
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(43, 45, 66, 0.06);
    border-bottom: 1px solid rgba(43, 45, 66, 0.06);
}
.cta-super {
    font-size: calc(2.2rem + 3.5vw);
    font-weight: 300;
    letter-spacing: -2px;
    line-height: 0.96;
    margin-bottom: 2rem;
}
.cta-super .hi  { color: var(--sol-accent, var(--exp-accent, var(--green))); }
.cta-super .out { color: transparent; -webkit-text-stroke: 1.5px rgba(43, 45, 66, 0.8); }
.cta-body {
    font-size: 1rem;
    font-weight: 350;
    line-height: 1.8;
    color: rgba(43, 45, 66, 0.65);
    max-width: 520px;
    margin: 0 auto 2.5rem;
}

/* Modern Typography for CTA on Expertise / Solution pages */
.cta-title {
    font-size: clamp(2rem, 3.8vw, 3.4rem);
    font-weight: 700;
    letter-spacing: -1.2px;
    line-height: 1.15;
    color: var(--black, #111827);
    margin: 0.8rem auto 1.2rem;
    max-width: 780px;
}
.cta-sub {
    font-size: clamp(0.95rem, 1.3vw, 1.15rem);
    font-weight: 350;
    line-height: 1.7;
    color: rgba(43, 45, 66, 0.62);
    max-width: 580px;
    margin: 0 auto 2.5rem;
}
.cta-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.2rem;
    flex-wrap: wrap;
}

/* Primary High-Tech Button (.btn-nb-primary) */
.btn-nb-primary {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: var(--sol-grad, var(--exp-grad, var(--grad, linear-gradient(135deg, #11998e 0%, #58af6c 100%)))) !important;
    color: #ffffff !important;
    text-decoration: none !important;
    font-family: var(--font-mono, var(--mono, monospace));
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    padding: 18px 42px;
    border-radius: 2px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s ease;
}
.btn-nb-primary::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(255, 255, 255, 0.16);
    transform: translateX(-101%);
    transition: transform 0.4s ease;
}
.btn-nb-primary:hover::before {
    transform: translateX(0);
}
.btn-nb-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 36px var(--sol-glow, var(--exp-glow, rgba(88, 175, 108, 0.3)));
    color: #ffffff !important;
}
.btn-nb-primary svg {
    transition: transform 0.3s ease;
}
.btn-nb-primary:hover svg {
    transform: translateX(4px);
}

/* Ghost / Secondary Button (.btn-ghost) */
.btn-ghost {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: transparent;
    color: var(--black, #111827) !important;
    border: 1px solid rgba(43, 45, 66, 0.2);
    text-decoration: none !important;
    font-family: var(--font-mono, var(--mono, monospace));
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    padding: 17px 36px;
    border-radius: 2px;
    transition: all 0.35s ease;
}
.btn-ghost:hover {
    border-color: var(--black, #111827);
    background: rgba(43, 45, 66, 0.04);
    transform: translateY(-3px);
    color: var(--black, #111827) !important;
}
.btn-ghost svg {
    transition: transform 0.3s ease;
}
.btn-ghost:hover svg {
    transform: translateX(4px);
}

/* ════════════════════════════
   FOOTER
════════════════════════════ */
.footer { background:#080808; padding:80px 0 40px; }
.footer-logo img { filter:brightness(0) invert(1); opacity:.8; }
.ftr-tag  { font-family:var(--mono); font-size:.6rem; letter-spacing:2px; color:rgba(255,255,255,.7); margin-top:1.5rem; text-transform:uppercase; }
.ftr-head { font-family:var(--mono); font-size:.56rem; letter-spacing:3px; text-transform:uppercase; color:rgba(255,255,255,.8); margin-bottom:1.4rem; }
.ftr-links { list-style:none; padding:0; }
.ftr-links li { margin-bottom:10px; }
.ftr-links a { font-size:.82rem; font-weight:300; color:rgba(255,255,255,.26); text-decoration:none; transition:all .3s; display:inline-block; }
.ftr-links a:hover { color:var(--green); padding-left:6px; }
.ftr-contact { font-size:.82rem; font-weight:300; color:rgba(255,255,255,.26); margin-bottom:6px; }
.ftr-contact a { color:var(--green); text-decoration:none; }
.ftr-bottom { margin-top:56px; padding-top:20px; border-top:1px solid rgba(255,255,255,.5); display:flex; justify-content:space-between; }
.ftr-bottom p { font-family:var(--mono); font-size:.56rem; letter-spacing:1px; color:rgba(255,255,255,.1); text-transform:uppercase; margin:0; }

/* ════════════════════════════
   SCROLL REVEAL
════════════════════════════ */
[data-reveal] {
    opacity:0; transform:translateY(40px);
    transition:opacity .9s var(--expo), transform .9s var(--expo);
}
[data-reveal].visible { opacity:1; transform:translateY(0); }
[data-reveal="left"]  { transform:translateX(-40px); }
[data-reveal="left"].visible { transform:translateX(0); }
[data-reveal="right"] { transform:translateX(40px); }
[data-reveal="right"].visible { transform:translateX(0); }
[data-reveal="scale"] { transform:scale(.95); }
[data-reveal="scale"].visible { transform:scale(1); }

/* ════════════════════════════
   NOTEBOOK
════════════════════════════ */

/* ── HERO ── */
.nb-hero {
    background: var(--white);
    padding-top: clamp(130px,15vw,180px);
    padding-bottom: 0;
    position: relative; overflow: hidden;
    border-bottom: 1px solid rgba(43,45,66,.06);
}
.nb-bg-word {
    position: absolute;
    top: 50%; right: -2%;
    transform: translateY(-50%);
    font-size: 19vw; font-weight: 900;
    letter-spacing: -.06em; line-height: .85;
    color: rgba(43,45,66,.028);
    text-transform: uppercase;
    pointer-events: none; user-select: none;
    z-index: 0; text-align: right;
}
.nb-hero-inner {
    display: flex; align-items: flex-end;
    justify-content: space-between;
    gap: 3rem; flex-wrap: wrap;
    padding-bottom: clamp(40px,6vw,70px);
    position: relative; z-index: 1;
}
.nb-hero-left  { flex: 1; min-width: 280px; }
.nb-hero-right {
    display: flex; align-items: center; gap: 2.5rem;
    flex-shrink: 0; padding-bottom: .5rem;
}
.nb-hero-title {
    font-size: clamp(4rem,9vw,8.5rem);
    font-weight: 900; letter-spacing: -.05em;
    line-height: .88; text-transform: uppercase;
    color: var(--navy); margin-top: 1.5rem; margin-bottom: 1.5rem;
}
.nb-hero-sub {
    font-size: .97rem; font-weight: 300; line-height: 1.8;
    color: rgba(43,45,66,.5); max-width: 500px;
    border-left: 2px solid rgba(43,45,66,.1);
    padding-left: 1.2rem;
}
/* Six modes subtitle */
.nb-hero-modes {
    font-family: var(--mono); font-size: .62rem;
    letter-spacing: 3px; text-transform: uppercase;
    color: rgba(43,45,66,.28);
    margin-top: 1.4rem; margin-bottom: 0;
}
/* Stats */
.nb-stat { text-align: center; }
.nb-stat-num {
    font-size: 2.5rem; font-weight: 900; line-height: 1;
    background: var(--grad);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    letter-spacing: -.04em;
}
.nb-stat-lbl {
    font-family: var(--mono); font-size: .54rem;
    letter-spacing: 2px; text-transform: uppercase;
    color: rgba(43,45,66,.28); line-height: 1.5; margin-top: .4rem;
}
.nb-stat-divider { width: 1px; height: 40px; background: rgba(43,45,66,.1); }

/* ── MODE TAB BAR ── */
.nb-modebar {
    background: var(--white);
    border-bottom: 1px solid rgba(43,45,66,.06);
    position: sticky; top: 70px; z-index: 50;
    overflow-x: auto; scrollbar-width: none;
}
.nb-modebar::-webkit-scrollbar { display: none; }
.nb-modebar-inner {
    display: flex; align-items: stretch;
    /* let it scroll horizontally if needed */
    min-width: max-content;
}
.nb-mode-tab {
    flex: 1; min-width: 120px;
    display: flex; flex-direction: column; align-items: flex-start;
    gap: .2rem;
    padding: 1.2rem clamp(1rem,2.5vw,2rem);
    text-decoration: none;
    border-right: 1px solid rgba(43,45,66,.06);
    position: relative;
    transition: background .35s var(--expo);
}
.nb-mode-tab:last-child { border-right: none; }
.nb-mode-tab::after {
    content: ''; position: absolute;
    bottom: 0; left: 0; right: 0; height: 2px;
    background: var(--grad);
    transform: scaleX(0); transform-origin: left;
    transition: transform .45s var(--expo);
}
.nb-mode-tab:hover { background: var(--soft); }
.nb-mode-tab--active::after,
.nb-mode-tab:hover::after { transform: scaleX(1); }

.nb-mode-glyph {
    font-size: 1.1rem; line-height: 1;
    color: rgba(43,45,66,.18);
    transition: color .3s;
    font-family: var(--mono);
}
.nb-mode-tab--active .nb-mode-glyph,
.nb-mode-tab:hover   .nb-mode-glyph { color: var(--green); }

.nb-mode-name {
    font-family: var(--mono); font-size: .6rem;
    letter-spacing: 2px; text-transform: uppercase;
    color: rgba(43,45,66,.35);
    transition: color .3s;
}
.nb-mode-tab--active .nb-mode-name,
.nb-mode-tab:hover   .nb-mode-name { color: var(--navy); }

.nb-mode-descriptor {
    font-family: var(--mono); font-size: .52rem;
    letter-spacing: 1px; text-transform: lowercase;
    color: rgba(43,45,66,.22);
    transition: color .3s;
}
.nb-mode-tab--active .nb-mode-descriptor { color: var(--green); }

.nb-mode-count {
    font-family: var(--mono); font-size: .52rem;
    letter-spacing: 1px;
    color: rgba(43,45,66,.18);
    margin-top: .3rem;
}

/* ── MODE SECTION ── */
.nb-mode-section {
    background: var(--soft);
    padding: clamp(60px,8vw,100px) 0;
}

/* Intro panel */
.nb-mode-intro {
    display: flex; align-items: flex-start; gap: clamp(2rem,5vw,5rem);
    padding-bottom: clamp(40px,6vw,60px);
    margin-bottom: clamp(40px,6vw,60px);
    border-bottom: 1px solid rgba(43,45,66,.07);
}
.nb-mode-intro-glyph {
    font-size: clamp(4rem,8vw,7rem);
    line-height: 1; font-family: var(--mono);
    color: rgba(43,45,66,.06);
    flex-shrink: 0; user-select: none;
    transition: color .4s;
}
.nb-mode-intro:hover .nb-mode-intro-glyph { color: rgba(88,175,108,.15); }
.nb-mode-intro-content { flex: 1; }
.nb-mode-intro-header {
    display: flex; align-items: baseline; gap: .8rem;
    margin-bottom: 1rem; flex-wrap: wrap;
}
.nb-mode-intro-name {
    font-size: clamp(1.6rem,3vw,2.5rem); font-weight: 900;
    letter-spacing: -.04em; color: var(--navy);
}
.nb-mode-intro-sep {
    color: rgba(43,45,66,.2); font-weight: 300;
    font-size: clamp(1.2rem,2vw,1.8rem);
}
.nb-mode-intro-descriptor {
    font-family: var(--mono); font-size: .7rem;
    letter-spacing: 3px; text-transform: uppercase;
    color: var(--green);
}
.nb-mode-intro-text {
    font-size: 1rem; font-weight: 300; line-height: 1.82;
    color: rgba(43,45,66,.6); max-width: 680px; margin: 0;
}

/* ── POSTS GRID ── */
.nb-mode-posts {
    display: flex; flex-direction: column; gap: 0;
}

/* Lead post */
.nb-mode-post--lead {
    background: var(--white);
    border: 1px solid rgba(43,45,66,.06);
    overflow: hidden;
    margin-bottom: 1.5px;
}
.nb-mode-post-img {
    display: block; position: relative;
    overflow: hidden; aspect-ratio: 16/7;
}
.nb-mode-post-img img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    transition: transform .9s var(--expo);
    filter: grayscale(15%);
}
.nb-mode-post--lead:hover .nb-mode-post-img img { transform: scale(1.04); filter: grayscale(0); }
.nb-mode-post-img-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(to bottom, transparent 50%, rgba(43,45,66,.12));
}
.nb-mode-post-body {
    padding: clamp(1.8rem,3vw,2.8rem);
}
.nb-mode-post-meta {
    display: flex; align-items: center; gap: .6rem;
    margin-bottom: .9rem;
}
.nb-mode-post-title {
    font-size: 1rem; font-weight: 600;
    color: var(--navy); letter-spacing: -.025em;
    line-height: 1.3; margin: 0 0 .6rem;
}
.nb-mode-post-title a { color: inherit; text-decoration: none; transition: color .3s; }
.nb-mode-post-title a:hover { color: var(--green); }
.nb-mode-post-title--lead {
    font-size: clamp(1.4rem,2.5vw,2.1rem) !important;
}
.nb-mode-post-excerpt {
    font-size: .88rem; font-weight: 300;
    color: rgba(43,45,66,.45); line-height: 1.72; margin: 0 0 .4rem;
}
.nb-mode-post-excerpt--lead { font-size: .97rem !important; }

/* Standard row post */
.nb-mode-post--row {
    background: var(--white);
    border-bottom: 1px solid rgba(43,45,66,.06);
}
.nb-mode-post--row:first-of-type { border-top: 1px solid rgba(43,45,66,.06); }
.nb-mode-post-row {
    display: grid;
    grid-template-columns: 36px 1fr auto;
    gap: 1.4rem; align-items: center;
    padding: clamp(1.3rem,2vw,1.8rem) clamp(1.2rem,2vw,1.8rem);
    transition: background .3s;
}
.nb-mode-post-row:has(.nb-mode-post-thumb) {
    grid-template-columns: 36px 90px 1fr auto;
}
.nb-mode-post--row:hover .nb-mode-post-row { background: rgba(43,45,66,.015); }
.nb-mode-post-text { display: flex; flex-direction: column; gap: .35rem; }
.nb-mode-post-thumb {
    display: block; width: 90px; height: 68px;
    overflow: hidden; flex-shrink: 0;
}
.nb-mode-post-thumb img {
    width: 100%; height: 100%; object-fit: cover;
    transition: transform .6s var(--expo); filter: grayscale(20%);
}
.nb-mode-post--row:hover .nb-mode-post-thumb img { transform: scale(1.08); filter: grayscale(0); }

/* Post arrow */
.nb-post-arrow {
    font-size: .95rem; color: rgba(43,45,66,.18);
    text-decoration: none; flex-shrink: 0;
    transition: color .3s, transform .3s var(--expo);
}
.nb-mode-post--row:hover .nb-post-arrow { color: var(--green); transform: translateX(4px); }

/* Index number */
.nb-post-idx {
    font-family: var(--mono); font-size: .6rem;
    letter-spacing: 2px; color: rgba(43,45,66,.2);
}

/* "View all" link */
.nb-mode-more {
    padding-top: 2rem; margin-top: .5rem;
    border-top: 1px solid rgba(43,45,66,.07);
}

/* ── SHARED ATOMS ── */
.nb-muted {
    font-family: var(--mono); font-size: .58rem;
    letter-spacing: 1px; text-transform: uppercase;
    color: rgba(43,45,66,.3);
}
.nb-post-title {
    font-size: 1rem; font-weight: 600;
    color: var(--navy); letter-spacing: -.025em; line-height: 1.3; margin: 0;
}
.nb-post-title a { color: inherit; text-decoration: none; transition: color .3s; }
.nb-post-title a:hover { color: var(--green); }
.nb-post-excerpt {
    font-size: .84rem; font-weight: 300;
    color: rgba(43,45,66,.42); line-height: 1.65; margin: 0;
    display: -webkit-box; -webkit-line-clamp: 2;
    -webkit-box-orient: vertical; overflow: hidden;
}
.nb-post-readmore {
    display: inline-flex; align-items: center; gap: .6rem;
    font-family: var(--mono); font-size: .62rem;
    letter-spacing: 2px; text-transform: uppercase;
    color: var(--navy); text-decoration: none;
    border-bottom: 1px solid rgba(43,45,66,.12);
    padding-bottom: 2px; margin-top: .8rem;
    align-self: flex-start;
    transition: color .3s, border-color .3s, gap .3s var(--expo);
}
.nb-post-readmore:hover { color: var(--green); border-color: var(--green); gap: 1rem; }
.nb-post-readmore svg { transition: transform .3s var(--expo); }
.nb-post-readmore:hover svg { transform: translateX(4px); }

/* ── EMPTY STATE ── */
.nb-empty {
    background: var(--white); padding: clamp(50px,7vw,90px) 2rem;
    text-align: center; border: 1px solid rgba(43,45,66,.06);
}
.nb-empty-icon {
    width: 52px; height: 52px; margin: 0 auto 1.5rem;
    border: 1px solid rgba(43,45,66,.1);
    display: flex; align-items: center; justify-content: center;
    color: rgba(43,45,66,.2);
}
.nb-empty-title {
    font-size: 1.2rem; font-weight: 300; color: var(--navy);
    margin-bottom: .8rem; letter-spacing: -.02em;
}

/* ── RESPONSIVE ── */
@media(max-width: 767px) {
    .nb-mode-intro { flex-direction: column; gap: 1rem; }
    .nb-mode-intro-glyph { font-size: 3rem; }
    .nb-mode-post-row { grid-template-columns: 28px 1fr auto !important; }
    .nb-mode-post-thumb { display: none; }
}



/* ════════════════════════════
   SINGLE POST
════════════════════════════ */
.post-hero {
    padding: clamp(130px,16vw,200px) 0 clamp(50px,6vw,80px);
    background: var(--white);
    border-bottom: 1px solid rgba(43,45,66,.07);
}
.post-title {
    font-size: calc(2rem + 2.5vw); font-weight: 700;
    letter-spacing: -.04em; line-height: 1.1;
    color: var(--navy); margin-top: 1rem; margin-bottom: 1.5rem;
}
.post-standfirst {
    font-size: 1.15rem; font-weight: 300; line-height: 1.75;
    color: rgba(43,45,66,.55); border-left: 2px solid var(--green);
    padding-left: 1.4rem;
}

.post-hero-img {
    padding: 3rem 0;
    background: var(--soft);
}
.post-hero-img img { width: 100%; height: auto; display: block; }

.post-body { padding: clamp(60px,8vw,100px) 0; }
.post-content {
    font-size: 1.06rem; font-weight: 300;
    line-height: 1.92; color: rgba(43,45,66,.72);
}
.post-content h2 { font-size: 1.5rem; font-weight: 600; color: var(--navy); margin: 3rem 0 1rem; letter-spacing: -.02em; }
.post-content h3 { font-size: 1.2rem; font-weight: 600; color: var(--navy); margin: 2.5rem 0 .8rem; }
.post-content p  { margin-bottom: 1.6rem; }
.post-content a  { color: var(--green); text-decoration: underline; text-underline-offset: 3px; }
.post-content blockquote {
    border-left: 2px solid var(--green); padding-left: 1.5rem;
    margin: 2.5rem 0; font-style: italic;
    color: rgba(43,45,66,.5); font-size: 1.1rem;
}
.post-content ul, .post-content ol { padding-left: 1.5rem; margin-bottom: 1.6rem; }
.post-content li { margin-bottom: .5rem; }
.post-content img { width: 100%; height: auto; display: block; margin: 2.5rem 0; }
.post-content code {
    font-family: var(--mono); font-size: .88em;
    background: rgba(43,45,66,.05); padding: 2px 7px;
    border-radius: 3px; color: var(--navy);
}
.post-content pre {
    background: var(--navy); color: rgba(255,255,255,.8);
    padding: 2rem; overflow-x: auto; margin: 2rem 0;
    font-family: var(--mono); font-size: .85rem; line-height: 1.7;
}
.post-content pre code { background: none; padding: 0; color: inherit; }

/* Tags */
.post-tags {
    display: flex; flex-wrap: wrap; gap: .6rem;
    margin-top: 3rem; padding-top: 2rem;
    border-top: 1px solid rgba(43,45,66,.07);
}
.post-tag {
    font-family: var(--mono); font-size: .58rem; letter-spacing: 2px;
    text-transform: uppercase; text-decoration: none;
    border: 1px solid rgba(43,45,66,.12); color: rgba(43,45,66,.4);
    padding: 4px 12px; transition: all .3s;
}
.post-tag:hover { border-color: var(--green); color: var(--green); }

/* Post navigation */
.post-nav {
    border-top: 1px solid rgba(43,45,66,.07);
    padding: clamp(40px,6vw,70px) 0;
    background: var(--soft);
}
.post-nav-link {
    display: flex; flex-direction: column; gap: .5rem;
    text-decoration: none;
}
.post-nav-dir {
    font-family: var(--mono); font-size: .6rem; letter-spacing: 2px;
    text-transform: uppercase; color: rgba(43,45,66,.28);
}
.post-nav-title {
    font-size: 1.1rem; font-weight: 500; color: var(--navy);
    line-height: 1.3; transition: color .3s;
}
.post-nav-link:hover .post-nav-title { color: var(--green); }
.post-nav-link--next .post-nav-dir,
.post-nav-link--next .post-nav-title { text-align: right; }

/* ════════════════════════════
   GENERIC PAGE (page.php)
════════════════════════════ */
.page-hero {
    padding: clamp(130px,16vw,200px) 0 clamp(60px,8vw,100px);
    background: var(--white);
    border-bottom: 1px solid rgba(43,45,66,.07);
}
.page-hero-title {
    font-size: calc(3rem + 3vw); font-weight: 300;
    letter-spacing: -.05em; line-height: .92;
    color: var(--navy); margin-top: 1rem; text-transform: uppercase;
}
.page-body { padding: clamp(60px,8vw,100px) 0; }
.page-body .container { max-width: 900px; }

/* ════════════════════════════════════════════════
   DOMAINS PAGE
════════════════════════════════════════════════ */

/* ── HERO ── */
.domains-hero {
    min-height: 100vh;
    background: var(--white);
    position: relative; overflow: hidden;
    display: flex; flex-direction: column;
    justify-content: center;
}
.domains-hero-inner {
    padding-top: clamp(100px,12vw,140px);
    padding-bottom: clamp(40px,5vw,70px);
    position: relative; z-index: 2;
    flex: 1; display: flex; align-items: center;
}

/* Amoeba canvas */
#domainsAmoeba {
    position: absolute;
    top: 0; right: 0;
    width: 55%; height: 100%;
    pointer-events: none; z-index: 1;
}
.domains-hero-title {
    font-size: clamp(3.5rem, 9vw, 8rem);
    font-weight: 900; letter-spacing: -.05em;
    line-height: .9; text-transform: uppercase;
    color: var(--navy); margin-top: 2rem;
}


/* Domain anchor nav strip */
.dan {
    margin-top: clamp(50px,7vw,90px);
    border-top: 1px solid rgba(43,45,66,.07);
    position: relative; z-index: 2;
    /* background: var(--white); */
}
.dan-inner {
    display: flex; align-items: stretch;
}
.dan-item {
    flex: 1; display: flex; flex-direction: column;
    padding: 1.8rem clamp(1rem,3vw,3rem);
    text-decoration: none; position: relative;
    transition: background .4s var(--expo);
    gap: .3rem;
}
.dan-item::after {
    content: ''; position: absolute;
    top: 0; left: 0; right: 0; height: 2px;
    background: var(--grad); transform: scaleX(0);
    transform-origin: left; transition: transform .5s var(--expo);
}
.dan-item:hover { background: var(--soft); }
.dan-item:hover::after { transform: scaleX(1); }
.dan-item:hover .dan-arrow { transform: translateY(4px); color: var(--green); }
.dan-div {
    width: 1px; background: rgba(43,45,66,.07);
    align-self: stretch; flex-shrink: 0;
}
.dan-num  { font-family: var(--mono); font-size: .55rem; letter-spacing: 3px; color: var(--green); }
.dan-name { font-size: clamp(1.2rem,2.5vw,1.7rem); font-weight: 800; color: var(--navy); letter-spacing: -.02em; line-height: 1; }
.dan-sub  { font-family: var(--mono); font-size: .6rem; letter-spacing: 1px; color: rgba(43,45,66,.3); text-transform: uppercase; }
.dan-arrow { font-size: 1rem; color: rgba(43,45,66,.15); margin-top: .4rem; transition: all .35s var(--expo); align-self: flex-start; }
@media(max-width:600px) {
    .dan-inner { flex-direction: column; }
    .dan-div { width: 100%; height: 1px; }
}

/* ── DOMAIN SECTIONS ── */
.domain-section {
    padding: clamp(90px,12vw,160px) 0;
    background: var(--white);
    border-top: 1px solid rgba(43,45,66,.06);
}
.domain-section--alt { background: var(--soft); }

.domain-hdr {
    margin-bottom: clamp(50px,7vw,90px);
    display: flex; align-items: baseline; gap: 2.5rem;
    flex-wrap: wrap;
}
.domain-hdr--right { justify-content: flex-end; text-align: right; }

.domain-idx {
    font-family: var(--mono); font-size: .65rem;
    letter-spacing: 4px; color: var(--green);
    text-transform: uppercase; flex-shrink: 0;
    padding-top: .6rem;
}
.domain-name-title {
    font-size: clamp(3rem,6vw,5.5rem);
    font-weight: 300; letter-spacing: -.04em;
    line-height: .92; text-transform: uppercase;
    color: var(--navy);
}

.domain-lead {
    font-size: clamp(1.1rem,1.8vw,1.45rem);
    font-weight: 300; line-height: 1.4;
    color: var(--navy); letter-spacing: -.02em;
}

/* Outcome box */
.domain-outcome {
    margin-top: 2.5rem;
    border-left: 2px solid var(--green);
    padding-left: 1.4rem;
}
.domain-outcome-lbl {
    font-family: var(--mono); font-size: .58rem;
    letter-spacing: 3px; text-transform: uppercase;
    color: var(--green); display: block; margin-bottom: .6rem;
}
.domain-outcome-txt {
    font-size: .97rem; font-weight: 500;
    color: var(--navy); line-height: 1.6; margin: 0;
}

/* Capability list */
.dli-list { list-style: none; padding: 0; margin: 0; }
.dli-item {
    display: flex; gap: 1.4rem; align-items: flex-start;
    padding: 1.8rem 0;
    border-bottom: 1px solid rgba(43,45,66,.06);
    transition: padding-left .4s var(--expo);
}
.dli-item:first-child { border-top: 1px solid rgba(43,45,66,.06); }
.dli-item:hover { padding-left: .5rem; }
.dli-item:hover .dli-marker span { transform: scale(1.4); background: var(--green); }
.dli-item:hover .dli-title { color: var(--green); }

.dli-marker {
    flex-shrink: 0; width: 22px;
    display: flex; align-items: center;
    padding-top: .3rem;
}
.dli-marker span {
    display: block; width: 6px; height: 6px;
    border-radius: 50%; background: var(--grad);
    transition: transform .3s var(--expo), background .3s;
}
.dli-title {
    font-size: 1rem; font-weight: 600;
    color: var(--navy); margin-bottom: .4rem;
    letter-spacing: -.02em;
    transition: color .3s;
}
.dli-desc {
    font-size: .88rem; font-weight: 300;
    line-height: 1.75; color: rgba(43,45,66,.5);
}

/* ── CONVERGENCE ── */
.domains-conv {
    background: var(--navy);
    padding: clamp(90px,12vw,160px) 0;
    position: relative; overflow: hidden;
}
.domains-conv::before {
    content: ''; position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(88,175,108,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(88,175,108,.025) 1px, transparent 1px);
    background-size: 55px 55px;
}
.conv-glow {
    position: absolute; top: 0; left: -10%; width: 70vw; height: 100%;
    background: radial-gradient(ellipse at 30% 50%, rgba(88,175,108,.06) 0%, transparent 65%);
    pointer-events: none;
}
.conv-title {
    font-size: clamp(2.2rem,5vw,4.5rem);
    font-weight: 300; letter-spacing: -.04em;
    line-height: .95; color: rgba(255,255,255,.88);
}

.conv-grid {
    display: grid; grid-template-columns: repeat(3,1fr);
    gap: 1.5px; background: rgba(255,255,255,.04);
}
@media(max-width:767px) { .conv-grid { grid-template-columns: 1fr; } }

.conv-card {
    background: var(--navy); padding: 2.8rem;
    transition: background .4s;
}
.conv-card:hover { background: #343650; }
.conv-card--mid {
    border-left: 1.5px solid rgba(255,255,255,.04);
    border-right: 1.5px solid rgba(255,255,255,.04);
}
.conv-tags {
    display: flex; align-items: center; gap: .7rem;
    margin-bottom: 1.8rem;
}
.conv-tag {
    font-family: var(--mono); font-size: .58rem;
    letter-spacing: 2px; background: rgba(88,175,108,.1);
    color: var(--green); border: 1px solid rgba(88,175,108,.2);
    padding: 4px 10px;
}
.conv-plus { font-family: var(--mono); color: rgba(255,255,255,.15); font-size: .8rem; }
.conv-card-title {
    font-size: 1.1rem; font-weight: 600;
    color: rgba(255,255,255,.85); margin-bottom: .9rem;
    letter-spacing: -.02em;
}
.conv-card-desc {
    font-size: .88rem; font-weight: 300;
    line-height: 1.78; color: rgba(255,255,255,.3);
    margin: 0;
}

/* ── PHILOSOPHY ── */
.domains-phil {
    background: var(--soft);
    padding: clamp(90px,12vw,160px) 0;
}
.phil-title {
    font-size: clamp(2.5rem,5vw,4rem);
    font-weight: 300; letter-spacing: -.04em;
    line-height: .95; text-transform: uppercase;
    color: var(--navy); margin-top: 1rem;
}

.phil-rows { margin-bottom: clamp(60px,8vw,100px); }
.phil-row {
    display: grid; grid-template-columns: 60px 1fr;
    gap: 3rem; padding: 2.4rem 0;
    border-top: 1px solid rgba(43,45,66,.07);
    align-items: start;
    transition: padding-left .4s var(--expo);
}
.phil-row:last-child { border-bottom: 1px solid rgba(43,45,66,.07); }
.phil-row:hover { padding-left: .5rem; }
.phil-row:hover .phil-num { color: var(--green); }
.phil-num {
    font-family: var(--mono); font-size: .62rem;
    letter-spacing: 2px; color: rgba(43,45,66,.2);
    padding-top: .35rem; transition: color .3s;
}
.phil-row-title {
    font-size: 1.15rem; font-weight: 600;
    color: var(--navy); margin-bottom: .7rem;
    letter-spacing: -.02em;
}
@media(max-width:600px) { .phil-row { grid-template-columns: 1fr; gap: .5rem; } }

/* Quote */
.phil-quote {
    border-top: 1px solid rgba(43,45,66,.07);
    padding-top: clamp(50px,7vw,90px);
    text-align: center; position: relative;
}
.phil-qmark {
    font-size: 8rem; line-height: .6;
    color: rgba(43,45,66,.05); font-weight: 900;
    font-family: Georgia, serif;
    position: absolute; top: 1.5rem; left: 50%;
    transform: translateX(-50%);
    pointer-events: none; user-select: none;
}
.phil-qtext {
    font-size: clamp(1.4rem,3vw,2.2rem);
    font-weight: 300; font-style: italic;
    color: var(--navy); letter-spacing: -.02em;
    line-height: 1.3; max-width: 700px;
    margin: 0 auto; border: none; padding: 0;
    position: relative; z-index: 1;
}

/* ════════════════════════════════════════════════
   CONNECT PAGE
════════════════════════════════════════════════ */

/* ── HERO ── */
.connect-hero {
    min-height: 100vh;
    background: var(--white);
    position: relative; overflow: hidden;
    display: flex; flex-direction: column;
    align-items: stretch;
}
.connect-hero-inner {
    position: relative; z-index: 3;
    flex: 1; display: flex; align-items: center;
    padding-top: clamp(90px,11vw,130px);
    padding-bottom: clamp(60px,8vw,100px);
}
.connect-hero-inner > .row { width: 100%; }

/* Hero typography */
.connect-hero-title {
    font-size: clamp(4.5rem,12vw,10rem);
    font-weight: 900; letter-spacing: -.05em;
    line-height: .88; text-transform: uppercase;
    color: var(--navy); margin-top: 2rem; margin-bottom: 2.5rem;
}
.text-outline,
.text-outline-connect {
    color: transparent;
    -webkit-text-stroke: 2.5px var(--navy);
}
.connect-hero-sub {
    font-size: clamp(1rem,1.6vw,1.2rem);
    font-weight: 300; line-height: 1.78;
    color: rgba(43,45,66,.6);
    border-left: 2px solid var(--green);
    padding-left: 1.4rem; max-width: 580px;
}
.connect-hero-sub strong { color: var(--navy); font-weight: 600; }
.connect-accent { color: var(--green); font-weight: 600; }

#contactForm,
#standards,
#contactDirect,
#labLocation {
    scroll-margin-top: 140px;
}

/* ── BODY ── */
.connect-body {
    padding: clamp(80px,11vw,140px) 0 clamp(80px,11vw,140px);
    background: var(--soft);
    border-top: 1px solid rgba(43,45,66,.07);
}

/* ── FORM COLUMN ── */
.connect-form-col {
    padding-right: clamp(2rem,5vw,5rem);
    border-right: 1px solid rgba(43,45,66,.07);
}
@media(max-width:991px) {
    .connect-form-col {
        border-right: none;
        border-bottom: 1px solid rgba(43,45,66,.07);
        padding-right: 0; padding-bottom: 4rem;
    }
}
.connect-form-header { margin-bottom: 3rem; }
.connect-form-title {
    font-size: clamp(2.2rem,4vw,3.5rem);
    font-weight: 300; letter-spacing: -.04em;
    line-height: .95; color: var(--navy);
    margin-top: 1rem;
}

/* WPForms overrides — makes the plugin form match the design system */
.connect-form-wrap .wpforms-container { margin: 0; }
.connect-form-wrap .wpforms-field-container { display: flex; flex-direction: column; gap: 0; }

/* Each field row */
.connect-form-wrap .wpforms-field {
    padding: 1.6rem 0 !important;
    border-bottom: 1px solid rgba(43,45,66,.1) !important;
    margin: 0 !important;
    transition: border-color .4s var(--expo);
    background: transparent !important;
}
.connect-form-wrap .wpforms-field:last-of-type { border-bottom: none !important; }
.connect-form-wrap .wpforms-field:focus-within { border-bottom-color: var(--green) !important; }

/* Field labels */
.connect-form-wrap .wpforms-field-label {
    font-family: var(--mono) !important;
    font-size: .6rem !important; letter-spacing: 3px !important;
    text-transform: uppercase !important;
    color: var(--green) !important;
    font-weight: 400 !important;
    margin-bottom: .5rem !important;
}

/* Inputs + textareas */
.connect-form-wrap input[type="text"],
.connect-form-wrap input[type="email"],
.connect-form-wrap input[type="tel"],
.connect-form-wrap textarea {
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 8px 0 !important;
    font-family: var(--font) !important;
    font-size: 1.05rem !important;
    font-weight: 300 !important;
    color: var(--navy) !important;
    box-shadow: none !important;
    outline: none !important;
    -webkit-appearance: none !important;
}
.connect-form-wrap select {
    width: 100% !important;
    background: transparent url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%2358af6c' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 4px center !important;
    background-size: 12px 8px !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 8px 24px 8px 0 !important;
    font-family: var(--font) !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    color: var(--navy) !important;
    box-shadow: none !important;
    outline: none !important;
    cursor: pointer !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
.connect-form-wrap select option {
    background: var(--white) !important;
    color: var(--navy) !important;
    font-family: var(--font) !important;
    font-size: 0.95rem !important;
    padding: 8px !important;
}
.connect-form-wrap input::placeholder,
.connect-form-wrap textarea::placeholder {
    font-family: var(--mono) !important;
    font-size: .82rem !important;
    opacity: .28 !important;
    color: var(--navy) !important;
}
.connect-form-wrap textarea { resize: vertical; min-height: 90px; }

/* Submit button */
.connect-form-wrap .wpforms-submit-container { margin-top: 2.5rem !important; padding: 0 !important; }
.connect-form-wrap .wpforms-submit,
.connect-form-wrap button[type="submit"] {
    display: inline-flex !important; align-items: center !important; gap: 12px !important;
    background: var(--grad) !important;
    color: #fff !important; border: none !important; border-radius: 0 !important;
    font-family: var(--mono) !important; font-size: .68rem !important;
    letter-spacing: 3px !important; text-transform: uppercase !important;
    padding: 16px 40px !important;
    cursor: none !important; position: relative !important; overflow: hidden !important;
    transition: transform .4s var(--expo), box-shadow .4s !important;
}
.connect-form-wrap .wpforms-submit::before,
.connect-form-wrap button[type="submit"]::before {
    content: '' !important; position: absolute !important; inset: 0 !important;
    background: rgba(255,255,255,.12) !important;
    transform: translateX(-101%) !important;
    transition: transform .4s var(--expo) !important;
}
.connect-form-wrap .wpforms-submit:hover::before,
.connect-form-wrap button[type="submit"]:hover::before { transform: translateX(0) !important; }
.connect-form-wrap .wpforms-submit:hover,
.connect-form-wrap button[type="submit"]:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 16px 32px rgba(88,175,108,.22) !important;
}

/* Error + success messages */
.connect-form-wrap .wpforms-error-container,
.connect-form-wrap label.wpforms-error {
    font-family: var(--mono) !important;
    font-size: .62rem !important; letter-spacing: 1px !important;
    color: #e05252 !important; margin-top: .4rem !important;
    border: none !important; background: none !important; padding: 0 !important;
}
.connect-form-wrap .wpforms-confirmation-container-full {
    background: rgba(88,175,108,.06) !important;
    border-left: 2px solid var(--green) !important;
    border-radius: 0 !important; padding: 1.5rem 2rem !important;
    font-weight: 300 !important; color: var(--navy) !important;
}

/* ── SIDEBAR ── */
.connect-sidebar {
    padding-left: clamp(2rem,5vw,4rem);
    display: flex; flex-direction: column; gap: 2rem;
}
@media(max-width:991px) { .connect-sidebar { padding-left: 0; padding-top: 4rem; } }

/* ── UNBOXED SIDEBAR / GET IN TOUCH ── */
.connect-direct-wrap {
    padding-top: 0.5rem;
}
.connect-info-title {
    font-size: clamp(2rem, 3.2vw, 2.6rem);
    font-weight: 300;
    letter-spacing: -.03em;
    line-height: 1.1;
    color: var(--navy);
    margin-top: 0.8rem;
}
.connect-info-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 1.5rem;
}
.connect-info-item {
    padding: 1.35rem 0;
    border-bottom: 1px solid rgba(43,45,66,.08);
}
.connect-info-item:first-child {
    padding-top: 0;
}
.connect-info-item--last {
    border-bottom: none;
    padding-bottom: 0;
}
.connect-info-label {
    display: block;
    font-family: var(--mono);
    font-size: .56rem;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--green);
    margin-bottom: .35rem;
}
.connect-info-value {
    font-size: 1.08rem;
    font-weight: 400;
    color: var(--navy);
    text-decoration: none;
    transition: color .3s, transform .3s;
    display: inline-block;
    letter-spacing: -.01em;
}
a.connect-info-value:hover {
    color: var(--green);
    transform: translateX(4px);
}
.connect-info-loc {
    margin: 0;
}
.connect-info-tz {
    display: inline-block;
    margin-left: .5rem;
    font-family: var(--mono);
    font-size: .7rem;
    color: rgba(43,45,66,.45);
    font-weight: 400;
}

/* CTA Actions & Outline Button */
.cta-actions {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    justify-content: center;
}
.btn-lab-outline {
    display: inline-flex; align-items: center; gap: 10px;
    background: transparent; color: var(--navy); text-decoration: none;
    font-family: var(--mono); font-size: .68rem; letter-spacing: 2px;
    text-transform: uppercase; padding: 18px 36px;
    border: 1px solid rgba(43,45,66,.2);
    position: relative; overflow: hidden;
    transition: transform .4s var(--expo), border-color .3s, color .3s, box-shadow .4s;
}
.btn-lab-outline:hover {
    border-color: var(--green);
    color: var(--green);
    transform: translateY(-4px);
    box-shadow: 0 16px 32px rgba(88,175,108,.15);
}

/* ════════════════════════════════════════════════
   ABOUT PAGE (THE LAB)
════════════════════════════════════════════════ */
:root {
    /* About Page Accent Palette - Electric Indigo / Royal Violet */
    --about-accent:       #6366f1;
    --about-accent-2:     #8b5cf6;
    --about-grad:         linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    --about-glow:         rgba(99, 102, 241, 0.2);
}

/* ════════════════════════════════════════════════
   ABOUT PAGE — GLOBAL SCOPE & PURGE OF GREEN
════════════════════════════════════════════════ */
body.page-about {
    --green:              #6366f1 !important;
    --green2:             #8b5cf6 !important;
    --grad:               linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%) !important;
}

/* Cursor overrides on About Page */
body.page-about .cur-dot {
    background: var(--about-accent) !important;
}
body.page-about .cur-ring {
    border-color: rgba(99, 102, 241, 0.45) !important;
}
body.page-about .cur-ring.hov {
    border-color: var(--about-accent) !important;
}

/* Scroll progress */
body.page-about .scroll-progress {
    background: var(--about-grad) !important;
}

/* Header Pulse Beacon (Purge green glow and dot) */
body.page-about .pulse-dot {
    background: var(--about-accent) !important;
    box-shadow: 0 0 0 0 rgba(99, 102, 241, 0.6) !important;
    animation: about-pulse-beacon 2.5s infinite !important;
}
@keyframes about-pulse-beacon {
    0%   { box-shadow: 0 0 0 0 rgba(99, 102, 241, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(99, 102, 241, 0); }
    100% { box-shadow: 0 0 0 0 rgba(99, 102, 241, 0); }
}

/* Footer & Nav links on About Page */
body.page-about .ftr-links a:hover,
body.page-about .ftr-contact a {
    color: var(--about-accent) !important;
}

/* Hero Typography */
.about-nb-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
}
.about-hero-sub {
    font-size: clamp(1rem, 1.6vw, 1.2rem) !important;
    font-weight: 300 !important;
    line-height: 1.78 !important;
    color: rgba(43, 45, 66, .6) !important;
    border-left: 2px solid var(--about-accent) !important;
    padding-left: 1.4rem !important;
    max-width: 600px !important;
}
.about-hero-sub strong {
    color: var(--navy) !important;
    font-weight: 600 !important;
}
.about-accent {
    color: var(--about-accent) !important;
    font-weight: 600 !important;
}
.about-grad-text {
    background: var(--about-grad) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* ── 01 INTRO & ASYMMETRICAL IRREGULAR IMAGE ── */
.about-intro-section {
    padding: clamp(90px, 11vw, 140px) 0;
    background: var(--white);
    border-top: 1px solid rgba(43, 45, 66, .06);
}
.about-section-title {
    font-size: clamp(2.2rem, 3.8vw, 3.4rem);
    font-weight: 300;
    letter-spacing: -.03em;
    line-height: 1.1;
    color: var(--navy);
    margin-bottom: 1.8rem;
}
.about-lead-copy {
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.8;
    color: var(--navy);
    margin-bottom: 1.4rem;
}
.about-body-copy {
    font-size: 0.98rem;
    font-weight: 300;
    line-height: 1.85;
    color: rgba(43, 45, 66, 0.7);
    margin-bottom: 0;
}

/* Asymmetrical Irregular Image Showcase */
.about-img-wrap {
    position: relative;
    padding: 2.2rem 2.2rem 2.2rem 1.4rem;
    max-width: 530px;
    margin: 0 auto;
}
/* Irregular Polygonal Gradient Backplate */
.about-img-backdrop {
    position: absolute;
    top: 0;
    right: 0;
    width: 96%;
    height: 96%;
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.95) 0%, rgba(139, 92, 246, 0.8) 55%, rgba(168, 85, 247, 0.45) 100%);
    clip-path: polygon(7% 0%, 100% 4%, 93% 98%, 0% 92%);
    transform: translate(22px, -18px) rotate(-2.5deg);
    filter: drop-shadow(0 25px 40px rgba(99, 102, 241, 0.28));
    z-index: 1;
    transition: transform 0.6s var(--expo), opacity 0.6s var(--expo), filter 0.6s var(--expo);
}
/* Irregular Architectural Silhouette Photo Crop */
.about-img-box {
    position: relative;
    z-index: 2;
    overflow: hidden;
    background: var(--navy);
    aspect-ratio: 4 / 3;
    clip-path: polygon(0 0, 96% 0, 100% 7%, 100% 88%, 88% 100%, 0 100%, 0 24px);
    box-shadow: 0 24px 50px rgba(15, 23, 42, 0.18);
    transition: transform 0.6s var(--expo), box-shadow 0.6s var(--expo), clip-path 0.6s var(--expo);
}
.about-img-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: grayscale(18%) contrast(108%);
    transform: scale(1.02);
    transition: transform 0.8s var(--expo), filter 0.6s ease;
}
.about-img-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(99, 102, 241, 0.04) 0%, rgba(15, 23, 42, 0.38) 100%);
    pointer-events: none;
}
/* Dynamic Asymmetrical Counter-Parallax Hover */
.about-img-wrap:hover .about-img-box {
    transform: translate(-8px, -6px) scale(1.01);
    box-shadow: 0 36px 70px rgba(15, 23, 42, 0.26);
    clip-path: polygon(0 0, 98% 0, 100% 5%, 100% 90%, 90% 100%, 0 100%, 0 18px);
}
.about-img-wrap:hover .about-img-backdrop {
    transform: translate(30px, -24px) rotate(-4deg) scale(1.03);
    filter: drop-shadow(0 32px 55px rgba(99, 102, 241, 0.45));
}
.about-img-wrap:hover .about-img-photo {
    transform: scale(1.08);
    filter: grayscale(0%) contrast(110%);
}

/* ── 02 FIELD & OPERATIONS (UNBOXED) ── */
.about-field-section {
    padding: clamp(90px, 11vw, 140px) 0;
    background: var(--soft);
    border-top: 1px solid rgba(43, 45, 66, 0.07);
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}
.about-pillar-list {
    display: flex;
    flex-direction: column;
    gap: 1.8rem;
    margin-top: 0.5rem;
}
.about-pillar-item {
    background: transparent;
    padding: 0 0 1.6rem 2rem;
    border: none;
    border-left: 2px solid rgba(99, 102, 241, 0.3);
    border-bottom: 1px solid rgba(43, 45, 66, 0.06);
    transition: border-left-color 0.4s var(--expo), transform 0.4s var(--expo);
}
.about-pillar-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}
.about-pillar-item:hover {
    border-left-color: var(--about-accent);
    transform: translateX(6px);
}
.about-pillar-num {
    font-family: var(--mono);
    font-size: 0.68rem;
    letter-spacing: 2.5px;
    color: var(--about-accent);
    margin-bottom: 0.5rem;
    text-transform: uppercase;
}
.about-pillar-title {
    font-size: 1.2rem;
    font-weight: 500;
    color: var(--navy);
    margin-bottom: 0.6rem;
    letter-spacing: -.01em;
}
.about-pillar-desc {
    font-size: 0.95rem;
    font-weight: 300;
    line-height: 1.75;
    color: rgba(43, 45, 66, 0.72);
    margin: 0;
}

/* ── 03 OUR PHILOSOPHY (COMBINED EDITORIAL & GRADIENT ARCHITECTURE) ── */
.about-philosophy-section {
    padding: clamp(110px, 14vw, 175px) 0;
    background: var(--white);
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(43, 45, 66, 0.06);
}
/* Ambient Radiant Gradient Light Aura */
.about-phil-glow {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: clamp(500px, 75vw, 1000px);
    height: clamp(350px, 45vw, 600px);
    background: radial-gradient(ellipse 65% 55% at 50% 50%, rgba(99, 102, 241, 0.12) 0%, rgba(139, 92, 246, 0.06) 45%, transparent 75%);
    filter: blur(50px);
    pointer-events: none;
    z-index: 1;
}
/* Unboxed Continuous Gradient Accent Block */
.about-phil-block {
    position: relative;
    padding-left: clamp(2rem, 4.5vw, 3.8rem);
    border-left: 3px solid transparent;
    border-image: var(--about-grad) 1;
}
/* Sculpted Gradient Quotation Mark */
.about-phil-mark {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(6.5rem, 11vw, 9.5rem);
    line-height: 0.65;
    background: var(--about-grad);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    opacity: 0.35;
    user-select: none;
    pointer-events: none;
    margin-bottom: 1.2rem;
    transform: translateX(-6px);
}
.about-phil-meta {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 1.8rem;
}
.about-phil-rule {
    width: 28px;
    height: 2px;
    background: var(--about-grad);
    border-radius: 2px;
}
.about-phil-label {
    font-family: var(--mono);
    font-size: 0.72rem;
    letter-spacing: 3.5px;
    text-transform: uppercase;
    color: var(--about-accent);
    font-weight: 600;
}
.about-phil-statement {
    font-size: clamp(1.4rem, 2.5vw, 2.2rem);
    font-weight: 300;
    line-height: 1.5;
    letter-spacing: -0.02em;
    color: var(--navy);
    margin: 0;
}
.about-phil-bridge {
    margin: clamp(1.8rem, 3vw, 2.6rem) 0;
}
.about-phil-bridge-line {
    display: block;
    width: 90px;
    height: 2px;
    background: linear-gradient(90deg, var(--about-accent) 0%, rgba(139, 92, 246, 0.4) 60%, transparent 100%);
    border-radius: 2px;
}
.about-phil-substatement {
    font-size: clamp(1.1rem, 1.8vw, 1.45rem);
    font-weight: 300;
    line-height: 1.65;
    color: rgba(43, 45, 66, 0.76);
    margin: 0;
}

/* ── 04 PAGE CTA INDIGO OVERRIDES ── */
.page-about .cta-super .hi {
    color: var(--about-accent) !important;
}
.about-btn-lab {
    background: var(--about-grad) !important;
}
.about-btn-lab:hover {
    box-shadow: 0 18px 36px rgba(99, 102, 241, 0.3) !important;
}

/* ════════════════════════════════════════════════
   HOW WE BUILD PAGE — THEME & VARIABLES (INDUSTRIAL AMBER)
════════════════════════════════════════════════ */
:root {
    --build-accent:       #d97706;
    --build-accent-2:     #f59e0b;
    --build-grad:         linear-gradient(135deg, #d97706 0%, #f59e0b 100%);
    --build-glow:         rgba(217, 119, 6, 0.22);
}

body.page-build {
    --green:              #d97706 !important;
    --green2:             #f59e0b !important;
    --grad:               linear-gradient(135deg, #d97706 0%, #f59e0b 100%) !important;
}

/* Cursor overrides on Build Page (Zero Green) */
body.page-build .cur-dot {
    background: var(--build-accent) !important;
}
body.page-build .cur-ring {
    border-color: rgba(217, 119, 6, 0.45) !important;
}
body.page-build .cur-ring.hov {
    border-color: var(--build-accent) !important;
}

/* Scroll progress */
body.page-build .scroll-progress {
    background: var(--build-grad) !important;
}

/* Pulse Beacon on Build Page */
body.page-build .pulse-dot {
    background: var(--build-accent) !important;
    box-shadow: 0 0 0 0 rgba(217, 119, 6, 0.6) !important;
    animation: build-pulse-beacon 2.5s infinite !important;
}
@keyframes build-pulse-beacon {
    0%   { box-shadow: 0 0 0 0 rgba(217, 119, 6, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(217, 119, 6, 0); }
    100% { box-shadow: 0 0 0 0 rgba(217, 119, 6, 0); }
}

/* Footer & Nav links on Build Page */
body.page-build .ftr-links a:hover,
body.page-build .ftr-contact a {
    color: var(--build-accent) !important;
}

/* Build Page Hero */
.build-nb-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
}
.build-hero-sub {
    font-size: clamp(1rem, 1.6vw, 1.2rem) !important;
    font-weight: 300 !important;
    line-height: 1.78 !important;
    color: rgba(43, 45, 66, .65) !important;
    border-left: 2px solid var(--build-accent) !important;
    padding-left: 1.4rem !important;
    max-width: 640px !important;
}
.build-hero-sub strong {
    color: var(--build-accent) !important;
    font-weight: 600 !important;
}
.build-accent {
    color: var(--build-accent) !important;
    font-weight: 600 !important;
}
.build-grad-text {
    background: var(--build-grad) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* ── 01 LIFECYCLE SECTION (5 STAGES + ASYMMETRICAL IMAGE) ── */
.build-lifecycle-section {
    padding: clamp(90px, 11vw, 140px) 0;
    background: var(--white);
    border-top: 1px solid rgba(43, 45, 66, 0.06);
}
.build-sticky-side {
    position: sticky;
    top: 120px;
}
.build-section-title {
    font-size: clamp(2.2rem, 3.8vw, 3.4rem);
    font-weight: 300;
    letter-spacing: -.03em;
    line-height: 1.1;
    color: var(--navy);
    margin-bottom: 1.6rem;
}
.build-lead-copy {
    font-size: 1.08rem;
    font-weight: 400;
    line-height: 1.8;
    color: var(--navy);
    margin-bottom: 2.2rem;
}

/* Asymmetrical Irregular Image Showcase (Amber Industrial) */
.build-img-wrap {
    position: relative;
    padding: 2.2rem 2.2rem 2.2rem 1.4rem;
    max-width: 500px;
    margin: 0 auto;
}
/* Irregular Polygonal Gradient Backplate */
.build-img-backdrop {
    position: absolute;
    top: 0;
    right: 0;
    width: 96%;
    height: 96%;
    background: linear-gradient(135deg, rgba(217, 119, 6, 0.95) 0%, rgba(245, 158, 11, 0.8) 55%, rgba(251, 191, 36, 0.45) 100%);
    clip-path: polygon(0% 4%, 93% 0%, 100% 92%, 7% 98%);
    transform: translate(22px, -18px) rotate(2.5deg);
    filter: drop-shadow(0 25px 40px rgba(217, 119, 6, 0.28));
    z-index: 1;
    transition: transform 0.6s var(--expo), opacity 0.6s var(--expo), filter 0.6s var(--expo);
}
/* Irregular Architectural Silhouette Photo Crop */
.build-img-box {
    position: relative;
    z-index: 2;
    overflow: hidden;
    background: var(--navy);
    width: 100%;
    min-height: 280px;
    aspect-ratio: 4 / 3;
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 32px), calc(100% - 32px) 100%, 0 100%, 0 20px);
    box-shadow: 0 24px 50px rgba(15, 23, 42, 0.18);
    transition: transform 0.6s var(--expo), box-shadow 0.6s var(--expo), clip-path 0.6s var(--expo);
}
.build-img-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: grayscale(18%) contrast(108%);
    transform: scale(1.02);
    transition: transform 0.8s var(--expo), filter 0.6s ease;
}
.build-img-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(217, 119, 6, 0.04) 0%, rgba(15, 23, 42, 0.38) 100%);
    pointer-events: none;
}
/* Dynamic Asymmetrical Counter-Parallax Hover */
.build-img-wrap:hover .build-img-box {
    transform: translate(-8px, -6px) scale(1.01);
    box-shadow: 0 36px 70px rgba(15, 23, 42, 0.26);
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 24px), calc(100% - 44px) 100%, 0 100%, 0 14px);
}
.build-img-wrap:hover .build-img-backdrop {
    transform: translate(30px, -24px) rotate(4deg) scale(1.03);
    filter: drop-shadow(0 32px 55px rgba(217, 119, 6, 0.45));
}
.build-img-wrap:hover .build-img-photo {
    transform: scale(1.08);
    filter: grayscale(0%) contrast(110%);
}

/* 5 Stages Pipeline */
.build-stage-list {
    display: flex;
    flex-direction: column;
    gap: 3rem;
}
.build-stage-item {
    position: relative;
    padding-left: clamp(2rem, 3.5vw, 3rem);
    border-left: 2px solid rgba(217, 119, 6, 0.25);
    transition: border-left-color 0.4s var(--expo), transform 0.4s var(--expo);
}
.build-stage-item:hover {
    border-left-color: var(--build-accent);
    transform: translateX(6px);
}
.build-stage-num {
    font-family: var(--mono);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 2.5px;
    color: var(--build-accent);
    margin-bottom: 0.6rem;
    text-transform: uppercase;
}
.build-stage-title {
    font-size: clamp(1.25rem, 2vw, 1.55rem);
    font-weight: 500;
    color: var(--navy);
    margin-bottom: 0.9rem;
    letter-spacing: -0.01em;
}
.build-stage-desc {
    font-size: 0.96rem;
    font-weight: 300;
    line-height: 1.82;
    color: rgba(43, 45, 66, 0.75);
    margin: 0;
}

/* ── 02 WHAT SETS US APART SECTION ── */
.build-apart-section {
    padding: clamp(90px, 12vw, 150px) 0;
    background: var(--soft);
    position: relative;
    border-top: 1px solid rgba(43, 45, 66, 0.06);
    border-bottom: 1px solid rgba(43, 45, 66, 0.06);
}
.build-apart-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(2.5rem, 4vw, 4rem);
    margin-top: 3.5rem;
}
@media (max-width: 991px) {
    .build-apart-grid {
        grid-template-columns: 1fr;
    }
}
.build-apart-item {
    position: relative;
    padding-top: 1.6rem;
    border-top: 2px solid rgba(217, 119, 6, 0.35);
    transition: border-top-color 0.4s var(--expo), transform 0.4s var(--expo);
}
.build-apart-item:hover {
    border-top-color: var(--build-accent);
    transform: translateY(-4px);
}
.build-apart-kicker {
    font-family: var(--mono);
    font-size: 0.68rem;
    letter-spacing: 3px;
    color: var(--build-accent);
    margin-bottom: 0.8rem;
    text-transform: uppercase;
}
.build-apart-title {
    font-size: 1.25rem;
    font-weight: 500;
    color: var(--navy);
    margin-bottom: 0.85rem;
    letter-spacing: -0.01em;
}
.build-apart-desc {
    font-size: 0.95rem;
    font-weight: 300;
    line-height: 1.8;
    color: rgba(43, 45, 66, 0.74);
    margin: 0;
}

/* ── 03 PAGE CTA AMBER OVERRIDES ── */
.page-build .cta-super .hi {
    color: var(--build-accent) !important;
}
.build-btn-lab {
    background: var(--build-grad) !important;
}
.build-btn-lab:hover {
    box-shadow: 0 18px 36px rgba(217, 119, 6, 0.3) !important;
}

/* ════════════════════════════════════════════════
   ENGINEERING STANDARDS PAGE — THEME & VARIABLES (PRECISION COBALT)
════════════════════════════════════════════════ */
:root {
    --standards-accent:       #0284c7;
    --standards-accent-2:     #38bdf8;
    --standards-grad:         linear-gradient(135deg, #0284c7 0%, #38bdf8 100%);
    --standards-glow:         rgba(2, 132, 199, 0.22);
}

body.page-standards {
    --green:              #0284c7 !important;
    --green2:             #38bdf8 !important;
    --grad:               linear-gradient(135deg, #0284c7 0%, #38bdf8 100%) !important;
}

/* Cursor overrides on Standards Page (Zero Green) */
body.page-standards .cur-dot {
    background: var(--standards-accent) !important;
}
body.page-standards .cur-ring {
    border-color: rgba(2, 132, 199, 0.45) !important;
}
body.page-standards .cur-ring.hov {
    border-color: var(--standards-accent) !important;
}

/* Scroll progress */
body.page-standards .scroll-progress {
    background: var(--standards-grad) !important;
}

/* Pulse Beacon on Standards Page */
body.page-standards .pulse-dot {
    background: var(--standards-accent) !important;
    box-shadow: 0 0 0 0 rgba(2, 132, 199, 0.6) !important;
    animation: standards-pulse-beacon 2.5s infinite !important;
}
@keyframes standards-pulse-beacon {
    0%   { box-shadow: 0 0 0 0 rgba(2, 132, 199, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(2, 132, 199, 0); }
    100% { box-shadow: 0 0 0 0 rgba(2, 132, 199, 0); }
}

/* Footer & Nav links on Standards Page */
body.page-standards .ftr-links a:hover,
body.page-standards .ftr-contact a {
    color: var(--standards-accent) !important;
}

/* Standards Page Hero */
.standards-nb-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
}
.standards-hero-sub {
    font-size: clamp(1rem, 1.6vw, 1.2rem) !important;
    font-weight: 300 !important;
    line-height: 1.78 !important;
    color: rgba(43, 45, 66, .65) !important;
    border-left: 2px solid var(--standards-accent) !important;
    padding-left: 1.4rem !important;
    max-width: 660px !important;
}
.standards-hero-sub strong,
.standards-accent {
    color: var(--standards-accent) !important;
    font-weight: 600 !important;
}
.standards-grad-text {
    background: var(--standards-grad) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* Common Standards Section Styles */
.standards-section {
    padding: clamp(90px, 11vw, 140px) 0;
    border-top: 1px solid rgba(43, 45, 66, 0.06);
    background: var(--white);
}
.standards-section--soft {
    background: var(--soft);
}
.standards-section-title {
    font-size: clamp(2.2rem, 3.8vw, 3.4rem);
    font-weight: 300;
    letter-spacing: -.03em;
    line-height: 1.1;
    color: var(--navy);
    margin-bottom: 1.5rem;
}
.standards-kicker {
    font-family: var(--mono);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 3px;
    color: var(--standards-accent);
    text-transform: uppercase;
    margin-bottom: 1rem;
    display: block;
}
.standards-lead-copy {
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.8;
    color: var(--navy);
    margin-bottom: 2rem;
}

/* Asymmetrical Irregular Image Showcase (Cobalt Edition) */
.standards-img-wrap {
    position: relative;
    padding: 2.2rem 2.2rem 2.2rem 1.4rem;
    max-width: 520px;
    margin: 0 auto;
}
.standards-img-wrap--02 {
    padding: 2.2rem 1.4rem 2.2rem 2.2rem;
}
.standards-img-backdrop {
    position: absolute;
    top: 0;
    right: 0;
    width: 96%;
    height: 96%;
    background: linear-gradient(135deg, rgba(2, 132, 199, 0.95) 0%, rgba(56, 189, 248, 0.8) 55%, rgba(125, 211, 252, 0.45) 100%);
    clip-path: polygon(6% 0%, 100% 5%, 94% 97%, 0% 93%);
    transform: translate(22px, -18px) rotate(-2.5deg);
    filter: drop-shadow(0 25px 40px rgba(2, 132, 199, 0.28));
    z-index: 1;
    transition: transform 0.6s var(--expo), opacity 0.6s var(--expo), filter 0.6s var(--expo);
}
.standards-img-wrap--02 .standards-img-backdrop {
    right: auto;
    left: 0;
    clip-path: polygon(0% 4%, 94% 0%, 100% 95%, 6% 98%);
    transform: translate(-22px, -18px) rotate(2.5deg);
}
.standards-img-wrap--03 .standards-img-backdrop {
    clip-path: polygon(8% 0%, 100% 6%, 92% 100%, 0% 94%);
    transform: translate(20px, 20px) rotate(-3deg);
}

.standards-img-box {
    position: relative;
    z-index: 2;
    overflow: hidden;
    background: var(--navy);
    width: 100%;
    min-height: 280px;
    aspect-ratio: 4 / 3;
    clip-path: polygon(0 0, 96% 0, 100% 6%, 100% 88%, 88% 100%, 0 100%, 0 22px);
    box-shadow: 0 24px 50px rgba(15, 23, 42, 0.18);
    transition: transform 0.6s var(--expo), box-shadow 0.6s var(--expo), clip-path 0.6s var(--expo);
}
.standards-img-wrap--02 .standards-img-box {
    clip-path: polygon(4% 0, 100% 0, 100% 100%, 4% 100%, 0 94%, 0 6%);
}
.standards-img-wrap--03 .standards-img-box {
    clip-path: polygon(0 14px, 14px 0, calc(100% - 14px) 0, 100% 14px, 100% calc(100% - 14px), calc(100% - 14px) 100%, 14px 100%, 0 calc(100% - 14px));
}

.standards-img-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: grayscale(18%) contrast(108%);
    transform: scale(1.02);
    transition: transform 0.8s var(--expo), filter 0.6s ease;
}
.standards-img-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(2, 132, 199, 0.04) 0%, rgba(15, 23, 42, 0.38) 100%);
    pointer-events: none;
}

/* Hover dynamics */
.standards-img-wrap:hover .standards-img-box {
    transform: translate(-8px, -6px) scale(1.01);
    box-shadow: 0 36px 70px rgba(15, 23, 42, 0.26);
}
.standards-img-wrap--02:hover .standards-img-box {
    transform: translate(8px, -6px) scale(1.01);
}
.standards-img-wrap:hover .standards-img-backdrop {
    transform: translate(30px, -24px) rotate(-4deg) scale(1.03);
    filter: drop-shadow(0 32px 55px rgba(2, 132, 199, 0.45));
}
.standards-img-wrap--02:hover .standards-img-backdrop {
    transform: translate(-30px, -24px) rotate(4deg) scale(1.03);
    filter: drop-shadow(0 32px 55px rgba(2, 132, 199, 0.45));
}
.standards-img-wrap:hover .standards-img-photo {
    transform: scale(1.08);
    filter: grayscale(0%) contrast(110%);
}

/* ── Vertical Engineering Standards Timeline ── */
.standards-timeline-section {
    position: relative;
    padding: clamp(90px, 12vw, 150px) 0;
    background: var(--white);
    border-top: 1px solid rgba(43, 45, 66, 0.06);
}
.standards-timeline-container {
    position: relative;
    padding-top: 2rem;
}
/* Vertical continuous spine connecting the standards */
.standards-timeline-track {
    position: absolute;
    top: 50px;
    bottom: 120px;
    left: 28px;
    width: 2px;
    background: linear-gradient(180deg, rgba(2, 132, 199, 0.35) 0%, rgba(56, 189, 248, 0.2) 50%, rgba(2, 132, 199, 0.35) 100%);
    z-index: 1;
}
@media (min-width: 992px) {
    .standards-timeline-track {
        left: 50%;
        transform: translateX(-50%);
    }
}

/* Timeline Stage Item */
.standards-timeline-item {
    position: relative;
    z-index: 2;
    padding-bottom: clamp(90px, 11vw, 140px);
}
.standards-timeline-item:last-child {
    padding-bottom: 0;
}

/* Central Milestone Node */
.standards-timeline-node-wrap {
    position: absolute;
    top: 0;
    left: 28px;
    transform: translateX(-50%);
    z-index: 3;
}
@media (min-width: 992px) {
    .standards-timeline-node-wrap {
        left: 50%;
    }
}
.standards-timeline-node {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: #ffffff;
    border: 2px solid var(--standards-accent);
    box-shadow: 0 0 0 6px rgba(2, 132, 199, 0.12), 0 12px 24px rgba(15, 23, 42, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--mono);
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--standards-accent);
    letter-spacing: -0.5px;
}

/* Timeline Content */
.standards-timeline-content {
    padding-left: clamp(84px, 15vw, 115px);
}
@media (min-width: 992px) {
    .standards-timeline-content {
        padding-left: 0;
    }
    .standards-timeline-content--left {
        padding-right: clamp(45px, 6vw, 85px) !important;
        padding-left: 0 !important;
    }
    .standards-timeline-content--right {
        padding-left: clamp(55px, 7vw, 95px) !important;
        padding-right: 0 !important;
    }
    .standards-timeline-img-col--right {
        padding-left: clamp(45px, 6vw, 85px) !important;
    }
    .standards-timeline-img-col--left {
        padding-right: clamp(45px, 6vw, 85px) !important;
    }
}

@media (max-width: 991px) {
    .standards-timeline-item .standards-img-wrap {
        margin-left: 48px;
        max-width: calc(100% - 48px);
    }
}

/* Clean Unboxed Directive List (No tags) */
.standards-directive-list {
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
    margin-top: 1.8rem;
}
.standards-directive-item {
    position: relative;
    padding-left: 1.5rem;
    border-left: 2px solid rgba(2, 132, 199, 0.3);
    transition: border-left-color 0.3s ease, transform 0.3s ease;
}
.standards-directive-item:hover {
    border-left-color: var(--standards-accent);
    transform: translateX(4px);
}
.standards-directive-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 0.4rem;
    letter-spacing: -0.01em;
}
.standards-directive-desc {
    font-size: 0.94rem;
    font-weight: 300;
    line-height: 1.75;
    color: rgba(43, 45, 66, 0.8);
    margin: 0;
}

/* ── Section 04: The Shift / Architectural Benchmark Table ── */
.standards-shift-section {
    padding: clamp(90px, 11vw, 150px) 0;
    background: var(--white);
    border-top: 1px solid rgba(43, 45, 66, 0.06);
}
.standards-benchmark-table {
    margin-top: 3.5rem;
    border-top: 2px solid rgba(43, 45, 66, 0.15);
}
.standards-table-hdr {
    display: grid;
    grid-template-columns: 220px 1fr 1fr;
    padding: 1.4rem 0;
    border-bottom: 1px solid rgba(43, 45, 66, 0.15);
    font-family: var(--mono);
    font-size: 0.74rem;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    font-weight: 600;
}
.standards-table-hdr-col--label {
    color: rgba(43, 45, 66, 0.45);
}
.standards-table-hdr-col--default {
    color: rgba(43, 45, 66, 0.6);
}
.standards-table-hdr-col--standard {
    color: var(--standards-accent);
    padding-left: 2.5rem;
}

.standards-table-row {
    display: grid;
    grid-template-columns: 220px 1fr 1fr;
    padding: 2.5rem 0;
    border-bottom: 1px solid rgba(43, 45, 66, 0.08);
    align-items: start;
    transition: background 0.25s ease;
}
.standards-table-row:hover {
    background: rgba(2, 132, 199, 0.015);
}
.standards-table-cat {
    font-family: var(--mono);
    font-size: 0.74rem;
    font-weight: 600;
    letter-spacing: 2px;
    color: var(--navy);
    text-transform: uppercase;
    padding-top: 0.25rem;
}
.standards-table-default {
    padding-right: 2.5rem;
}
.standards-table-standard {
    padding-left: 2.5rem;
    border-left: 2px solid var(--standards-accent);
}
.standards-table-item-title {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 0.5rem;
    letter-spacing: -0.01em;
}
.standards-table-item-desc {
    font-size: 0.94rem;
    font-weight: 300;
    line-height: 1.75;
    margin: 0;
}
.standards-table-default .standards-table-item-desc {
    color: rgba(43, 45, 66, 0.65);
}
.standards-table-standard .standards-table-item-desc {
    color: rgba(43, 45, 66, 0.85);
}

@media (max-width: 860px) {
    .standards-table-hdr {
        display: none;
    }
    .standards-table-row {
        grid-template-columns: 1fr;
        gap: 1.6rem;
        padding: 2rem 0;
    }
    .standards-table-standard {
        padding-left: 1.2rem;
    }
}

/* CTA Cobalt Overrides */
.page-standards .cta-super .hi {
    color: var(--standards-accent) !important;
}
.standards-btn-lab {
    background: var(--standards-grad) !important;
}
.standards-btn-lab:hover {
    box-shadow: 0 18px 36px rgba(2, 132, 199, 0.3) !important;
}

/* ════════════════════════════════════════════════
   FOUNDRY PAGE
════════════════════════════════════════════════ */

/* ── HERO ── */
.foundry-hero {
    min-height: 100vh;
    background: var(--white);
    position: relative; overflow: hidden;
    display: flex; flex-direction: column;
}
.foundry-hero-inner {
    flex: 1; display: flex; align-items: center;
    padding-top: clamp(100px,12vw,140px);
    padding-bottom: clamp(60px,8vw,100px);
    position: relative; z-index: 3;
}
.foundry-hero-inner > .row { width: 100%; }

/* Blueprint environment — right side */
.foundry-blueprint-env {
    position: absolute;
    top: 0; right: 0;
    width: 58%; height: 100%;
    z-index: 1; overflow: hidden;
    pointer-events: none;
}

/* Perspective grid */
.foundry-grid {
    position: absolute;
    width: 200%; height: 200%;
    top: -50%; left: -50%;
    background-image:
        linear-gradient(rgba(43,45,66,.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(43,45,66,.07) 1px, transparent 1px);
    background-size: 60px 60px;
    transform: perspective(900px) rotateX(58deg);
    animation: foundryGridMove 22s linear infinite;
}
@keyframes foundryGridMove {
    0%   { transform: perspective(900px) rotateX(58deg) translateY(0); }
    100% { transform: perspective(900px) rotateX(58deg) translateY(60px); }
}

/* Rotating geometry */
.foundry-geo {
    position: absolute;
    top: 50%; right: 14%;
    transform: translateY(-50%);
    width: clamp(280px,32vw,440px);
    height: clamp(280px,32vw,440px);
    display: flex; align-items: center; justify-content: center;
}
.foundry-geo-outer {
    position: absolute; inset: 0;
    border: 1.5px solid rgba(43,45,66,.1);
    animation: foundryRotate 22s linear infinite;
}
.foundry-geo-inner {
    position: absolute;
    width: 62%; height: 62%;
    border: 1.5px dashed var(--green);
    opacity: .5;
    animation: foundryRotate 16s linear infinite reverse;
}
.geo-dot {
    position: absolute;
    width: 7px; height: 7px;
    background: var(--green); border-radius: 50%;
    opacity: .7;
}
.geo-dot--tl { top: -3.5px; left: -3.5px; }
.geo-dot--tr { top: -3.5px; right: -3.5px; }
.geo-dot--bl { bottom: -3.5px; left: -3.5px; }
.geo-dot--br { bottom: -3.5px; right: -3.5px; }

@keyframes foundryRotate {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

/* Hero title */
.foundry-hero-title {
    font-size: clamp(4rem, 10vw, 9rem);
    font-weight: 300; letter-spacing: -.05em;
    line-height: .9; text-transform: uppercase;
    color: var(--navy); margin-top: 2rem; margin-bottom: 2.5rem;
}
.text-outline-foundry {
    color: transparent;
    -webkit-text-stroke: 2px var(--navy);
}

/* Intro box with left green border */
.foundry-intro-box {
    border-left: 3px solid var(--green);
    padding-left: 1.6rem;
    max-width: 500px;
}
.foundry-intro-text {
    font-size: clamp(1rem,1.5vw,1.2rem);
    font-weight: 400; line-height: 1.65;
    color: var(--navy); margin-bottom: 1.4rem;
}

/* Progress bar */
.foundry-status { display: flex; flex-direction: column; gap: .5rem; }
.foundry-status-label {
    font-family: var(--mono); font-size: .58rem;
    letter-spacing: 3px; color: var(--green);
    text-transform: uppercase;
}
.foundry-progress {
    width: 120px; height: 2px;
    background: rgba(88,175,108,.15);
    position: relative; overflow: hidden;
}
.foundry-progress-fill {
    position: absolute; left: -100%; top: 0;
    width: 100%; height: 100%;
    background: var(--grad);
    animation: foundryLoad 2.2s ease-in-out infinite;
}
@keyframes foundryLoad {
    0%   { left: -100%; }
    100% { left: 100%; }
}

/* ── PROTOCOL ── */
.foundry-protocol {
    background: var(--soft);
    padding: clamp(90px,12vw,160px) 0;
    border-top: 1px solid rgba(43,45,66,.06);
}
.foundry-section-title {
    font-size: clamp(2.5rem,5.5vw,5rem);
    font-weight: 300; letter-spacing: -.04em;
    line-height: .9; text-transform: uppercase;
    color: var(--navy); margin-top: 1rem;
}
.foundry-protocol-quote {
    font-family: var(--mono); font-size: .78rem;
    letter-spacing: 1px; color: var(--green);
    margin-top: 1.5rem; margin-bottom: 0;
}

/* Three-phase cards with liquid fill on hover */
.foundry-phases {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    border: 1px solid rgba(43,45,66,.08);
}
@media(max-width:767px) { .foundry-phases { grid-template-columns: 1fr; } }

.foundry-phase {
    position: relative; overflow: hidden;
    padding: clamp(2.5rem,4vw,4rem) clamp(1.8rem,3vw,3rem);
    border-right: 1px solid rgba(43,45,66,.08);
    transition: color .5s;
}
.foundry-phase:last-child { border-right: none; }

/* Liquid fill — slides up from bottom on hover */
.fp-liquid {
    position: absolute;
    bottom: -100%; left: 0;
    width: 100%; height: 100%;
    background: var(--navy);
    transition: bottom .65s cubic-bezier(.85,0,.15,1);
    z-index: 1;
}
.foundry-phase:hover .fp-liquid { bottom: 0; }

.fp-content { position: relative; z-index: 2; }
.fp-label {
    font-family: var(--mono); font-size: .62rem;
    letter-spacing: 3px; color: var(--green);
    text-transform: uppercase;
    transition: color .3s;
}
.fp-title {
    font-size: clamp(1.5rem,2.5vw,2rem);
    font-weight: 300; color: var(--navy);
    letter-spacing: -.03em; line-height: 1.1;
    margin-top: 1.4rem; margin-bottom: 1.2rem;
    transition: color .3s;
}
.fp-desc {
    font-size: .88rem; font-weight: 300;
    line-height: 1.78; color: rgba(43,45,66,.5);
    transition: color .3s; margin: 0;
}
/* On hover — text goes white */
.foundry-phase:hover .fp-label { color: var(--green); }
.foundry-phase:hover .fp-title { color: rgba(255,255,255,.9); }
.foundry-phase:hover .fp-desc  { color: rgba(255,255,255,.4); }

/* Arrow connector between phases */
.fp-arrow {
    position: absolute; top: 50%; right: -10px;
    width: 20px; height: 1px;
    background: var(--green); z-index: 3; opacity: .3;
    transition: opacity .3s;
}
.foundry-phase:hover .fp-arrow { opacity: 0; }

/* ── DEPLOYMENTS ── */
.foundry-deployments {
    background: var(--white);
    padding: clamp(90px,12vw,160px) 0;
    border-top: 1px solid rgba(43,45,66,.06);
}
.foundry-deployment {
    padding: clamp(50px,7vw,90px) 0;
    border-bottom: 1px solid rgba(43,45,66,.06);
}
.foundry-deployment:last-child { border-bottom: none; }

.fd-meta {
    display: flex; align-items: center; gap: 1rem;
    margin-bottom: 1.4rem;
}
.fd-badge {
    font-family: var(--mono); font-size: .6rem;
    letter-spacing: 2px; text-transform: uppercase;
    background: var(--navy); color: var(--green);
    padding: 4px 12px;
}
.fd-client {
    font-family: var(--mono); font-size: .6rem;
    letter-spacing: 2px; text-transform: uppercase;
    color: rgba(43,45,66,.28);
}
.fd-title {
    font-size: clamp(1.4rem,2.5vw,2.2rem);
    font-weight: 300; letter-spacing: -.03em;
    line-height: 1.15; color: var(--navy);
}

/* Visual placeholder cards */
.fd-visual {
    aspect-ratio: 16/10;
    position: relative;
    border: 1px solid rgba(43,45,66,.07);
    overflow: hidden;
}
.fd-visual--grid {
    background-image:
        radial-gradient(rgba(88,175,108,.12) 1px, transparent 1px);
    background-size: 22px 22px;
    background-color: var(--soft);
}
.fd-visual--dots {
    background-image:
        linear-gradient(rgba(88,175,108,.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(88,175,108,.06) 1px, transparent 1px);
    background-size: 34px 34px;
    background-color: var(--soft);
}
.fd-visual::after {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(135deg, transparent 60%, rgba(88,175,108,.06));
}

/* ── FOUNDER — removed, replaced by letter section ── */

/* ── FOUNDRY DEPLOYMENTS — updated styles ── */
.fd-outcomes {
    display: flex; gap: 2rem; flex-wrap: wrap;
    margin-top: 1.8rem; padding-top: 1.5rem;
    border-top: 1px solid rgba(43,45,66,.07);
}
.fd-outcome {}
.fd-out-num {
    font-size: 1.8rem; font-weight: 800; line-height: 1;
    background: var(--grad);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.fd-out-lbl {
    font-family: var(--mono); font-size: .58rem;
    letter-spacing: 2px; text-transform: uppercase;
    color: rgba(43,45,66,.32); margin-top: 4px;
}

/* Photo visual card */
.fd-visual--photo {
    aspect-ratio: 16/10;
    overflow: hidden; position: relative;
}
.fd-visual--photo a { display: block; width: 100%; height: 100%; }
.fd-visual--photo img {
    width: 100%; height: 100%; object-fit: cover;
    filter: grayscale(20%) brightness(.95);
    transition: transform .8s var(--expo), filter .5s;
    display: block;
}
.fd-visual--photo:hover img { transform: scale(1.04); filter: grayscale(0) brightness(1); }
.fd-visual--photo::after {
    content: ''; position: absolute; inset: 0;
    background: linear-gradient(135deg, transparent 55%, rgba(88,175,108,.08));
    pointer-events: none;
}

/* Fallback visual label */
.fd-visual { position: relative; }
.fd-visual-label {
    position: absolute; bottom: 1.2rem; right: 1.4rem;
    font-family: var(--mono); font-size: .6rem;
    letter-spacing: 3px; text-transform: uppercase;
    color: rgba(43,45,66,.18);
}

/* Archive link row */
.fd-archive-link {
    padding-top: clamp(40px,6vw,70px);
    border-top: 1px solid rgba(43,45,66,.07);
    margin-top: clamp(40px,6vw,70px);
}

/* ── FOUNDER LETTER ── */
.foundry-letter {
    background: var(--navy);
    padding: clamp(90px,12vw,160px) 0;
    position: relative; overflow: hidden;
}
.foundry-letter::before {
    content: ''; position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(88,175,108,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(88,175,108,.025) 1px, transparent 1px);
    background-size: 55px 55px;
}

/* Ghost name in background */
.letter-ghost {
    position: absolute; bottom: -5%; right: -2%;
    font-size: 22vw; font-weight: 900;
    letter-spacing: -.05em; line-height: 1;
    color: rgba(255,255,255,.018);
    text-transform: uppercase;
    pointer-events: none; user-select: none;
}

/* Title */
.letter-title {
    font-size: clamp(2.5rem,5vw,4.5rem);
    font-weight: 300; letter-spacing: -.04em;
    line-height: .95; color: rgba(255,255,255,.88);
    margin-top: 1rem;
}

/* Byline */
.letter-byline {
    border-left: 2px solid rgba(88,175,108,.3);
    padding-left: 1.4rem;
}
.letter-byline-name {
    font-size: 1.1rem; font-weight: 600;
    color: rgba(255,255,255,.85); letter-spacing: -.02em;
    margin-bottom: .3rem;
}
.letter-byline-role {
    font-family: var(--mono); font-size: .6rem;
    letter-spacing: 2px; text-transform: uppercase;
    color: rgba(255,255,255,.25); line-height: 1.7;
}

/* Letter body container */
.letter-body {
    border-top: 1px solid rgba(255,255,255,.06);
    padding-top: clamp(40px,6vw,70px);
}

/* Opening pull quote */
.letter-opening {
    position: relative;
    margin-bottom: clamp(40px,6vw,70px);
    padding-bottom: clamp(40px,6vw,70px);
    border-bottom: 1px solid rgba(255,255,255,.06);
}
.letter-open-mark {
    font-size: 8rem; line-height: .5;
    color: rgba(88,175,108,.15);
    font-family: Georgia, serif; font-weight: 900;
    position: absolute; top: -.5rem; left: -1rem;
    pointer-events: none; user-select: none;
}
.letter-pull {
    font-size: clamp(1.4rem,2.8vw,2.2rem);
    font-weight: 300; font-style: italic;
    color: rgba(255,255,255,.8);
    line-height: 1.45; letter-spacing: -.02em;
    max-width: 820px;
    padding-left: clamp(1rem,3vw,3rem);
    margin: 0;
}

/* Body paragraphs */
.letter-paragraphs {
    columns: 2; column-gap: clamp(2rem,5vw,5rem);
    margin-bottom: clamp(40px,6vw,70px);
}
@media(max-width:767px) { .letter-paragraphs { columns: 1; } }

.letter-paragraphs p {
    font-size: clamp(.9rem,1.2vw,1.05rem);
    font-weight: 300; line-height: 1.88;
    color: rgba(255,255,255,.42);
    margin-bottom: 1.6rem;
    break-inside: avoid;
}
.letter-paragraphs p em {
    color: rgba(255,255,255,.7);
    font-style: italic;
}

/* Signature */
.letter-signature {
    display: flex; flex-direction: column; gap: .4rem;
}
.letter-sig-line {
    width: 60px; height: 1px;
    background: var(--green); margin-bottom: .8rem;
}
.letter-sig-name {
    font-size: 1.1rem; font-weight: 600;
    color: rgba(255,255,255,.8);
    letter-spacing: -.02em;
}
.letter-sig-role {
    font-family: var(--mono); font-size: .6rem;
    letter-spacing: 2px; text-transform: uppercase;
    color: rgba(255,255,255,.22); line-height: 1.7;
}


/* ════════════════════════════════════════════════
   FIELD SYSTEMS & CASE STUDIES — page-case-studies.php / archive-case_study.php
   Scoped Palette: Cyan / Electric Teal (#06b6d4, #14b8a6)
════════════════════════════════════════════════ */

:root {
    --cs-accent:       #06b6d4;
    --cs-accent-dark:  #0891b2;
    --cs-accent-2:     #14b8a6;
    --cs-grad:         linear-gradient(135deg, #06b6d4 0%, #14b8a6 100%);
    --cs-glow:         rgba(6, 182, 212, 0.22);
}

body.page-case-studies,
body.post-type-archive-case_study,
body.page-template-page-case-studies {
    --green:           #06b6d4 !important;
    --green2:          #14b8a6 !important;
    --grad:            linear-gradient(135deg, #06b6d4 0%, #14b8a6 100%) !important;
}

/* Cursor overrides on Case Studies Page */
body.page-case-studies .cur-dot,
body.post-type-archive-case_study .cur-dot,
body.page-template-page-case-studies .cur-dot {
    background: var(--cs-accent) !important;
}
body.page-case-studies .cur-ring,
body.post-type-archive-case_study .cur-ring,
body.page-template-page-case-studies .cur-ring {
    border-color: rgba(6, 182, 212, 0.45) !important;
}
body.page-case-studies .cur-ring.hov,
body.post-type-archive-case_study .cur-ring.hov,
body.page-template-page-case-studies .cur-ring.hov {
    border-color: var(--cs-accent) !important;
}

/* Scroll progress */
body.page-case-studies .scroll-progress,
body.post-type-archive-case_study .scroll-progress,
body.page-template-page-case-studies .scroll-progress {
    background: var(--cs-grad) !important;
}

/* Pulse Beacon on Case Studies Page */
body.page-case-studies .pulse-dot,
body.post-type-archive-case_study .pulse-dot,
body.page-template-page-case-studies .pulse-dot,
.cs-nb-hero .pulse-dot {
    background: var(--cs-accent) !important;
    box-shadow: 0 0 0 0 rgba(6, 182, 212, 0.6) !important;
    animation: cs-pulse-beacon 2.5s infinite !important;
}
@keyframes cs-pulse-beacon {
    0%   { box-shadow: 0 0 0 0 rgba(6, 182, 212, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(6, 182, 212, 0); }
    100% { box-shadow: 0 0 0 0 rgba(6, 182, 212, 0); }
}

/* Footer & Nav links on Case Studies Page */
body.page-case-studies .ftr-links a:hover,
body.post-type-archive-case_study .ftr-links a:hover,
body.page-template-page-case-studies .ftr-links a:hover,
body.page-case-studies .ftr-contact a,
body.post-type-archive-case_study .ftr-contact a,
body.page-template-page-case-studies .ftr-contact a {
    color: var(--cs-accent) !important;
}

/* Case Studies Page Hero */
.cs-nb-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
}
.cs-hero-sub {
    font-size: clamp(1rem, 1.6vw, 1.2rem) !important;
    font-weight: 300 !important;
    line-height: 1.78 !important;
    color: rgba(43, 45, 66, .65) !important;
    border-left: 2px solid var(--cs-accent) !important;
    padding-left: 1.4rem !important;
    max-width: 640px !important;
}
.cs-hero-sub strong,
.cs-accent {
    color: var(--cs-accent) !important;
    font-weight: 600 !important;
}
.cs-grad-text {
    background: var(--cs-grad) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
.cs-stat-num {
    background: var(--cs-grad) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* Legacy .csa-hero compatibility */
.csa-hero {
    background: var(--white);
    padding-top: clamp(130px,15vw,180px);
    padding-bottom: 0;
    position: relative; overflow: hidden;
    border-bottom: 1px solid rgba(43,45,66,.06);
}
.csa-hero-inner { position: relative; z-index: 2; }
.csa-hero-bg-word {
    position: absolute; bottom: -5%; right: -1%;
    font-size: 20vw; font-weight: 900;
    letter-spacing: -.06em; line-height: 1;
    color: rgba(43,45,66,.025);
    text-transform: uppercase;
    pointer-events: none; user-select: none; z-index: 0;
}
.csa-hero-title {
    font-size: clamp(4rem,10vw,9rem);
    font-weight: 900; letter-spacing: -.05em;
    line-height: .88; text-transform: uppercase;
    color: var(--navy); margin-top: 1.5rem;
}
.csa-count {
    display: flex; align-items: baseline; gap: .7rem;
    margin-top: 2rem; padding-top: 1.5rem;
    border-top: 1px solid rgba(43,45,66,.07);
}
.csa-count-num {
    font-size: 2.2rem; font-weight: 900; line-height: 1;
    background: var(--cs-grad);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    letter-spacing: -.04em;
}
.csa-count-lbl {
    font-family: var(--mono); font-size: .56rem;
    letter-spacing: 2px; text-transform: uppercase;
    color: rgba(43,45,66,.28); line-height: 1.5;
}

/* Domain filter tabs sticky bar */
.csa-tabs-bar {
    background: var(--white);
    border-bottom: 1px solid rgba(43, 45, 66, 0.06);
    position: sticky;
    top: 70px;
    z-index: 50;
}
.csa-tabs {
    display: flex;
    align-items: center;
    gap: 0;
    overflow-x: auto;
    scrollbar-width: none;
    margin: 0;
    background: transparent;
}
.csa-tabs::-webkit-scrollbar { display: none; }
.csa-tab {
    flex-shrink: 0;
    font-family: var(--mono);
    font-size: .62rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: rgba(43, 45, 66, .35);
    text-decoration: none;
    padding: 1.1rem 1.8rem;
    border-right: 1px solid rgba(43, 45, 66, 0.06);
    position: relative;
    transition: color .3s;
    background: transparent;
    border-top: none;
    border-left: none;
    border-bottom: none;
    cursor: pointer;
}
.csa-tab::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--cs-grad);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .4s var(--expo);
}
.csa-tab:hover,
.csa-tab--active {
    color: var(--navy);
}
.csa-tab--active::after,
.csa-tab:hover::after {
    transform: scaleX(1);
}

/* ── GRID SECTION ── */
.csa-grid-section {
    background: var(--navy);
    padding: clamp(60px,9vw,120px) 0;
}

/* Empty image placeholder on dark bg */
.cs-img--empty {
    display: block;
    background: rgba(255,255,255,.03);
    position: relative; overflow: hidden;
}
.cs-img-empty-bg {
    position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(88,175,108,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(88,175,108,.05) 1px, transparent 1px);
    background-size: 36px 36px;
}

/* Outcome items — slightly different from fd-outcomes */
.cs-outcome-item {
    display: flex; flex-direction: column; gap: .2rem;
}

/* cs-headline links */
.cs-headline a {
    color: inherit; text-decoration: none;
    transition: color .3s;
}
.cs-card:hover .cs-headline a { color: var(--green); }

/* ── PAGINATION ── */
.csa-pagination {
    display: flex; align-items: center;
    justify-content: center; gap: 3rem;
    margin-top: clamp(40px,6vw,70px);
    padding-top: 2.5rem;
    border-top: 1px solid rgba(255,255,255,.06);
}
.csa-pag-btn {
    display: inline-flex; align-items: center; gap: .5rem;
    font-family: var(--mono); font-size: .62rem;
    letter-spacing: 2px; text-transform: uppercase;
    color: rgba(255,255,255,.4); text-decoration: none;
    transition: color .3s, gap .3s var(--expo);
}
.csa-pag-btn:hover { color: var(--green); gap: .9rem; }
.csa-pag-info {
    font-family: var(--mono); font-size: .65rem;
    letter-spacing: 1px; color: rgba(255,255,255,.2);
}
.csa-pag-info strong {
    font-size: 1.2rem; font-weight: 900;
    color: rgba(255,255,255,.7); letter-spacing: -.02em;
}

/* ── EMPTY STATE ── */
.csa-empty {
    padding: clamp(60px,8vw,100px) 0;
    text-align: center;
}
.csa-empty-title {
    font-size: 1.3rem; font-weight: 300;
    color: rgba(255,255,255,.7); margin-bottom: 1rem;
    letter-spacing: -.02em;
}
.csa-empty .body-copy { color: rgba(255,255,255,.3); }

/* ════════════════════════════════════════════════
   EXPERTISE DETAIL PAGES — template-expertise.php
   Scoped Themes: Embedded (Cobalt), Control (Amber), Vision (Cyan), Telemetry (Indigo)
════════════════════════════════════════════════ */

/* Scoped Accent Variables per Domain */
.exp-theme--embedded {
    --exp-accent: #0284c7;
    --exp-accent-2: #38bdf8;
    --exp-grad: linear-gradient(135deg, #0284c7 0%, #38bdf8 100%);
    --exp-glow: rgba(2, 132, 199, 0.25);
}
.exp-theme--control {
    --exp-accent: #d97706;
    --exp-accent-2: #f59e0b;
    --exp-grad: linear-gradient(135deg, #d97706 0%, #f59e0b 100%);
    --exp-glow: rgba(217, 119, 6, 0.25);
}
.exp-theme--vision {
    --exp-accent: #06b6d4;
    --exp-accent-2: #14b8a6;
    --exp-grad: linear-gradient(135deg, #06b6d4 0%, #14b8a6 100%);
    --exp-glow: rgba(6, 182, 212, 0.25);
}
.exp-theme--telemetry {
    --exp-accent: #6366f1;
    --exp-accent-2: #8b5cf6;
    --exp-grad: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    --exp-glow: rgba(99, 102, 241, 0.25);
}

/* Dynamic Cursor & Scroll overrides */
body.page-expertise .cur-dot { background: var(--exp-accent, #0284c7) !important; }
body.page-expertise .cur-ring { border-color: rgba(2, 132, 199, 0.45) !important; }
body.page-expertise .cur-ring.hov { border-color: var(--exp-accent, #0284c7) !important; }
body.page-expertise .scroll-progress { background: var(--exp-grad, #0284c7) !important; }

/* Pulse beacon */
.exp-nb-hero .pulse-dot {
    background: var(--exp-accent, #0284c7) !important;
    box-shadow: 0 0 0 0 rgba(2, 132, 199, 0.6) !important;
    animation: exp-pulse-beacon 2.5s infinite !important;
}
@keyframes exp-pulse-beacon {
    0%   { box-shadow: 0 0 0 0 rgba(2, 132, 199, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(2, 132, 199, 0); }
    100% { box-shadow: 0 0 0 0 rgba(2, 132, 199, 0); }
}

/* Hero Typography */
.exp-nb-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(43, 45, 66, 0.06);
}
.exp-hero-sub {
    font-size: clamp(1rem, 1.6vw, 1.2rem) !important;
    font-weight: 300 !important;
    line-height: 1.78 !important;
    color: rgba(43, 45, 66, .65) !important;
    border-left: 2px solid var(--exp-accent, #0284c7) !important;
    padding-left: 1.4rem !important;
    max-width: 640px !important;
}
.exp-accent {
    color: var(--exp-accent, #0284c7) !important;
    font-weight: 600 !important;
}
.exp-grad-text {
    background: var(--exp-grad, linear-gradient(135deg, #0284c7, #38bdf8)) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
.exp-stat-num {
    background: var(--exp-grad, linear-gradient(135deg, #0284c7, #38bdf8)) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* 01 Architecture Section with Asymmetrical Imagery */
.exp-arch-section {
    padding: clamp(90px, 12vw, 150px) 0;
    background: var(--white);
    position: relative;
}
.exp-section-title {
    font-size: clamp(2.2rem, 3.8vw, 3.4rem);
    font-weight: 300;
    letter-spacing: -.03em;
    line-height: 1.12;
    color: var(--navy);
    margin-bottom: 1.6rem;
}
.exp-lead-copy {
    font-size: 1.08rem;
    font-weight: 400;
    line-height: 1.8;
    color: var(--navy);
    margin-bottom: 1.5rem;
}
.exp-body-copy {
    font-size: 0.95rem;
    font-weight: 300;
    line-height: 1.82;
    color: rgba(43, 45, 66, 0.72);
    margin-bottom: 2rem;
}

/* Irregular Asymmetrical Image Showcase */
.exp-img-wrap {
    position: relative;
    padding: 2.2rem 2.2rem 2.2rem 1.4rem;
    max-width: 520px;
    margin: 0 auto;
}
.exp-img-backdrop {
    position: absolute;
    top: 0;
    right: 0;
    width: 96%;
    height: 96%;
    background: var(--exp-grad, linear-gradient(135deg, #0284c7 0%, #38bdf8 100%));
    clip-path: polygon(0% 5%, 95% 0%, 100% 92%, 5% 98%);
    transform: translate(20px, -18px) rotate(2.5deg);
    filter: drop-shadow(0 25px 40px var(--exp-glow, rgba(2, 132, 199, 0.28)));
    z-index: 1;
    transition: transform 0.6s var(--expo), filter 0.6s var(--expo);
}
.exp-img-box {
    position: relative;
    z-index: 2;
    overflow: hidden;
    background: var(--navy);
    width: 100%;
    min-height: 320px;
    aspect-ratio: 4 / 3;
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 32px), calc(100% - 32px) 100%, 0 100%, 0 20px);
    box-shadow: 0 24px 50px rgba(15, 23, 42, 0.18);
    transition: transform 0.6s var(--expo), box-shadow 0.6s var(--expo);
}
.exp-img-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: grayscale(15%) contrast(108%);
    transform: scale(1.02);
    transition: transform 0.8s var(--expo), filter 0.6s ease;
}
.exp-img-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.02) 0%, rgba(15, 23, 42, 0.35) 100%);
    pointer-events: none;
}
.exp-img-wrap:hover .exp-img-box {
    transform: translate(-6px, -4px) scale(1.01);
    box-shadow: 0 32px 60px rgba(15, 23, 42, 0.24);
}
.exp-img-wrap:hover .exp-img-backdrop {
    transform: translate(26px, -24px) rotate(4deg) scale(1.02);
}
.exp-img-wrap:hover .exp-img-photo {
    transform: scale(1.06);
    filter: grayscale(0%) contrast(110%);
}

/* 02 Capabilities 4-Column Unboxed Grid */
.exp-capabilities-section {
    padding: clamp(90px, 12vw, 140px) 0;
    background: var(--soft);
    border-top: 1px solid rgba(43, 45, 66, 0.07);
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}
.exp-pillar-card {
    background: var(--white);
    padding: 2.4rem 2rem;
    border-top: 2px solid rgba(43, 45, 66, 0.1);
    height: 100%;
    display: flex;
    flex-direction: column;
    transition: border-top-color 0.4s var(--expo), transform 0.4s var(--expo), box-shadow 0.4s var(--expo);
}
.exp-pillar-card:hover {
    border-top-color: var(--exp-accent, #0284c7);
    transform: translateY(-5px);
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.06);
}
.exp-pillar-num {
    font-family: var(--mono);
    font-size: 0.65rem;
    letter-spacing: 3px;
    color: var(--exp-accent, #0284c7);
    text-transform: uppercase;
    margin-bottom: 1.2rem;
}
.exp-pillar-title {
    font-size: 1.25rem;
    font-weight: 500;
    color: var(--navy);
    letter-spacing: -.02em;
    line-height: 1.28;
    margin-bottom: 1rem;
}
.exp-pillar-desc {
    font-size: 0.92rem;
    font-weight: 300;
    line-height: 1.75;
    color: rgba(43, 45, 66, 0.72);
    margin: 0;
}

/* 03 Stack & Technical Matrix */
.exp-stack-section {
    padding: clamp(90px, 12vw, 140px) 0;
    background: var(--white);
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}
.exp-stack-box {
    border-left: 2px solid var(--exp-accent, #0284c7);
    padding: 1.6rem 0 1.6rem 1.8rem;
    margin-bottom: 2rem;
}
.exp-stack-cat {
    font-family: var(--mono);
    font-size: 0.65rem;
    letter-spacing: 2.5px;
    color: var(--exp-accent, #0284c7);
    text-transform: uppercase;
    margin-bottom: 0.4rem;
}
.exp-stack-items {
    font-size: 1.05rem;
    font-weight: 400;
    color: var(--navy);
    line-height: 1.6;
}
.exp-stack-sub {
    font-size: 0.88rem;
    font-weight: 300;
    color: rgba(43, 45, 66, 0.6);
    margin-top: 0.3rem;
}

/* 04 Deliverables & Sovereign IP Checklist */
.exp-deliverables-section {
    padding: clamp(80px, 10vw, 120px) 0;
    background: var(--soft);
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}
.exp-deliv-item {
    display: flex;
    align-items: flex-start;
    gap: 1.2rem;
    margin-bottom: 2rem;
}
.exp-deliv-icon {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(43, 45, 66, 0.06);
    color: var(--exp-accent, #0284c7);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 0.8rem;
    font-weight: 700;
    margin-top: 2px;
}
.exp-deliv-title {
    font-size: 1.1rem;
    font-weight: 500;
    color: var(--navy);
    margin-bottom: 0.3rem;
}
.exp-deliv-desc {
    font-size: 0.92rem;
    font-weight: 300;
    line-height: 1.7;
    color: rgba(43, 45, 66, 0.7);
    margin: 0;
}

/* Editorial Block for WP Content */
.exp-wp-content {
    padding: clamp(60px, 8vw, 100px) 0;
    background: var(--white);
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}

/* ════════════════════════════════════════════════
   INDUSTRY SOLUTION PAGES — template-solution.php
   Scoped Themes: Automotive (Cobalt), Packaging (Amber), Process (Slate), etc.
════════════════════════════════════════════════ */

.sol-theme--auto,
.sol-theme--test-measurement {
    --sol-accent: #58af6c;
    --sol-accent-2: #11998e;
    --sol-grad: linear-gradient(135deg, #11998e 0%, #58af6c 100%);
    --sol-glow: rgba(88, 175, 108, 0.25);
    --exp-grad: linear-gradient(135deg, #11998e 0%, #58af6c 100%);
    --exp-glow: rgba(88, 175, 108, 0.28);
}

/* ════════════════════════════════════════════════
   PRODUCTION MONITORING & TRACEABILITY — CYBER CERULEAN & ELECTRIC CYAN
════════════════════════════════════════════════ */
.sol-theme--traceability,
.sol-theme--production-monitoring {
    --sol-accent: #0284c7;
    --sol-accent-2: #00d2ff;
    --sol-grad: linear-gradient(135deg, #0284c7 0%, #00d2ff 100%);
    --sol-glow: rgba(2, 132, 199, 0.22);
    --exp-grad: linear-gradient(135deg, #0284c7 0%, #00d2ff 100%);
    --exp-glow: rgba(2, 132, 199, 0.25);
    --green: #0284c7;
    --grad: linear-gradient(135deg, #0284c7 0%, #00d2ff 100%);
}

.sol-theme--traceability .tis-hero-sub,
.sol-theme--production-monitoring .tis-hero-sub {
    color: #0284c7;
}

.sol-theme--traceability .tis-hero-body,
.sol-theme--production-monitoring .tis-hero-body {
    border-left-color: #0284c7;
}

.sol-theme--traceability .tis-cap-card:hover,
.sol-theme--production-monitoring .tis-cap-card:hover {
    border-color: #0284c7;
    box-shadow: 0 16px 36px rgba(2, 132, 199, 0.08);
}

.sol-theme--traceability .tis-cap-icon,
.sol-theme--production-monitoring .tis-cap-icon {
    color: #0284c7;
}

.sol-theme--traceability .tis-app-card:hover,
.sol-theme--production-monitoring .tis-app-card:hover {
    border-left-color: #0284c7;
    box-shadow: 0 16px 36px rgba(2, 132, 199, 0.08);
}

.sol-theme--traceability .tis-app-icon-wrap,
.sol-theme--production-monitoring .tis-app-icon-wrap {
    background: rgba(2, 132, 199, 0.09);
    color: #0284c7;
}

.sol-theme--traceability .tis-app-card:hover .tis-app-icon-wrap,
.sol-theme--production-monitoring .tis-app-card:hover .tis-app-icon-wrap {
    background: linear-gradient(135deg, #0284c7 0%, #00d2ff 100%);
    color: #ffffff;
    box-shadow: 0 6px 18px rgba(2, 132, 199, 0.35);
}

.sol-theme--traceability .tis-cap-card:hover .tis-cap-idx,
.sol-theme--production-monitoring .tis-cap-card:hover .tis-cap-idx,
.sol-theme--traceability .tis-app-card:hover .tis-app-idx,
.sol-theme--production-monitoring .tis-app-card:hover .tis-app-idx {
    color: #0284c7;
}

.sol-theme--traceability .tis-project-card:hover,
.sol-theme--production-monitoring .tis-project-card:hover {
    border-top-color: #0284c7;
}

.sol-theme--traceability .tis-project-link,
.sol-theme--production-monitoring .tis-project-link {
    color: #0284c7;
}

/* Page Level Traceability Body Overrides */
body.page-traceability,
body.page-template-page-production-monitoring-traceability {
    --green: #0284c7 !important;
    --green2: #00d2ff !important;
    --grad: linear-gradient(135deg, #0284c7 0%, #00d2ff 100%) !important;
}

body.page-traceability .cur-dot,
body.page-template-page-production-monitoring-traceability .cur-dot {
    background: #0284c7 !important;
}

body.page-traceability .cur-ring,
body.page-template-page-production-monitoring-traceability .cur-ring {
    border-color: rgba(2, 132, 199, 0.45) !important;
}

body.page-traceability .cur-ring.hov,
body.page-template-page-production-monitoring-traceability .cur-ring.hov {
    border-color: #0284c7 !important;
}

body.page-traceability .scroll-progress,
body.page-template-page-production-monitoring-traceability .scroll-progress {
    background: linear-gradient(135deg, #0284c7 0%, #00d2ff 100%) !important;
}

body.page-traceability .pulse-dot,
body.page-template-page-production-monitoring-traceability .pulse-dot {
    background: #0284c7 !important;
    box-shadow: 0 0 0 0 rgba(2, 132, 199, 0.6) !important;
    animation: pmt-pulse-beacon 2.5s infinite !important;
}

@keyframes pmt-pulse-beacon {
    0%   { box-shadow: 0 0 0 0 rgba(2, 132, 199, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(2, 132, 199, 0); }
    100% { box-shadow: 0 0 0 0 rgba(2, 132, 199, 0); }
}

/* ════════════════════════════════════════════════
   ENVIRONMENTAL & GAS INSTRUMENTATION — SAFETY FIELD FLAME (#ea580c -> #fb923c)
════════════════════════════════════════════════ */
.sol-theme--environmental,
.sol-theme--gas-instrumentation {
    --sol-accent: #ea580c;
    --sol-accent-2: #fb923c;
    --sol-grad: linear-gradient(135deg, #ea580c 0%, #fb923c 100%);
    --sol-glow: rgba(234, 88, 12, 0.22);
    --exp-grad: linear-gradient(135deg, #ea580c 0%, #fb923c 100%);
    --exp-glow: rgba(234, 88, 12, 0.25);
    --green: #ea580c;
    --grad: linear-gradient(135deg, #ea580c 0%, #fb923c 100%);
}

.sol-theme--environmental .tis-hero-sub,
.sol-theme--gas-instrumentation .tis-hero-sub {
    color: #ea580c;
}

.sol-theme--environmental .tis-hero-body,
.sol-theme--gas-instrumentation .tis-hero-body {
    border-left-color: #ea580c;
}

.sol-theme--environmental .tis-cap-card:hover,
.sol-theme--gas-instrumentation .tis-cap-card:hover {
    border-color: #ea580c;
    box-shadow: 0 16px 36px rgba(234, 88, 12, 0.08);
}

.sol-theme--environmental .tis-cap-icon,
.sol-theme--gas-instrumentation .tis-cap-icon {
    color: #ea580c;
}

.sol-theme--environmental .tis-app-card:hover,
.sol-theme--gas-instrumentation .tis-app-card:hover {
    border-left-color: #ea580c;
    box-shadow: 0 16px 36px rgba(234, 88, 12, 0.08);
}

.sol-theme--environmental .tis-app-icon-wrap,
.sol-theme--gas-instrumentation .tis-app-icon-wrap {
    background: rgba(234, 88, 12, 0.09);
    color: #ea580c;
}

.sol-theme--environmental .tis-app-card:hover .tis-app-icon-wrap,
.sol-theme--gas-instrumentation .tis-app-card:hover .tis-app-icon-wrap {
    background: linear-gradient(135deg, #ea580c 0%, #fb923c 100%);
    color: #ffffff;
    box-shadow: 0 6px 18px rgba(234, 88, 12, 0.35);
}

.sol-theme--environmental .tis-cap-card:hover .tis-cap-idx,
.sol-theme--gas-instrumentation .tis-cap-card:hover .tis-cap-idx,
.sol-theme--environmental .tis-app-card:hover .tis-app-idx,
.sol-theme--gas-instrumentation .tis-app-card:hover .tis-app-idx {
    color: #ea580c;
}

.sol-theme--environmental .tis-project-card:hover,
.sol-theme--gas-instrumentation .tis-project-card:hover {
    border-top-color: #ea580c;
}

.sol-theme--environmental .tis-project-link,
.sol-theme--gas-instrumentation .tis-project-link {
    color: #ea580c;
}

/* Page Level Environmental Body Overrides */
body.page-environmental,
body.page-template-page-environmental-gas-instrumentation {
    --green: #ea580c !important;
    --green2: #fb923c !important;
    --grad: linear-gradient(135deg, #ea580c 0%, #fb923c 100%) !important;
}

body.page-environmental .cur-dot,
body.page-template-page-environmental-gas-instrumentation .cur-dot {
    background: #ea580c !important;
}

body.page-environmental .cur-ring,
body.page-template-page-environmental-gas-instrumentation .cur-ring {
    border-color: rgba(234, 88, 12, 0.45) !important;
}

body.page-environmental .cur-ring.hov,
body.page-template-page-environmental-gas-instrumentation .cur-ring.hov {
    border-color: #ea580c !important;
}

body.page-environmental .scroll-progress,
body.page-template-page-environmental-gas-instrumentation .scroll-progress {
    background: linear-gradient(135deg, #ea580c 0%, #fb923c 100%) !important;
}

body.page-environmental .pulse-dot,
body.page-template-page-environmental-gas-instrumentation .pulse-dot {
    background: #ea580c !important;
    box-shadow: 0 0 0 0 rgba(234, 88, 12, 0.6) !important;
    animation: env-pulse-beacon 2.5s infinite !important;
}

@keyframes env-pulse-beacon {
    0%   { box-shadow: 0 0 0 0 rgba(234, 88, 12, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(234, 88, 12, 0); }
    100% { box-shadow: 0 0 0 0 rgba(234, 88, 12, 0); }
}

/* ════════════════════════════════════════════════
   DATA ACQUISITION, LOGGERS & TELEMETRY — HIGH-FREQUENCY VIOLET (#7c3aed -> #a855f7)
════════════════════════════════════════════════ */
.sol-theme--daq,
.sol-theme--telemetry {
    --sol-accent: #7c3aed;
    --sol-accent-2: #a855f7;
    --sol-grad: linear-gradient(135deg, #7c3aed 0%, #a855f7 100%);
    --sol-glow: rgba(124, 58, 237, 0.22);
    --exp-grad: linear-gradient(135deg, #7c3aed 0%, #a855f7 100%);
    --exp-glow: rgba(124, 58, 237, 0.25);
    --green: #7c3aed;
    --grad: linear-gradient(135deg, #7c3aed 0%, #a855f7 100%);
}

.sol-theme--daq .tis-hero-sub,
.sol-theme--telemetry .tis-hero-sub {
    color: #7c3aed;
}

.sol-theme--daq .tis-hero-body,
.sol-theme--telemetry .tis-hero-body {
    border-left-color: #7c3aed;
}

.sol-theme--daq .tis-cap-card:hover,
.sol-theme--telemetry .tis-cap-card:hover {
    border-color: #7c3aed;
    box-shadow: 0 16px 36px rgba(124, 58, 237, 0.08);
}

.sol-theme--daq .tis-cap-icon,
.sol-theme--telemetry .tis-cap-icon {
    color: #7c3aed;
}

.sol-theme--daq .tis-app-card:hover,
.sol-theme--telemetry .tis-app-card:hover {
    border-left-color: #7c3aed;
    box-shadow: 0 16px 36px rgba(124, 58, 237, 0.08);
}

.sol-theme--daq .tis-app-icon-wrap,
.sol-theme--telemetry .tis-app-icon-wrap {
    background: rgba(124, 58, 237, 0.09);
    color: #7c3aed;
}

.sol-theme--daq .tis-app-card:hover .tis-app-icon-wrap,
.sol-theme--telemetry .tis-app-card:hover .tis-app-icon-wrap {
    background: linear-gradient(135deg, #7c3aed 0%, #a855f7 100%);
    color: #ffffff;
    box-shadow: 0 6px 18px rgba(124, 58, 237, 0.35);
}

.sol-theme--daq .tis-cap-card:hover .tis-cap-idx,
.sol-theme--telemetry .tis-cap-card:hover .tis-cap-idx,
.sol-theme--daq .tis-app-card:hover .tis-app-idx,
.sol-theme--telemetry .tis-app-card:hover .tis-app-idx {
    color: #7c3aed;
}

.sol-theme--daq .tis-project-card:hover,
.sol-theme--telemetry .tis-project-card:hover {
    border-top-color: #7c3aed;
}

.sol-theme--daq .tis-project-link,
.sol-theme--telemetry .tis-project-link {
    color: #7c3aed;
}

/* Page Level Telemetry Body Overrides */
body.page-telemetry,
body.page-template-page-data-acquisition-loggers-telemetry {
    --green: #7c3aed !important;
    --green2: #a855f7 !important;
    --grad: linear-gradient(135deg, #7c3aed 0%, #a855f7 100%) !important;
}

body.page-telemetry .cur-dot,
body.page-template-page-data-acquisition-loggers-telemetry .cur-dot {
    background: #7c3aed !important;
}

body.page-telemetry .cur-ring,
body.page-template-page-data-acquisition-loggers-telemetry .cur-ring {
    border-color: rgba(124, 58, 237, 0.45) !important;
}

body.page-telemetry .cur-ring.hov,
body.page-template-page-data-acquisition-loggers-telemetry .cur-ring.hov {
    border-color: #7c3aed !important;
}

body.page-telemetry .scroll-progress,
body.page-template-page-data-acquisition-loggers-telemetry .scroll-progress {
    background: linear-gradient(135deg, #7c3aed 0%, #a855f7 100%) !important;
}

body.page-telemetry .pulse-dot,
body.page-template-page-data-acquisition-loggers-telemetry .pulse-dot {
    background: #7c3aed !important;
    box-shadow: 0 0 0 0 rgba(124, 58, 237, 0.6) !important;
    animation: daq-pulse-beacon 2.5s infinite !important;
}

@keyframes daq-pulse-beacon {
    0%   { box-shadow: 0 0 0 0 rgba(124, 58, 237, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(124, 58, 237, 0); }
    100% { box-shadow: 0 0 0 0 rgba(124, 58, 237, 0); }
}

/* ════════════════════════════════════════════════
   EDGE VISION & ACCESS SYSTEMS — NEURAL CYBER RUBY (#e11d48 -> #fb7185)
════════════════════════════════════════════════ */
.sol-theme--vision,
.sol-theme--access {
    --sol-accent: #e11d48;
    --sol-accent-2: #fb7185;
    --sol-grad: linear-gradient(135deg, #e11d48 0%, #fb7185 100%);
    --sol-glow: rgba(225, 29, 72, 0.22);
    --exp-grad: linear-gradient(135deg, #e11d48 0%, #fb7185 100%);
    --exp-glow: rgba(225, 29, 72, 0.25);
    --green: #e11d48;
    --grad: linear-gradient(135deg, #e11d48 0%, #fb7185 100%);
}

.sol-theme--vision .tis-hero-sub,
.sol-theme--access .tis-hero-sub {
    color: #e11d48;
}

.sol-theme--vision .tis-hero-body,
.sol-theme--access .tis-hero-body {
    border-left-color: #e11d48;
}

.sol-theme--vision .tis-cap-card:hover,
.sol-theme--access .tis-cap-card:hover {
    border-color: #e11d48;
    box-shadow: 0 16px 36px rgba(225, 29, 72, 0.08);
}

.sol-theme--vision .tis-cap-icon,
.sol-theme--access .tis-cap-icon {
    color: #e11d48;
}

.sol-theme--vision .tis-app-card:hover,
.sol-theme--access .tis-app-card:hover {
    border-left-color: #e11d48;
    box-shadow: 0 16px 36px rgba(225, 29, 72, 0.08);
}

.sol-theme--vision .tis-app-icon-wrap,
.sol-theme--access .tis-app-icon-wrap {
    background: rgba(225, 29, 72, 0.09);
    color: #e11d48;
}

.sol-theme--vision .tis-app-card:hover .tis-app-icon-wrap,
.sol-theme--access .tis-app-card:hover .tis-app-icon-wrap {
    background: linear-gradient(135deg, #e11d48 0%, #fb7185 100%);
    color: #ffffff;
    box-shadow: 0 6px 18px rgba(225, 29, 72, 0.35);
}

.sol-theme--vision .tis-cap-card:hover .tis-cap-idx,
.sol-theme--access .tis-cap-card:hover .tis-cap-idx,
.sol-theme--vision .tis-app-card:hover .tis-app-idx,
.sol-theme--access .tis-app-card:hover .tis-app-idx {
    color: #e11d48;
}

.sol-theme--vision .tis-project-card:hover,
.sol-theme--access .tis-project-card:hover {
    border-top-color: #e11d48;
}

.sol-theme--vision .tis-project-link,
.sol-theme--access .tis-project-link {
    color: #e11d48;
}

/* Page Level Vision Body Overrides */
body.page-vision,
body.page-template-page-edge-vision-access-systems {
    --green: #e11d48 !important;
    --green2: #fb7185 !important;
    --grad: linear-gradient(135deg, #e11d48 0%, #fb7185 100%) !important;
}

body.page-vision .cur-dot,
body.page-template-page-edge-vision-access-systems .cur-dot {
    background: #e11d48 !important;
}

body.page-vision .cur-ring,
body.page-template-page-edge-vision-access-systems .cur-ring {
    border-color: rgba(225, 29, 72, 0.45) !important;
}

body.page-vision .cur-ring.hov,
body.page-template-page-edge-vision-access-systems .cur-ring.hov {
    border-color: #e11d48 !important;
}

body.page-vision .scroll-progress,
body.page-template-page-edge-vision-access-systems .scroll-progress {
    background: linear-gradient(135deg, #e11d48 0%, #fb7185 100%) !important;
}

body.page-vision .pulse-dot,
body.page-template-page-edge-vision-access-systems .pulse-dot {
    background: #e11d48 !important;
    box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.6) !important;
    animation: vision-pulse-beacon 2.5s infinite !important;
}

@keyframes vision-pulse-beacon {
    0%   { box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(225, 29, 72, 0); }
    100% { box-shadow: 0 0 0 0 rgba(225, 29, 72, 0); }
}

/* ════════════════════════════════════════════════
   EMBEDDED HARDWARE & FIRMWARE — CIRCUIT AMBER & LASER GOLD
════════════════════════════════════════════════ */
.sol-theme--embedded-hw,
.exp-theme--embedded-hw {
    --sol-accent: #d97706;
    --sol-accent-2: #f59e0b;
    --sol-grad: linear-gradient(135deg, #d97706 0%, #f59e0b 100%);
    --sol-glow: rgba(217, 119, 6, 0.25);
    --exp-grad: linear-gradient(135deg, #d97706 0%, #f59e0b 100%);
    --exp-glow: rgba(217, 119, 6, 0.28);
    --green: #d97706;
    --grad: linear-gradient(135deg, #d97706 0%, #f59e0b 100%);
}

.sol-theme--embedded-hw .tis-hero-sub,
.exp-theme--embedded-hw .tis-hero-sub {
    color: #d97706;
}

.sol-theme--embedded-hw .tis-hero-body,
.exp-theme--embedded-hw .tis-hero-body {
    border-left-color: #d97706;
}

.sol-theme--embedded-hw .tis-cap-card:hover,
.exp-theme--embedded-hw .tis-cap-card:hover {
    border-color: #d97706;
    box-shadow: 0 16px 36px rgba(217, 119, 6, 0.1);
}

.sol-theme--embedded-hw .tis-cap-icon,
.exp-theme--embedded-hw .tis-cap-icon {
    color: #d97706;
}

.sol-theme--embedded-hw .tis-app-card:hover,
.exp-theme--embedded-hw .tis-app-card:hover {
    border-left-color: #d97706;
    box-shadow: 0 16px 36px rgba(217, 119, 6, 0.1);
}

.sol-theme--embedded-hw .tis-app-icon-wrap,
.exp-theme--embedded-hw .tis-app-icon-wrap {
    background: rgba(217, 119, 6, 0.09);
    color: #d97706;
}

.sol-theme--embedded-hw .tis-app-card:hover .tis-app-icon-wrap,
.exp-theme--embedded-hw .tis-app-card:hover .tis-app-icon-wrap {
    background: linear-gradient(135deg, #d97706 0%, #f59e0b 100%);
    color: #ffffff;
    box-shadow: 0 6px 18px rgba(217, 119, 6, 0.35);
}

.sol-theme--embedded-hw .tis-cap-card:hover .tis-cap-idx,
.exp-theme--embedded-hw .tis-cap-card:hover .tis-cap-idx,
.sol-theme--embedded-hw .tis-app-card:hover .tis-app-idx,
.exp-theme--embedded-hw .tis-app-card:hover .tis-app-idx {
    color: #d97706;
}

/* Page Level Embedded Hardware Body Overrides */
body.page-embedded-hw,
body.page-template-page-embedded-hardware-firmware {
    --green: #d97706 !important;
    --green2: #f59e0b !important;
    --grad: linear-gradient(135deg, #d97706 0%, #f59e0b 100%) !important;
}

body.page-embedded-hw .cur-dot,
body.page-template-page-embedded-hardware-firmware .cur-dot {
    background: #d97706 !important;
}

body.page-embedded-hw .cur-ring,
body.page-template-page-embedded-hardware-firmware .cur-ring {
    border-color: rgba(217, 119, 6, 0.45) !important;
}

body.page-embedded-hw .cur-ring.hov,
body.page-template-page-embedded-hardware-firmware .cur-ring.hov {
    border-color: #d97706 !important;
}

body.page-embedded-hw .scroll-progress,
body.page-template-page-embedded-hardware-firmware .scroll-progress {
    background: linear-gradient(135deg, #d97706 0%, #f59e0b 100%) !important;
}

body.page-embedded-hw .pulse-dot,
body.page-template-page-embedded-hardware-firmware .pulse-dot {
    background: #d97706 !important;
    box-shadow: 0 0 0 0 rgba(217, 119, 6, 0.6) !important;
    animation: embedded-pulse-beacon 2.5s infinite !important;
}

@keyframes embedded-pulse-beacon {
    0%   { box-shadow: 0 0 0 0 rgba(217, 119, 6, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(217, 119, 6, 0); }
    100% { box-shadow: 0 0 0 0 rgba(217, 119, 6, 0); }
}

/* ════════════════════════════════════════════════
   MACHINE CONTROL, DAQ & HMIS — ELECTRIC COBALT & PRECISION CYAN
   Palette: #1d4ed8 (Deep Industrial Cobalt) & #06b6d4 (Precision Cyan)
════════════════════════════════════════════════ */
.sol-theme--machine-control,
.exp-theme--machine-control {
    --sol-accent: #1d4ed8;
    --sol-accent-2: #06b6d4;
    --sol-grad: linear-gradient(135deg, #1d4ed8 0%, #06b6d4 100%);
    --sol-glow: rgba(29, 78, 216, 0.28);
    --exp-grad: linear-gradient(135deg, #1d4ed8 0%, #06b6d4 100%);
    --exp-glow: rgba(29, 78, 216, 0.28);
    --green: #1d4ed8;
    --green2: #06b6d4;
    --grad: linear-gradient(135deg, #1d4ed8 0%, #06b6d4 100%);
}

.sol-theme--machine-control .tis-hero-sub,
.exp-theme--machine-control .tis-hero-sub {
    color: #1d4ed8;
}

.sol-theme--machine-control .tis-hero-body,
.exp-theme--machine-control .tis-hero-body {
    border-left-color: #1d4ed8;
}

.sol-theme--machine-control .tis-cap-card:hover,
.exp-theme--machine-control .tis-cap-card:hover {
    border-color: #1d4ed8;
    box-shadow: 0 16px 36px rgba(29, 78, 216, 0.12);
}

.sol-theme--machine-control .tis-cap-icon,
.exp-theme--machine-control .tis-cap-icon {
    color: #1d4ed8;
}

.sol-theme--machine-control .tis-app-card:hover,
.exp-theme--machine-control .tis-app-card:hover {
    border-left-color: #1d4ed8;
    box-shadow: 0 16px 36px rgba(29, 78, 216, 0.12);
}

.sol-theme--machine-control .tis-app-icon-wrap,
.exp-theme--machine-control .tis-app-icon-wrap {
    background: rgba(29, 78, 216, 0.09);
    color: #1d4ed8;
}

.sol-theme--machine-control .tis-app-card:hover .tis-app-icon-wrap,
.exp-theme--machine-control .tis-app-card:hover .tis-app-icon-wrap {
    background: linear-gradient(135deg, #1d4ed8 0%, #06b6d4 100%);
    color: #ffffff;
    box-shadow: 0 6px 18px rgba(29, 78, 216, 0.35);
}

.sol-theme--machine-control .tis-cap-card:hover .tis-cap-idx,
.exp-theme--machine-control .tis-cap-card:hover .tis-cap-idx,
.sol-theme--machine-control .tis-app-card:hover .tis-app-idx,
.exp-theme--machine-control .tis-app-card:hover .tis-app-idx {
    color: #1d4ed8;
}

.sol-theme--machine-control .exp-img-backdrop,
.exp-theme--machine-control .exp-img-backdrop {
    background: linear-gradient(135deg, rgba(29, 78, 216, 0.95) 0%, rgba(6, 182, 212, 0.8) 55%, rgba(14, 165, 233, 0.45) 100%);
    filter: drop-shadow(0 25px 40px rgba(29, 78, 216, 0.28));
}

.sol-theme--machine-control .tis-tool-card:hover,
.exp-theme--machine-control .tis-tool-card:hover {
    border-color: rgba(29, 78, 216, 0.35);
    box-shadow: 0 14px 30px rgba(29, 78, 216, 0.08);
}

.sol-theme--machine-control .tis-tool-card:hover::before,
.exp-theme--machine-control .tis-tool-card:hover::before {
    background: #1d4ed8;
}

.sol-theme--machine-control .tis-tool-label,
.exp-theme--machine-control .tis-tool-label {
    color: #1d4ed8;
}

.sol-theme--machine-control .tis-tool-card:hover .tis-tool-icon,
.exp-theme--machine-control .tis-tool-card:hover .tis-tool-icon {
    color: #1d4ed8;
}

.sol-theme--machine-control .tis-proven-card:hover,
.exp-theme--machine-control .tis-proven-card:hover {
    border-color: #1d4ed8;
    box-shadow: 0 16px 36px rgba(29, 78, 216, 0.12);
}

.sol-theme--machine-control .tis-proven-card:hover .tis-proven-num,
.exp-theme--machine-control .tis-proven-card:hover .tis-proven-num {
    color: #1d4ed8;
}

.sol-theme--machine-control .tis-proven-icon,
.exp-theme--machine-control .tis-proven-icon {
    background: rgba(29, 78, 216, 0.08);
    color: #1d4ed8;
}

.sol-theme--machine-control .tis-proven-card:hover .tis-proven-icon,
.exp-theme--machine-control .tis-proven-card:hover .tis-proven-icon {
    background: #1d4ed8;
    color: #ffffff;
}

.sol-theme--machine-control .tis-proven-badge,
.exp-theme--machine-control .tis-proven-badge {
    color: #1d4ed8;
}

/* Page Level Machine Control Body Overrides */
body.page-machine-control,
body.page-template-page-machine-control-daq-hmis {
    --green: #1d4ed8 !important;
    --green2: #06b6d4 !important;
    --grad: linear-gradient(135deg, #1d4ed8 0%, #06b6d4 100%) !important;
}

body.page-machine-control .cur-dot,
body.page-template-page-machine-control-daq-hmis .cur-dot {
    background: #1d4ed8 !important;
}

body.page-machine-control .cur-ring,
body.page-template-page-machine-control-daq-hmis .cur-ring {
    border-color: rgba(29, 78, 216, 0.45) !important;
}

body.page-machine-control .cur-ring.hov,
body.page-template-page-machine-control-daq-hmis .cur-ring.hov {
    border-color: #1d4ed8 !important;
}

body.page-machine-control .scroll-progress,
body.page-template-page-machine-control-daq-hmis .scroll-progress {
    background: linear-gradient(135deg, #1d4ed8 0%, #06b6d4 100%) !important;
}

body.page-machine-control .pulse-dot,
body.page-template-page-machine-control-daq-hmis .pulse-dot {
    background: #1d4ed8 !important;
    box-shadow: 0 0 0 0 rgba(29, 78, 216, 0.6) !important;
    animation: machine-pulse-beacon 2.5s infinite !important;
}

@keyframes machine-pulse-beacon {
    0%   { box-shadow: 0 0 0 0 rgba(29, 78, 216, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(29, 78, 216, 0); }
    100% { box-shadow: 0 0 0 0 rgba(29, 78, 216, 0); }
}

/* ════════════════════════════════════════════════
   INDUSTRIAL COMPUTER VISION & EDGE AI — THEME OVERRIDES
   Scoped Palette: Cyber Neon Jade & Tensor Mint
   Palette: #059669 -> #00dc82 -> #00f0ff
════════════════════════════════════════════════ */
.sol-theme--edge-ai,
.exp-theme--edge-ai {
    --sol-accent: #059669;
    --sol-accent-2: #00dc82;
    --sol-grad: linear-gradient(135deg, #059669 0%, #00dc82 60%, #00f0ff 100%);
    --sol-glow: rgba(0, 220, 130, 0.28);
    --exp-grad: linear-gradient(135deg, #059669 0%, #00dc82 60%, #00f0ff 100%);
    --exp-glow: rgba(0, 220, 130, 0.28);
    --green: #059669;
    --green2: #00dc82;
    --grad: linear-gradient(135deg, #059669 0%, #00dc82 60%, #00f0ff 100%);
}

.sol-theme--edge-ai .tis-hero-sub,
.exp-theme--edge-ai .tis-hero-sub {
    color: #059669;
}

.sol-theme--edge-ai .tis-hero-body,
.exp-theme--edge-ai .tis-hero-body {
    border-left-color: #059669;
}

.sol-theme--edge-ai .tis-cap-card:hover,
.exp-theme--edge-ai .tis-cap-card:hover {
    border-color: #059669;
    box-shadow: 0 16px 36px rgba(0, 220, 130, 0.16);
}

.sol-theme--edge-ai .tis-cap-icon,
.exp-theme--edge-ai .tis-cap-icon {
    color: #059669;
}

.sol-theme--edge-ai .tis-app-card:hover,
.exp-theme--edge-ai .tis-app-card:hover {
    border-left-color: #059669;
    box-shadow: 0 16px 36px rgba(0, 220, 130, 0.16);
}

.sol-theme--edge-ai .tis-app-icon-wrap,
.exp-theme--edge-ai .tis-app-icon-wrap {
    background: rgba(0, 220, 130, 0.12);
    color: #059669;
}

.sol-theme--edge-ai .tis-app-card:hover .tis-app-icon-wrap,
.exp-theme--edge-ai .tis-app-card:hover .tis-app-icon-wrap {
    background: linear-gradient(135deg, #059669 0%, #00dc82 100%);
    color: #ffffff;
    box-shadow: 0 6px 18px rgba(0, 220, 130, 0.4);
}

.sol-theme--edge-ai .tis-cap-card:hover .tis-cap-idx,
.exp-theme--edge-ai .tis-cap-card:hover .tis-cap-idx,
.sol-theme--edge-ai .tis-app-card:hover .tis-app-idx,
.exp-theme--edge-ai .tis-app-card:hover .tis-app-idx {
    color: #059669;
}

.sol-theme--edge-ai .exp-img-backdrop,
.exp-theme--edge-ai .exp-img-backdrop {
    background: linear-gradient(135deg, rgba(5, 150, 105, 0.95) 0%, rgba(0, 220, 130, 0.8) 55%, rgba(6, 182, 212, 0.45) 100%);
    filter: drop-shadow(0 25px 40px rgba(0, 220, 130, 0.28));
}

.sol-theme--edge-ai .tis-tool-card:hover,
.exp-theme--edge-ai .tis-tool-card:hover {
    border-color: rgba(5, 150, 105, 0.35);
    box-shadow: 0 14px 30px rgba(0, 220, 130, 0.12);
}

.sol-theme--edge-ai .tis-tool-card:hover::before,
.exp-theme--edge-ai .tis-tool-card:hover::before {
    background: #059669;
}

.sol-theme--edge-ai .tis-tool-label,
.exp-theme--edge-ai .tis-tool-label {
    color: #059669;
}

.sol-theme--edge-ai .tis-tool-card:hover .tis-tool-icon,
.exp-theme--edge-ai .tis-tool-card:hover .tis-tool-icon {
    color: #059669;
}

.sol-theme--edge-ai .tis-proven-card:hover,
.exp-theme--edge-ai .tis-proven-card:hover {
    border-color: #059669;
    box-shadow: 0 16px 36px rgba(0, 220, 130, 0.16);
}

.sol-theme--edge-ai .tis-proven-card:hover .tis-proven-num,
.exp-theme--edge-ai .tis-proven-card:hover .tis-proven-num {
    color: #059669;
}

.sol-theme--edge-ai .tis-proven-icon,
.exp-theme--edge-ai .tis-proven-icon {
    background: rgba(0, 220, 130, 0.12);
    color: #059669;
}

.sol-theme--edge-ai .tis-proven-card:hover .tis-proven-icon,
.exp-theme--edge-ai .tis-proven-card:hover .tis-proven-icon {
    background: linear-gradient(135deg, #059669 0%, #00dc82 100%);
    color: #ffffff;
}

.sol-theme--edge-ai .tis-proven-badge,
.exp-theme--edge-ai .tis-proven-badge {
    color: #059669;
}

.sol-theme--edge-ai .hero-eyebrow .pulse-dot,
.exp-theme--edge-ai .hero-eyebrow .pulse-dot {
    background: #00dc82;
    box-shadow: 0 0 0 0 rgba(0, 220, 130, 0.6);
    animation: edge-ai-pulse-beacon 2.5s infinite;
}

.sol-theme--edge-ai .hero-eyebrow .eyebrow-txt,
.exp-theme--edge-ai .hero-eyebrow .eyebrow-txt {
    color: #059669;
}

.sol-theme--edge-ai .section-tag,
.exp-theme--edge-ai .section-tag {
    color: #059669;
}

.sol-theme--edge-ai .grad-text,
.exp-theme--edge-ai .grad-text {
    background: linear-gradient(135deg, #059669 0%, #00dc82 60%, #00f0ff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.sol-theme--edge-ai .btn-nb-primary,
.exp-theme--edge-ai .btn-nb-primary {
    background: linear-gradient(135deg, #059669 0%, #00dc82 100%);
    color: #ffffff;
    box-shadow: 0 8px 24px rgba(0, 220, 130, 0.35);
}

.sol-theme--edge-ai .btn-nb-primary:hover,
.exp-theme--edge-ai .btn-nb-primary:hover {
    background: linear-gradient(135deg, #047857 0%, #059669 100%);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(0, 220, 130, 0.45);
}

/* Page Level Edge AI Body Overrides */
body.page-edge-ai,
body.page-template-page-industrial-computer-vision-edge-ai {
    --green: #059669 !important;
    --green2: #00dc82 !important;
    --grad: linear-gradient(135deg, #059669 0%, #00dc82 60%, #00f0ff 100%) !important;
}

body.page-edge-ai .cur-dot,
body.page-template-page-industrial-computer-vision-edge-ai .cur-dot {
    background: #059669 !important;
}

body.page-edge-ai .cur-ring,
body.page-template-page-industrial-computer-vision-edge-ai .cur-ring {
    border-color: rgba(0, 220, 130, 0.5) !important;
}

body.page-edge-ai .cur-ring.hov,
body.page-template-page-industrial-computer-vision-edge-ai .cur-ring.hov {
    border-color: #059669 !important;
}

body.page-edge-ai .scroll-progress,
body.page-template-page-industrial-computer-vision-edge-ai .scroll-progress {
    background: linear-gradient(135deg, #059669 0%, #00dc82 60%, #00f0ff 100%) !important;
}

body.page-edge-ai .pulse-dot,
body.page-template-page-industrial-computer-vision-edge-ai .pulse-dot {
    background: #00dc82 !important;
    box-shadow: 0 0 0 0 rgba(0, 220, 130, 0.6) !important;
    animation: edge-ai-pulse-beacon 2.5s infinite !important;
}

@keyframes edge-ai-pulse-beacon {
    0%   { box-shadow: 0 0 0 0 rgba(0, 220, 130, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(0, 220, 130, 0); }
    100% { box-shadow: 0 0 0 0 rgba(0, 220, 130, 0); }
}

/* ════════════════════════════════════════════════
   OPERATIONAL AI & INDUSTRIAL TELEMETRY — THEME OVERRIDES
   Scoped Palette: Quantum Ultraviolet & Cyber Magenta
   Palette: #7e22ce -> #a855f7 -> #ec4899
════════════════════════════════════════════════ */
.sol-theme--operational-ai,
.exp-theme--operational-ai {
    --sol-accent: #7e22ce;
    --sol-accent-2: #ec4899;
    --sol-grad: linear-gradient(135deg, #7e22ce 0%, #a855f7 50%, #ec4899 100%);
    --sol-glow: rgba(168, 85, 247, 0.28);
    --exp-grad: linear-gradient(135deg, #7e22ce 0%, #a855f7 50%, #ec4899 100%);
    --exp-glow: rgba(168, 85, 247, 0.28);
    --green: #7e22ce;
    --green2: #ec4899;
    --grad: linear-gradient(135deg, #7e22ce 0%, #a855f7 50%, #ec4899 100%);
}

.sol-theme--operational-ai .tis-hero-sub,
.exp-theme--operational-ai .tis-hero-sub {
    color: #7e22ce;
}

.sol-theme--operational-ai .tis-hero-body,
.exp-theme--operational-ai .tis-hero-body {
    border-left-color: #7e22ce;
}

.sol-theme--operational-ai .tis-cap-card:hover,
.exp-theme--operational-ai .tis-cap-card:hover {
    border-color: #7e22ce;
    box-shadow: 0 16px 36px rgba(168, 85, 247, 0.16);
}

.sol-theme--operational-ai .tis-cap-icon,
.exp-theme--operational-ai .tis-cap-icon {
    color: #7e22ce;
}

.sol-theme--operational-ai .tis-app-card:hover,
.exp-theme--operational-ai .tis-app-card:hover {
    border-left-color: #7e22ce;
    box-shadow: 0 16px 36px rgba(168, 85, 247, 0.16);
}

.sol-theme--operational-ai .tis-app-icon-wrap,
.exp-theme--operational-ai .tis-app-icon-wrap {
    background: rgba(168, 85, 247, 0.12);
    color: #7e22ce;
}

.sol-theme--operational-ai .tis-app-card:hover .tis-app-icon-wrap,
.exp-theme--operational-ai .tis-app-card:hover .tis-app-icon-wrap {
    background: linear-gradient(135deg, #7e22ce 0%, #ec4899 100%);
    color: #ffffff;
    box-shadow: 0 6px 18px rgba(236, 72, 153, 0.4);
}

.sol-theme--operational-ai .tis-cap-card:hover .tis-cap-idx,
.exp-theme--operational-ai .tis-cap-card:hover .tis-cap-idx,
.sol-theme--operational-ai .tis-app-card:hover .tis-app-idx,
.exp-theme--operational-ai .tis-app-card:hover .tis-app-idx {
    color: #7e22ce;
}

.sol-theme--operational-ai .exp-img-backdrop,
.exp-theme--operational-ai .exp-img-backdrop {
    background: linear-gradient(135deg, rgba(126, 34, 206, 0.95) 0%, rgba(168, 85, 247, 0.8) 55%, rgba(236, 72, 153, 0.45) 100%);
    filter: drop-shadow(0 25px 40px rgba(168, 85, 247, 0.28));
}

.sol-theme--operational-ai .tis-tool-card:hover,
.exp-theme--operational-ai .tis-tool-card:hover {
    border-color: rgba(126, 34, 206, 0.35);
    box-shadow: 0 14px 30px rgba(168, 85, 247, 0.12);
}

.sol-theme--operational-ai .tis-tool-card:hover::before,
.exp-theme--operational-ai .tis-tool-card:hover::before {
    background: #7e22ce;
}

.sol-theme--operational-ai .tis-tool-label,
.exp-theme--operational-ai .tis-tool-label {
    color: #7e22ce;
}

.sol-theme--operational-ai .tis-tool-card:hover .tis-tool-icon,
.exp-theme--operational-ai .tis-tool-card:hover .tis-tool-icon {
    color: #7e22ce;
}

.sol-theme--operational-ai .tis-proven-card:hover,
.exp-theme--operational-ai .tis-proven-card:hover {
    border-color: #7e22ce;
    box-shadow: 0 16px 36px rgba(168, 85, 247, 0.16);
}

.sol-theme--operational-ai .tis-proven-card:hover .tis-proven-num,
.exp-theme--operational-ai .tis-proven-card:hover .tis-proven-num {
    color: #7e22ce;
}

.sol-theme--operational-ai .tis-proven-icon,
.exp-theme--operational-ai .tis-proven-icon {
    background: rgba(168, 85, 247, 0.12);
    color: #7e22ce;
}

.sol-theme--operational-ai .tis-proven-card:hover .tis-proven-icon,
.exp-theme--operational-ai .tis-proven-card:hover .tis-proven-icon {
    background: linear-gradient(135deg, #7e22ce 0%, #ec4899 100%);
    color: #ffffff;
}

.sol-theme--operational-ai .tis-proven-badge,
.exp-theme--operational-ai .tis-proven-badge {
    color: #7e22ce;
}

.sol-theme--operational-ai .hero-eyebrow .pulse-dot,
.exp-theme--operational-ai .hero-eyebrow .pulse-dot {
    background: #d946ef;
    box-shadow: 0 0 0 0 rgba(217, 70, 239, 0.6);
    animation: operational-ai-pulse-beacon 2.5s infinite;
}

.sol-theme--operational-ai .hero-eyebrow .eyebrow-txt,
.exp-theme--operational-ai .hero-eyebrow .eyebrow-txt {
    color: #7e22ce;
}

.sol-theme--operational-ai .section-tag,
.exp-theme--operational-ai .section-tag {
    color: #7e22ce;
}

.sol-theme--operational-ai .grad-text,
.exp-theme--operational-ai .grad-text {
    background: linear-gradient(135deg, #7e22ce 0%, #a855f7 50%, #ec4899 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.sol-theme--operational-ai .btn-nb-primary,
.exp-theme--operational-ai .btn-nb-primary {
    background: linear-gradient(135deg, #7e22ce 0%, #c026d3 100%);
    color: #ffffff;
    box-shadow: 0 8px 24px rgba(192, 38, 211, 0.35);
}

.sol-theme--operational-ai .btn-nb-primary:hover,
.exp-theme--operational-ai .btn-nb-primary:hover {
    background: linear-gradient(135deg, #6b21a8 0%, #a21caf 100%);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(192, 38, 211, 0.45);
}

/* Page Level Operational AI Body Overrides */
body.page-operational-ai,
body.page-template-page-operational-ai-industrial-telemetry {
    --green: #7e22ce !important;
    --green2: #ec4899 !important;
    --grad: linear-gradient(135deg, #7e22ce 0%, #a855f7 50%, #ec4899 100%) !important;
}

body.page-operational-ai .cur-dot,
body.page-template-page-operational-ai-industrial-telemetry .cur-dot {
    background: #7e22ce !important;
}

body.page-operational-ai .cur-ring,
body.page-template-page-operational-ai-industrial-telemetry .cur-ring {
    border-color: rgba(217, 70, 239, 0.5) !important;
}

body.page-operational-ai .cur-ring.hov,
body.page-template-page-operational-ai-industrial-telemetry .cur-ring.hov {
    border-color: #7e22ce !important;
}

body.page-operational-ai .scroll-progress,
body.page-template-page-operational-ai-industrial-telemetry .scroll-progress {
    background: linear-gradient(135deg, #7e22ce 0%, #a855f7 50%, #ec4899 100%) !important;
}

body.page-operational-ai .pulse-dot,
body.page-template-page-operational-ai-industrial-telemetry .pulse-dot {
    background: #d946ef !important;
    box-shadow: 0 0 0 0 rgba(217, 70, 239, 0.6) !important;
    animation: operational-ai-pulse-beacon 2.5s infinite !important;
}

@keyframes operational-ai-pulse-beacon {
    0%   { box-shadow: 0 0 0 0 rgba(217, 70, 239, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(217, 70, 239, 0); }
    100% { box-shadow: 0 0 0 0 rgba(217, 70, 239, 0); }
}

/* Tools & Interfaces Spec Matrix Grid Styling */
.tis-tools-section {
    padding: clamp(60px, 8vw, 100px) 0;
    background: #ffffff;
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}
.tis-tools-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
    gap: 1.5rem;
    margin-top: 2.5rem;
}
.tis-tool-card {
    background: #fafafb;
    border: 1px solid rgba(43, 45, 66, 0.08);
    border-radius: 4px;
    padding: 1.5rem 1.5rem 1.6rem;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    overflow: hidden;
}
.tis-tool-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background: transparent;
    transition: background 0.3s ease;
}
.tis-tool-card:hover {
    background: #ffffff;
    border-color: var(--sol-accent, var(--exp-accent, #d97706));
    box-shadow: 0 14px 30px var(--sol-glow, var(--exp-glow, rgba(217, 119, 6, 0.08)));
    transform: translateY(-2px);
}
.tis-tool-card:hover::before {
    background: var(--sol-accent, var(--exp-accent, #d97706));
}
.tis-tool-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.8rem;
}
.tis-tool-label {
    font-family: var(--font-mono, monospace);
    font-size: 0.72rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--sol-accent, var(--exp-accent, #d97706));
}
.tis-tool-icon {
    color: rgba(43, 45, 66, 0.4);
    transition: color 0.3s ease;
}
.tis-tool-card:hover .tis-tool-icon {
    color: var(--sol-accent, var(--exp-accent, #d97706));
}
.tis-tool-content {
    font-size: 0.92rem;
    line-height: 1.65;
    color: rgba(43, 45, 66, 0.85);
    font-weight: 450;
    margin: 0;
}

/* Where It's Proven Grid Styling */
.tis-proven-section {
    padding: clamp(60px, 8vw, 100px) 0;
    background: #fbfbfc;
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}
.tis-proven-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1.5rem;
    margin-top: 2rem;
}
.tis-proven-card {
    background: #ffffff;
    border: 1px solid rgba(43, 45, 66, 0.08);
    border-radius: 4px;
    padding: 1.8rem;
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.tis-proven-card:hover {
    border-color: var(--sol-accent, var(--exp-accent, #d97706));
    box-shadow: 0 16px 36px var(--sol-glow, var(--exp-glow, rgba(217, 119, 6, 0.12)));
    transform: translateY(-3px);
}
.tis-proven-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.2rem;
}
.tis-proven-num {
    font-family: var(--font-mono, monospace);
    font-size: 0.75rem;
    letter-spacing: 2px;
    font-weight: 700;
    color: rgba(43, 45, 66, 0.4);
    transition: color 0.3s ease;
}
.tis-proven-card:hover .tis-proven-num {
    color: var(--sol-accent, var(--exp-accent, #d97706));
}
.tis-proven-icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(43, 45, 66, 0.06);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--sol-accent, var(--exp-accent, #d97706));
    transition: all 0.3s ease;
}
.tis-proven-card:hover .tis-proven-icon {
    background: var(--sol-accent, var(--exp-accent, #d97706));
    color: #ffffff;
}
.tis-proven-name {
    font-size: 1.05rem;
    font-weight: 600;
    line-height: 1.35;
    color: var(--black, #111827);
    margin-bottom: 0.8rem;
}
.tis-proven-badge {
    font-family: var(--font-mono, monospace);
    font-size: 0.68rem;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--sol-accent, var(--exp-accent, #d97706));
    display: inline-flex;
    align-items: center;
    gap: 6px;
}


/* Cursor overrides on Solution Pages */
body.page-solution .cur-dot { background: var(--sol-accent, #0284c7) !important; }
body.page-solution .cur-ring { border-color: rgba(2, 132, 199, 0.45) !important; }
body.page-solution .cur-ring.hov { border-color: var(--sol-accent, #0284c7) !important; }
body.page-solution .scroll-progress { background: var(--sol-grad, #0284c7) !important; }

/* Pulse beacon */
.sol-hero .pulse-dot {
    background: var(--sol-accent, #0284c7) !important;
    box-shadow: 0 0 0 0 rgba(2, 132, 199, 0.6) !important;
    animation: sol-pulse-beacon 2.5s infinite !important;
}
@keyframes sol-pulse-beacon {
    0%   { box-shadow: 0 0 0 0 rgba(2, 132, 199, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(2, 132, 199, 0); }
    100% { box-shadow: 0 0 0 0 rgba(2, 132, 199, 0); }
}

/* Redesigned Hero Block for Solutions */
.sol-hero {
    background: var(--white);
    padding-top: clamp(130px, 15vw, 180px);
    padding-bottom: clamp(50px, 7vw, 80px);
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(43, 45, 66, 0.06);
}
.sol-hero-title {
    font-size: clamp(2.4rem, 4.6vw, 4.2rem) !important;
    font-weight: 900 !important;
    letter-spacing: -.035em !important;
    line-height: 1.08 !important;
    text-transform: uppercase !important;
    color: var(--navy) !important;
    margin-top: 1rem !important;
    margin-bottom: 1.6rem !important;
}
.sol-hero-thesis {
    font-size: clamp(1.05rem, 1.6vw, 1.25rem) !important;
    font-weight: 400 !important;
    line-height: 1.6 !important;
    color: var(--navy) !important;
    border-left: 2px solid var(--sol-accent, #0284c7) !important;
    padding-left: 1.4rem !important;
    max-width: 720px !important;
    margin-bottom: 1.5rem !important;
}
.sol-hero-scope {
    font-size: 0.98rem !important;
    font-weight: 300 !important;
    line-height: 1.82 !important;
    color: rgba(43, 45, 66, 0.68) !important;
    max-width: 720px !important;
    margin-bottom: 0 !important;
}
.sol-accent {
    color: var(--sol-accent, #0284c7) !important;
    font-weight: 600 !important;
}
.sol-grad-text {
    background: var(--sol-grad, linear-gradient(135deg, #0284c7, #38bdf8)) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* 01 Operational Friction */
.sol-friction-section {
    padding: clamp(90px, 12vw, 140px) 0;
    background: var(--soft);
    border-top: 1px solid rgba(43, 45, 66, 0.07);
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}
.sol-section-title {
    font-size: clamp(2.2rem, 3.8vw, 3.2rem);
    font-weight: 300;
    letter-spacing: -.03em;
    line-height: 1.15;
    color: var(--navy);
    margin-bottom: 1.6rem;
}
.sol-lead-copy {
    font-size: 1.08rem;
    font-weight: 400;
    line-height: 1.8;
    color: var(--navy);
    margin-bottom: 1.5rem;
}
.sol-body-copy {
    font-size: 0.95rem;
    font-weight: 300;
    line-height: 1.82;
    color: rgba(43, 45, 66, 0.72);
    margin: 0;
}

/* 02 Featured Systems (Card Grid) */
.sol-systems-section {
    padding: clamp(90px, 12vw, 150px) 0;
    background: var(--white);
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}
.sol-card-grid {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}
.sol-card {
    background: var(--white);
    border: 1px solid rgba(43, 45, 66, 0.09);
    border-left: 3px solid rgba(43, 45, 66, 0.15);
    padding: clamp(2rem, 4vw, 3.2rem);
    transition: border-left-color 0.4s var(--expo), transform 0.4s var(--expo), box-shadow 0.4s var(--expo);
}
.sol-card:hover {
    border-left-color: var(--sol-accent, #0284c7);
    transform: translateY(-4px);
    box-shadow: 0 24px 50px rgba(15, 23, 42, 0.06);
}
.sol-card-header {
    margin-bottom: 1.8rem;
    padding-bottom: 1.4rem;
    border-bottom: 1px solid rgba(43, 45, 66, 0.06);
}
.sol-sys-index {
    font-family: var(--mono);
    font-size: 0.65rem;
    letter-spacing: 3px;
    color: var(--sol-accent, #0284c7);
    text-transform: uppercase;
    display: block;
    margin-bottom: 0.6rem;
}
.sol-card-title {
    font-size: clamp(1.4rem, 2.4vw, 1.85rem);
    font-weight: 600;
    color: var(--navy);
    letter-spacing: -.02em;
    line-height: 1.25;
    margin: 0;
}
.sol-point-block {
    margin-bottom: 1.4rem;
}
.sol-point-label {
    font-family: var(--mono);
    font-size: 0.62rem;
    letter-spacing: 2px;
    color: rgba(43, 45, 66, 0.45);
    text-transform: uppercase;
    display: block;
    margin-bottom: 0.4rem;
}
.sol-point-value {
    font-size: 0.95rem;
    font-weight: 300;
    line-height: 1.75;
    color: rgba(43, 45, 66, 0.85);
    margin: 0;
}
.sol-tags-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 1.8rem;
    margin-bottom: 1.8rem;
}
.sol-tag {
    font-family: var(--mono);
    font-size: 0.65rem;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 0.4rem 0.85rem;
    background: rgba(43, 45, 66, 0.04);
    border: 1px solid rgba(43, 45, 66, 0.08);
    color: var(--navy);
    border-radius: 2px;
}
.sol-card-footer {
    padding-top: 1.2rem;
    border-top: 1px solid rgba(43, 45, 66, 0.06);
}
.sol-action-link {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    font-family: var(--mono);
    font-size: 0.68rem;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--sol-accent, #0284c7);
    text-decoration: none;
    font-weight: 500;
    transition: gap 0.3s var(--expo), color 0.3s;
}
.sol-action-link:hover {
    gap: 1.1rem;
    color: var(--navy);
}

/* 03 Future-Proof Runway */
.sol-runway-section {
    padding: clamp(90px, 12vw, 140px) 0;
    background: var(--soft);
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}
.sol-runway-card {
    background: var(--white);
    padding: 2.4rem 2rem;
    border-top: 2px solid var(--sol-accent, #0284c7);
    height: 100%;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.03);
}
.sol-runway-num {
    font-family: var(--mono);
    font-size: 0.65rem;
    letter-spacing: 2.5px;
    color: var(--sol-accent, #0284c7);
    text-transform: uppercase;
    margin-bottom: 1rem;
    display: block;
}
.sol-runway-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 0.8rem;
    letter-spacing: -.01em;
    line-height: 1.3;
}
.sol-runway-desc {
    font-size: 0.92rem;
    font-weight: 300;
    line-height: 1.75;
    color: rgba(43, 45, 66, 0.75);
    margin: 0;
}

/* Card Thumbnail in Solutions Grid */
.sol-card-img-wrap {
    margin-bottom: 1.8rem;
    overflow: hidden;
    background: #0f172a;
    border: 1px solid rgba(43, 45, 66, 0.08);
    position: relative;
    max-height: 340px;
}
.sol-card-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: grayscale(15%) contrast(105%);
    transition: transform 0.6s var(--expo), filter 0.4s ease;
}
.sol-card:hover .sol-card-img-wrap img {
    transform: scale(1.03);
    filter: grayscale(0%) contrast(100%);
}

/* ════════════════════════════════════════════════
   SINGLE SOLUTION SYSTEM (single-solution.php)
════════════════════════════════════════════════ */
.sol-single-hero {
    background: var(--white);
    padding-top: clamp(130px, 15vw, 175px);
    padding-bottom: clamp(50px, 7vw, 80px);
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}
.sol-back-link {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    font-family: var(--mono);
    font-size: 0.65rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: rgba(43, 45, 66, 0.5);
    text-decoration: none;
    transition: color 0.3s var(--expo), transform 0.3s var(--expo);
}
.sol-back-link:hover {
    color: var(--sol-accent, #0284c7);
    transform: translateX(-3px);
}
.sol-single-title {
    font-size: clamp(2.4rem, 4.4vw, 4rem);
    font-weight: 800;
    letter-spacing: -.03em;
    line-height: 1.1;
    color: var(--navy);
    margin-top: 0.8rem;
    margin-bottom: 1.8rem;
}
.sol-context-ribbon {
    display: inline-block;
    background: var(--soft);
    border-left: 2px solid var(--sol-accent, #0284c7);
    padding: 0.85rem 1.4rem;
    max-width: 760px;
}
.sol-context-ribbon .sol-point-value {
    font-size: 0.95rem;
    font-weight: 400;
    color: var(--navy);
    margin: 0;
}

/* Single Media Section */
.sol-single-media-section {
    padding: clamp(40px, 6vw, 70px) 0;
    background: var(--soft);
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}
.sol-single-img-wrap {
    position: relative;
    background: #0f172a;
    border: 1px solid rgba(43, 45, 66, 0.12);
    box-shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
    overflow: hidden;
}
.sol-single-img-wrap img {
    width: 100%;
    height: auto;
    max-height: 600px;
    object-fit: cover;
    display: block;
}
.sol-img-blueprint-tag {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(15, 23, 42, 0.85);
    backdrop-filter: blur(8px);
    padding: 8px 16px;
    font-family: var(--mono);
    font-size: 0.6rem;
    letter-spacing: 2px;
    color: rgba(255, 255, 255, 0.7);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

/* Single Snapshot (Challenge vs Solution) */
.sol-single-snapshot-section {
    padding: clamp(70px, 9vw, 110px) 0;
    background: var(--white);
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}
.sol-snapshot-card {
    background: var(--soft);
    padding: clamp(2rem, 3.5vw, 3rem);
    height: 100%;
    border-top: 2px solid rgba(43, 45, 66, 0.2);
}
.sol-snapshot-card--solution {
    border-top-color: var(--sol-accent, #0284c7);
    background: #ffffff;
    border-left: 1px solid rgba(43, 45, 66, 0.08);
    border-right: 1px solid rgba(43, 45, 66, 0.08);
    border-bottom: 1px solid rgba(43, 45, 66, 0.08);
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
}
.sol-snapshot-tag {
    font-family: var(--mono);
    font-size: 0.62rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: rgba(43, 45, 66, 0.5);
    display: block;
    margin-bottom: 1rem;
}
.sol-snapshot-tag--accent {
    color: var(--sol-accent, #0284c7);
}
.sol-snapshot-heading {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--navy);
    letter-spacing: -.015em;
    margin-bottom: 1.1rem;
    line-height: 1.3;
}
.sol-snapshot-body {
    font-size: 0.95rem;
    font-weight: 300;
    line-height: 1.8;
    color: rgba(43, 45, 66, 0.8);
    margin: 0;
}

/* Longform Body Content */
.sol-single-body {
    padding: clamp(70px, 9vw, 120px) 0;
    background: var(--white);
}
.sol-longform-copy p {
    font-size: 1.05rem;
    font-weight: 300;
    line-height: 1.88;
    color: rgba(43, 45, 66, 0.82);
    margin-bottom: 1.8rem;
}
.sol-longform-copy h2,
.sol-longform-copy h3 {
    font-size: clamp(1.4rem, 2.2vw, 1.85rem);
    font-weight: 600;
    color: var(--navy);
    letter-spacing: -.02em;
    margin-top: 2.8rem;
    margin-bottom: 1.2rem;
}
.sol-longform-copy blockquote {
    border-left: 2px solid var(--sol-accent, #0284c7);
    padding-left: 1.5rem;
    margin: 2.5rem 0;
    font-style: italic;
    color: rgba(43, 45, 66, 0.6);
    font-size: 1.1rem;
}

/* ════════════════════════════════════════════════
   TEST & INSPECTION SOFTWARE — CLEAN TYPOGRAPHIC STYLES
════════════════════════════════════════════════ */

/* Hero Layout */
.tis-hero-section {
    padding-bottom: clamp(70px, 9vw, 120px);
}
.tis-hero-wrap {
    max-width: 880px;
}
.tis-hero-title {
    font-size: clamp(2.8rem, 5.5vw, 4.8rem);
    font-weight: 800;
    letter-spacing: -.03em;
    line-height: 1.05;
    color: var(--navy);
    margin-top: 1.2rem;
    margin-bottom: 1.5rem;
}
.tis-hero-sub {
    font-size: clamp(1.15rem, 1.8vw, 1.45rem);
    font-weight: 500;
    line-height: 1.45;
    color: var(--sol-accent, #58af6c);
    margin-bottom: 1.6rem;
}
.tis-hero-body {
    font-size: clamp(1.05rem, 1.4vw, 1.2rem);
    font-weight: 300;
    line-height: 1.8;
    color: rgba(43, 45, 66, 0.78);
    border-left: 2px solid var(--sol-accent, #58af6c);
    padding-left: 1.6rem;
    max-width: 780px;
    margin-bottom: 0;
}

/* 01 Our Capabilities (What We Build) — Editorial Split Showcase */
.tis-what-section {
    padding: clamp(80px, 10vw, 140px) 0;
    background: var(--soft);
    border-top: 1px solid rgba(43, 45, 66, 0.07);
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}
.tis-section-title {
    font-size: clamp(2.2rem, 3.6vw, 3.2rem);
    font-weight: 700;
    letter-spacing: -.025em;
    line-height: 1.15;
    color: var(--navy);
}

/* Sticky Left Column & Asymmetrical Image Plate */
.tis-cap-sticky {
    position: sticky;
    top: 120px;
}
@media (max-width: 991px) {
    .tis-cap-sticky {
        position: static;
        margin-bottom: 2rem;
    }
}
.tis-asym-wrap {
    margin-top: 1.5rem;
    max-width: 480px;
}

/* Right Column: 6 Capabilities Grid */
.tis-cap-cards-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.3rem;
}
@media (max-width: 650px) {
    .tis-cap-cards-grid {
        grid-template-columns: 1fr;
    }
}
.tis-cap-card {
    background: var(--white);
    border: 1px solid rgba(43, 45, 66, 0.09);
    padding: 1.8rem 1.6rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    transition: all 0.35s var(--expo);
    position: relative;
}
.tis-cap-card:hover {
    border-color: var(--sol-accent, #58af6c);
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.05);
}
.tis-cap-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.2rem;
}
.tis-cap-idx {
    font-family: var(--mono);
    font-size: 0.68rem;
    letter-spacing: 2px;
    color: rgba(43, 45, 66, 0.35);
    font-weight: 500;
    transition: color 0.3s;
}
.tis-cap-card:hover .tis-cap-idx {
    color: var(--sol-accent, #58af6c);
}
.tis-cap-icon {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    color: var(--sol-accent, #58af6c);
    transition: transform 0.3s var(--expo);
}
.tis-cap-card:hover .tis-cap-icon {
    transform: scale(1.1);
}
.tis-cap-name {
    font-size: 1.08rem;
    font-weight: 600;
    color: var(--navy);
    line-height: 1.35;
    margin-bottom: 0.55rem;
    letter-spacing: -0.015em;
}
.tis-cap-desc {
    font-size: 0.92rem;
    font-weight: 300;
    line-height: 1.7;
    color: rgba(43, 45, 66, 0.72);
    margin: 0;
}

/* 02 Applications — Redesigned Discipline Cards & Metrology Showcase Plate */

/* ════════════════════════════════════════════════
   02 OPERATIONAL REALITY — FULL WIDTH 50/50 SPLIT
════════════════════════════════════════════════ */
.tis-reality-fullwidth-section {
    width: 100%;
    padding: 0 !important;
    margin: 0 !important;
    background: #ffffff;
    border-top: 1px solid rgba(43, 45, 66, 0.08);
    border-bottom: 1px solid rgba(43, 45, 66, 0.08);
    overflow: hidden;
}
.tis-reality-fw-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 520px;
    align-items: stretch;
}
.tis-reality-fw-media {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 380px;
    background: #0d131f;
}
.tis-reality-fw-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.tis-reality-fw-content {
    display: flex;
    align-items: center;
    padding: clamp(3rem, 6vw, 6.5rem) clamp(2rem, 5vw, 5.5rem);
    background: #ffffff;
}
.tis-reality-fw-inner {
    max-width: 620px;
}
.tis-reality-fw-eyebrow {
    display: inline-block;
    margin-bottom: 1.5rem;
    font-family: var(--mono, monospace);
    font-size: 0.72rem;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--sol-accent, #58af6c);
    font-weight: 600;
}
.tis-reality-fw-text {
    font-size: clamp(1.45rem, 2.3vw, 2.2rem);
    font-weight: 500;
    line-height: 1.45;
    color: var(--navy, #1e293b);
    letter-spacing: -0.015em;
    margin: 0;
}
@media (max-width: 991px) {
    .tis-reality-fw-grid {
        grid-template-columns: 1fr;
    }
    .tis-reality-fw-media {
        min-height: 320px;
        aspect-ratio: 16 / 9;
    }
    .tis-reality-fw-content {
        padding: 3rem 1.5rem;
    }
}

.tis-fits-section {
    padding: clamp(80px, 10vw, 140px) 0;
    background: var(--white);
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}
.tis-app-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.6rem;
}
@media (max-width: 991px) {
    .tis-app-cards-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .tis-app-cards-grid { grid-template-columns: 1fr; }
}
.tis-app-card {
    background: var(--soft);
    border: 1px solid rgba(43, 45, 66, 0.08);
    border-left: 3px solid rgba(43, 45, 66, 0.16);
    padding: 2rem 1.8rem;
    transition: all 0.35s var(--expo);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 180px;
}
.tis-app-card:hover {
    background: var(--white);
    border-left-color: var(--sol-accent, #58af6c);
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.06);
}
.tis-app-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.4rem;
}
.tis-app-idx {
    font-family: var(--mono);
    font-size: 0.68rem;
    letter-spacing: 2px;
    color: rgba(43, 45, 66, 0.35);
    font-weight: 500;
    transition: color 0.3s;
}
.tis-app-card:hover .tis-app-idx {
    color: var(--sol-accent, #58af6c);
}
.tis-app-icon-wrap {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(88, 175, 108, 0.08);
    color: var(--sol-accent, #58af6c);
    border-radius: 50%;
    transition: all 0.35s var(--expo);
}
.tis-app-card:hover .tis-app-icon-wrap {
    background: var(--sol-accent, #58af6c);
    color: #ffffff;
    transform: scale(1.08);
}
.tis-app-title {
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--navy);
    line-height: 1.35;
    margin-bottom: 0.75rem;
    letter-spacing: -0.015em;
}
.tis-app-desc {
    font-size: 0.92rem;
    font-weight: 300;
    line-height: 1.7;
    color: rgba(43, 45, 66, 0.72);
    margin: 0;
}

/* Wide Asymmetrical Metrology Showcase Frame */
.tis-app-plate-wrap {
    margin-top: 3.5rem;
}
.tis-asym-wide {
    position: relative;
    max-width: 960px;
    margin: 0 auto;
    padding: 2.2rem 2.2rem 2.2rem 1.4rem;
}
.tis-asym-wide-backdrop {
    clip-path: polygon(0% 4%, 98% 0%, 100% 95%, 2% 98%) !important;
    transform: translate(22px, -18px) rotate(1.5deg) !important;
}
.tis-asym-wide-box {
    width: 100% !important;
    min-height: 380px !important;
    aspect-ratio: 16 / 9 !important;
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 32px), calc(100% - 32px) 100%, 0 100%, 0 24px) !important;
}

/* 03 Built For (Clean Soft Atmosphere — No Dark Box) */
.tis-built-section {
    padding: clamp(80px, 10vw, 120px) 0;
    background: var(--soft);
    border-top: 1px solid rgba(43, 45, 66, 0.07);
    border-bottom: 1px solid rgba(43, 45, 66, 0.07);
}
.tis-built-tag {
    font-family: var(--mono);
    font-size: 0.65rem;
    letter-spacing: 3px;
    color: var(--sol-accent, #58af6c);
    text-transform: uppercase;
    display: block;
    margin-bottom: 1.4rem;
}
.tis-built-quote {
    font-size: clamp(1.4rem, 2.5vw, 2.1rem);
    font-weight: 500;
    line-height: 1.45;
    color: var(--navy);
    max-width: 900px;
    margin: 0;
}

/* ════════════════════════════════════════════════
   03 SELECTED PROJECTS — CAROUSEL & HEADER ACTIONS
════════════════════════════════════════════════ */
.tis-projects-section {
    padding: clamp(80px, 10vw, 130px) 0;
    background: #ffffff;
    overflow: hidden;
}
.tis-view-all-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.65rem 1.35rem;
    background: transparent;
    border: 1px solid rgba(43, 45, 66, 0.2);
    border-radius: 4px;
    color: var(--navy, #1e293b);
    font-family: var(--mono, monospace);
    font-size: 0.75rem;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    white-space: nowrap;
}
.tis-view-all-btn:hover {
    background: var(--navy, #1e293b);
    color: #ffffff;
    border-color: var(--navy, #1e293b);
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.12);
}
.tis-view-all-btn svg {
    transition: transform 0.25s ease;
}
.tis-view-all-btn:hover svg {
    transform: translateX(4px);
}
.tis-carousel-nav {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}
.tis-nav-btn {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    border: 1px solid rgba(43, 45, 66, 0.2);
    border-radius: 4px;
    color: var(--navy, #1e293b);
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    outline: none;
}
.tis-nav-btn:hover:not(:disabled) {
    background: var(--sol-accent, #58af6c);
    color: #ffffff;
    border-color: var(--sol-accent, #58af6c);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(88, 175, 108, 0.25);
}
.tis-nav-btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}
.tis-carousel-viewport {
    position: relative;
    width: 100%;
}
.tis-projects-carousel {
    display: flex;
    gap: 1.25rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    padding: 0.5rem 0 1.5rem;
    scrollbar-width: none;
}
.tis-projects-carousel::-webkit-scrollbar {
    display: none;
}
.tis-projects-carousel .tis-project-card {
    /* 3 full cards + half of the 4th card (3.5 cards visible) */
    flex: 0 0 calc((100% - 3.75rem) / 3.5);
    min-width: 250px;
    max-width: 360px;
    scroll-snap-align: start;
    margin: 0;
}
@media (max-width: 1200px) {
    .tis-projects-carousel .tis-project-card {
        /* 2.5 cards on medium screens */
        flex: 0 0 calc((100% - 2.5rem) / 2.5);
        max-width: 380px;
    }
}
@media (max-width: 768px) {
    .tis-projects-carousel .tis-project-card {
        /* 1.25 cards on mobile for peek cue */
        flex: 0 0 calc(82%);
        min-width: 240px;
    }
}
.tis-project-card {
    background: #ffffff;
    border: 1px solid rgba(43, 45, 66, 0.1);
    border-radius: 4px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.35s ease;
}
.tis-project-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.09);
    border-color: rgba(88, 175, 108, 0.4);
}
.tis-project-media {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 10;
    max-height: 190px;
    overflow: hidden;
    background: #0d131f;
}
.tis-project-img-link {
    display: block;
    width: 100%;
    height: 100%;
}
.tis-project-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.tis-project-card:hover .tis-project-photo {
    transform: scale(1.05);
}
.tis-project-client-badge {
    position: absolute;
    bottom: 8px;
    left: 8px;
    background: rgba(13, 19, 31, 0.88);
    backdrop-filter: blur(8px);
    color: #ffffff;
    font-family: var(--mono, monospace);
    font-size: 0.58rem;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    padding: 3px 7px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 2px;
    font-weight: 500;
}
.tis-project-body {
    padding: 1.15rem 1.1rem 1.1rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.tis-project-meta-strip {
    font-family: var(--mono, monospace);
    font-size: 0.6rem;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--sol-accent, #58af6c);
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}
.tis-meta-dot {
    color: rgba(43, 45, 66, 0.3);
}
.tis-project-title {
    font-size: 1.02rem;
    font-weight: 600;
    line-height: 1.35;
    margin-bottom: 0.55rem;
}
.tis-project-title a {
    color: var(--navy, #1e293b);
    text-decoration: none;
    transition: color 0.2s ease;
}
.tis-project-title a:hover {
    color: var(--sol-accent, #58af6c);
}
.tis-project-desc {
    font-size: 0.82rem;
    line-height: 1.55;
    color: rgba(43, 45, 66, 0.72);
    margin-bottom: 0.85rem;
    flex-grow: 1;
}
.tis-project-deliverables {
    font-size: 0.7rem;
    line-height: 1.4;
    padding: 0.45rem 0.65rem;
    background: #f8fafc;
    border-left: 2px solid var(--sol-accent, #58af6c);
    border-radius: 0 3px 3px 0;
    margin-bottom: 0.85rem;
}
.tis-deliv-lbl {
    font-family: var(--mono, monospace);
    font-size: 0.58rem;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: rgba(43, 45, 66, 0.6);
    font-weight: 600;
    display: block;
    margin-bottom: 2px;
}
.tis-deliv-val {
    color: var(--navy, #1e293b);
    font-weight: 500;
}
.tis-project-foot {
    margin-top: auto;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(43, 45, 66, 0.08);
}
.tis-project-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-family: var(--mono, monospace);
    font-size: 0.66rem;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--sol-accent, #58af6c);
    text-decoration: none;
    font-weight: 600;
    transition: gap 0.25s cubic-bezier(0.16, 1, 0.3, 1), color 0.2s ease;
}
.tis-project-link:hover {
    gap: 0.7rem;
    color: var(--navy, #1e293b);
}

.sol-theme--fmcg {
    --sol-accent: #ea580c;
    --sol-accent-2: #f59e0b;
    --sol-grad: linear-gradient(135deg, #ea580c 0%, #f59e0b 100%);
    --sol-glow: rgba(234, 88, 12, 0.25);
}

.sol-theme--fmcg .hero-eyebrow .pulse-dot {
    background: #f59e0b;
    box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.55);
    animation: pulse-anim-fmcg 2.5s infinite;
}

@keyframes pulse-anim-fmcg {
    0%   { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.55); }
    70%  { box-shadow: 0 0 0 10px rgba(245, 158, 11, 0); }
    100% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0); }
}

.sol-theme--fmcg .hero-eyebrow .eyebrow-txt {
    color: #ea580c;
}

.sol-theme--fmcg .section-tag {
    color: #ea580c;
}

.sol-theme--fmcg .grad-text {
    background: linear-gradient(135deg, #ea580c 0%, #f59e0b 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.sol-theme--fmcg .exp-img-backdrop {
    background: linear-gradient(135deg, rgba(234, 88, 12, 0.28) 0%, rgba(245, 158, 11, 0.36) 100%);
    box-shadow: 0 25px 60px rgba(234, 88, 12, 0.18);
}

.sol-theme--fmcg .tis-app-icon-wrap {
    background: rgba(245, 158, 11, 0.12);
    color: #ea580c;
}

.sol-theme--fmcg .tis-app-card:hover .tis-app-icon-wrap {
    background: linear-gradient(135deg, #ea580c 0%, #f59e0b 100%);
    color: #ffffff;
}

.sol-theme--fmcg .tis-built-tag {
    color: #ea580c;
}

/* ════════════════════════════════════════════════
   PROCESS & HEAVY MANUFACTURING — THEME OVERRIDES
   Scoped Palette: Electric Industrial Cobalt & Precision Azure
   Palette: #0284c7 (Sky Blue) & #2563eb (Cobalt Blue)
════════════════════════════════════════════════ */
.sol-theme--heavy {
    --sol-accent: #0284c7;
    --sol-accent-2: #2563eb;
    --sol-grad: linear-gradient(135deg, #0284c7 0%, #2563eb 100%);
    --sol-glow: rgba(2, 132, 199, 0.25);
}

.sol-theme--heavy .hero-eyebrow .pulse-dot {
    background: #0284c7;
    box-shadow: 0 0 0 0 rgba(2, 132, 199, 0.55);
    animation: pulse-anim-heavy 2.5s infinite;
}

@keyframes pulse-anim-heavy {
    0%   { box-shadow: 0 0 0 0 rgba(2, 132, 199, 0.55); }
    70%  { box-shadow: 0 0 0 10px rgba(2, 132, 199, 0); }
    100% { box-shadow: 0 0 0 0 rgba(2, 132, 199, 0); }
}

.sol-theme--heavy .hero-eyebrow .eyebrow-txt {
    color: #0284c7;
}

.sol-theme--heavy .section-tag {
    color: #0284c7;
}

.sol-theme--heavy .grad-text {
    background: linear-gradient(135deg, #0284c7 0%, #2563eb 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.sol-theme--heavy .exp-img-backdrop {
    background: linear-gradient(135deg, rgba(2, 132, 199, 0.28) 0%, rgba(37, 99, 235, 0.36) 100%);
    box-shadow: 0 25px 60px rgba(2, 132, 199, 0.18);
}

.sol-theme--heavy .tis-app-icon-wrap {
    background: rgba(2, 132, 199, 0.1);
    color: #0284c7;
}

.sol-theme--heavy .tis-app-card:hover .tis-app-icon-wrap {
    background: linear-gradient(135deg, #0284c7 0%, #2563eb 100%);
    color: #ffffff;
}

.sol-theme--heavy .tis-built-tag {
    color: #0284c7;
}

/* ════════════════════════════════════════════════
   TESTING MACHINERY & CALIBRATION LABS — THEME OVERRIDES
   Scoped Palette: Precision Laboratory Violet & Amethyst
   Palette: #6d28d9 (Deep Lab Violet) & #9333ea (Precision Amethyst)
════════════════════════════════════════════════ */
.sol-theme--lab {
    --sol-accent: #6d28d9;
    --sol-accent-2: #9333ea;
    --sol-grad: linear-gradient(135deg, #6d28d9 0%, #9333ea 100%);
    --sol-glow: rgba(109, 40, 217, 0.25);
}

.sol-theme--lab .hero-eyebrow .pulse-dot {
    background: #9333ea;
    box-shadow: 0 0 0 0 rgba(147, 51, 234, 0.55);
    animation: pulse-anim-lab 2.5s infinite;
}

@keyframes pulse-anim-lab {
    0%   { box-shadow: 0 0 0 0 rgba(147, 51, 234, 0.55); }
    70%  { box-shadow: 0 0 0 10px rgba(147, 51, 234, 0); }
    100% { box-shadow: 0 0 0 0 rgba(147, 51, 234, 0); }
}

.sol-theme--lab .hero-eyebrow .eyebrow-txt {
    color: #6d28d9;
}

.sol-theme--lab .section-tag {
    color: #6d28d9;
}

.sol-theme--lab .grad-text {
    background: linear-gradient(135deg, #6d28d9 0%, #9333ea 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.sol-theme--lab .exp-img-backdrop {
    background: linear-gradient(135deg, rgba(109, 40, 217, 0.28) 0%, rgba(147, 51, 234, 0.36) 100%);
    box-shadow: 0 25px 60px rgba(109, 40, 217, 0.18);
}

.sol-theme--lab .tis-app-icon-wrap {
    background: rgba(109, 40, 217, 0.1);
    color: #6d28d9;
}

.sol-theme--lab .tis-app-card:hover .tis-app-icon-wrap {
    background: linear-gradient(135deg, #6d28d9 0%, #9333ea 100%);
    color: #ffffff;
}

.sol-theme--lab .tis-built-tag {
    color: #6d28d9;
}

/* ════════════════════════════════════════════════
   ENVIRONMENTAL, GAS & UTILITIES — THEME OVERRIDES
   Scoped Palette: Safety Carmine & Signal Crimson
   Palette: #be123c (Deep Safety Carmine) & #e11d48 (Signal Crimson)
════════════════════════════════════════════════ */
.sol-theme--env {
    --sol-accent: #be123c;
    --sol-accent-2: #e11d48;
    --sol-grad: linear-gradient(135deg, #be123c 0%, #f43f5e 100%);
    --sol-glow: rgba(190, 18, 60, 0.25);
}

.sol-theme--env .hero-eyebrow .pulse-dot {
    background: #e11d48;
    box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.55);
    animation: pulse-anim-env 2.5s infinite;
}

@keyframes pulse-anim-env {
    0%   { box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.55); }
    70%  { box-shadow: 0 0 0 10px rgba(225, 29, 72, 0); }
    100% { box-shadow: 0 0 0 0 rgba(225, 29, 72, 0); }
}

.sol-theme--env .hero-eyebrow .eyebrow-txt {
    color: #be123c;
}

.sol-theme--env .section-tag {
    color: #be123c;
}

.sol-theme--env .grad-text {
    background: linear-gradient(135deg, #be123c 0%, #f43f5e 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.sol-theme--env .exp-img-backdrop {
    background: linear-gradient(135deg, rgba(190, 18, 60, 0.28) 0%, rgba(244, 63, 94, 0.36) 100%);
    box-shadow: 0 25px 60px rgba(190, 18, 60, 0.18);
}

.sol-theme--env .tis-app-icon-wrap {
    background: rgba(225, 29, 72, 0.1);
    color: #be123c;
}

.sol-theme--env .tis-app-card:hover .tis-app-icon-wrap {
    background: linear-gradient(135deg, #be123c 0%, #f43f5e 100%);
    color: #ffffff;
}

.sol-theme--env .tis-built-tag {
    color: #be123c;
}

/* 5-Card Layout Harmony for Environmental Applications */
@media (min-width: 992px) {
    .tis-env-cards-grid {
        grid-template-columns: repeat(6, 1fr);
    }
    .tis-env-cards-grid .tis-app-card:nth-child(1),
    .tis-env-cards-grid .tis-app-card:nth-child(2),
    .tis-env-cards-grid .tis-app-card:nth-child(3) {
        grid-column: span 2;
    }
    .tis-env-cards-grid .tis-app-card:nth-child(4),
    .tis-env-cards-grid .tis-app-card:nth-child(5) {
        grid-column: span 3;
    }
}

/* ════════════════════════════════════════════════
   DEFENSE, GOVERNMENT & RESEARCH — THEME OVERRIDES
   Scoped Palette: Tactical Cyan & Aerospace Azure
   Palette: #0e7490 (Deep Tactical Cyan) & #06b6d4 (Aerospace Cyan)
════════════════════════════════════════════════ */
.sol-theme--defense {
    --sol-accent: #0e7490;
    --sol-accent-2: #06b6d4;
    --sol-grad: linear-gradient(135deg, #0e7490 0%, #06b6d4 100%);
    --sol-glow: rgba(14, 116, 144, 0.25);
}

.sol-theme--defense .hero-eyebrow .pulse-dot {
    background: #06b6d4;
    box-shadow: 0 0 0 0 rgba(6, 182, 212, 0.55);
    animation: pulse-anim-defense 2.5s infinite;
}

@keyframes pulse-anim-defense {
    0%   { box-shadow: 0 0 0 0 rgba(6, 182, 212, 0.55); }
    70%  { box-shadow: 0 0 0 10px rgba(6, 182, 212, 0); }
    100% { box-shadow: 0 0 0 0 rgba(6, 182, 212, 0); }
}

.sol-theme--defense .hero-eyebrow .eyebrow-txt {
    color: #0e7490;
}

.sol-theme--defense .section-tag {
    color: #0e7490;
}

.sol-theme--defense .grad-text {
    background: linear-gradient(135deg, #0e7490 0%, #06b6d4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.sol-theme--defense .exp-img-backdrop {
    background: linear-gradient(135deg, rgba(14, 116, 144, 0.28) 0%, rgba(6, 182, 212, 0.36) 100%);
    box-shadow: 0 25px 60px rgba(14, 116, 144, 0.18);
}

.sol-theme--defense .tis-app-icon-wrap {
    background: rgba(14, 116, 144, 0.1);
    color: #0e7490;
}

.sol-theme--defense .tis-app-card:hover .tis-app-icon-wrap {
    background: linear-gradient(135deg, #0e7490 0%, #06b6d4 100%);
    color: #ffffff;
}

.sol-theme--defense .tis-built-tag {
    color: #0e7490;
}

/* 4-Card 2x2 Layout for Defense Applications */
.tis-defense-cards-grid {
    grid-template-columns: repeat(2, 1fr) !important;
}
@media (max-width: 767px) {
    .tis-defense-cards-grid {
        grid-template-columns: 1fr !important;
    }
}

/* ════════════════════════════════════════════════
   RETAIL, LOGISTICS & FACILITY SYSTEMS — THEME OVERRIDES
   Scoped Palette: Cyber Indigo & Royal Ultramarine
   Palette: #4338ca (Deep Cyber Indigo) & #6366f1 (Royal Ultramarine)
════════════════════════════════════════════════ */
.sol-theme--retail {
    --sol-accent: #4338ca;
    --sol-accent-2: #6366f1;
    --sol-grad: linear-gradient(135deg, #4338ca 0%, #6366f1 100%);
    --sol-glow: rgba(67, 56, 202, 0.25);
}

.sol-theme--retail .hero-eyebrow .pulse-dot {
    background: #6366f1;
    box-shadow: 0 0 0 0 rgba(99, 102, 241, 0.55);
    animation: pulse-anim-retail 2.5s infinite;
}

@keyframes pulse-anim-retail {
    0%   { box-shadow: 0 0 0 0 rgba(99, 102, 241, 0.55); }
    70%  { box-shadow: 0 0 0 10px rgba(99, 102, 241, 0); }
    100% { box-shadow: 0 0 0 0 rgba(99, 102, 241, 0); }
}

.sol-theme--retail .hero-eyebrow .eyebrow-txt {
    color: #4338ca;
}

.sol-theme--retail .section-tag {
    color: #4338ca;
}

.sol-theme--retail .grad-text {
    background: linear-gradient(135deg, #4338ca 0%, #6366f1 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.sol-theme--retail .exp-img-backdrop {
    background: linear-gradient(135deg, rgba(67, 56, 202, 0.28) 0%, rgba(99, 102, 241, 0.36) 100%);
    box-shadow: 0 25px 60px rgba(67, 56, 202, 0.18);
}

.sol-theme--retail .tis-app-icon-wrap {
    background: rgba(67, 56, 202, 0.1);
    color: #4338ca;
}

.sol-theme--retail .tis-app-card:hover .tis-app-icon-wrap {
    background: linear-gradient(135deg, #4338ca 0%, #6366f1 100%);
    color: #ffffff;
}

.sol-theme--retail .tis-built-tag {
    color: #4338ca;
}

/* 5-Card Layout Harmony for Retail & Logistics Applications */
@media (min-width: 992px) {
    .tis-retail-cards-grid {
        grid-template-columns: repeat(6, 1fr);
    }
    .tis-retail-cards-grid .tis-app-card:nth-child(1),
    .tis-retail-cards-grid .tis-app-card:nth-child(2),
    .tis-retail-cards-grid .tis-app-card:nth-child(3) {
        grid-column: span 2;
    }
    .tis-retail-cards-grid .tis-app-card:nth-child(4),
    .tis-retail-cards-grid .tis-app-card:nth-child(5) {
        grid-column: span 3;
    }
}







/* ════════════════════════════════════════════════
   CONNECT HERO — WATERCOLOR & INK SKETCH GRAPHIC
════════════════════════════════════════════════ */
.connect-nb-hero {
    position: relative;
    overflow: hidden;
}
.connect-nb-hero .nb-hero-inner {
    position: relative;
    z-index: 2;
}
.connect-hero-art {
    position: absolute;
    top: 52%;
    right: clamp(0%, 3vw, 5%);
    transform: translateY(-48%);
    width: clamp(380px, 46vw, 660px);
    pointer-events: none;
    user-select: none;
    z-index: 1;
    mix-blend-mode: multiply;
    opacity: 0;
    animation: connect-art-reveal 1.3s var(--expo) 0.35s forwards;
    -webkit-mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
    mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
}
.connect-hero-art img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    mix-blend-mode: multiply;
    filter: contrast(1.04);
}
@keyframes connect-art-reveal {
    from {
        opacity: 0;
        transform: translateY(-45%) scale(0.97);
    }
    to {
        opacity: 0.9;
        transform: translateY(-48%) scale(1);
    }
}
@media (max-width: 1199px) {
    .connect-hero-art {
        width: clamp(320px, 44vw, 500px);
        right: -2%;
    }
}
@media (max-width: 991px) {
    .connect-hero-art {
        width: clamp(280px, 60vw, 420px);
        top: auto;
        bottom: -10px;
        right: -5%;
        transform: none;
        animation: connect-art-reveal-mobile 1.3s var(--expo) 0.35s forwards;
    }
    @keyframes connect-art-reveal-mobile {
        from { opacity: 0; }
        to   { opacity: 0.22; }
    }
}

/* ════════════════════════════════════════════════
   CONNECT PAGE — WHAT HAPPENS NEXT (ANIMATED TIMELINE)
════════════════════════════════════════════════ */
.connect-process-section {
    background: var(--white);
    padding: clamp(85px, 11vw, 140px) 0;
    border-top: 1px solid rgba(43, 45, 66, 0.07);
    position: relative;
    overflow: hidden;
}
.connect-process-hdr {
    margin-bottom: clamp(50px, 6.5vw, 80px);
}
.connect-process-title {
    font-size: clamp(2.2rem, 4vw, 3.6rem);
    font-weight: 300;
    letter-spacing: -0.04em;
    line-height: 0.96;
    color: var(--navy);
    margin: 0;
}

/* Timeline Wrapper */
.connect-tl {
    position: relative;
}

/* Horizontal Signal Track (Desktop) */
.connect-tl-track {
    position: absolute;
    top: 24px;
    left: 24px;
    right: calc(25% - 18px);
    height: 2px;
    background: rgba(43, 45, 66, 0.08);
    z-index: 0;
    overflow: hidden;
    border-radius: 2px;
}
.connect-tl-track-fill {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 0%;
    background: linear-gradient(90deg, rgba(88, 175, 108, 0.35) 0%, rgba(17, 153, 142, 0.55) 100%);
    transition: width 1.6s cubic-bezier(0.16, 1, 0.3, 1) 0.2s;
}
.connect-tl.visible .connect-tl-track-fill {
    width: 100%;
}
.connect-tl-track-pulse {
    position: absolute;
    top: -1px;
    left: -18%;
    width: 18%;
    height: 4px;
    background: linear-gradient(90deg, transparent 0%, #58af6c 50%, #11998e 85%, transparent 100%);
    filter: drop-shadow(0 0 6px rgba(88, 175, 108, 0.8));
    animation: connect-tl-signal 4.2s cubic-bezier(0.4, 0, 0.2, 1) 1.2s infinite;
}
@keyframes connect-tl-signal {
    0%   { left: -18%; opacity: 0; }
    10%  { opacity: 1; }
    90%  { opacity: 1; }
    100% { left: 100%; opacity: 0; }
}

/* 4-Column Grid */
.connect-tl-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.75rem;
    position: relative;
    z-index: 2;
}

/* Individual Step */
.connect-tl-step {
    display: flex;
    flex-direction: column;
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.75s var(--expo), transform 0.75s var(--expo);
}
.connect-tl.visible .connect-tl-step--1 { opacity: 1; transform: translateY(0); transition-delay: 0.12s; }
.connect-tl.visible .connect-tl-step--2 { opacity: 1; transform: translateY(0); transition-delay: 0.28s; }
.connect-tl.visible .connect-tl-step--3 { opacity: 1; transform: translateY(0); transition-delay: 0.44s; }
.connect-tl.visible .connect-tl-step--4 { opacity: 1; transform: translateY(0); transition-delay: 0.60s; }

/* Node Row — Solid white mask around node so the line never cuts through the bullet or ring */
.connect-tl-node-row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 1.6rem;
}
.connect-tl-node {
    position: relative;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--white);
    border: 1.5px solid rgba(88, 175, 108, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    /* Solid 12px white halo masks the track line cleanly outside the dashed ring */
    box-shadow: 0 0 0 12px var(--white);
    transition: transform 0.4s var(--expo), border-color 0.35s, background 0.35s, box-shadow 0.35s;
}
.connect-tl-node-ring {
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 1px dashed rgba(88, 175, 108, 0.36);
    animation: connect-node-spin 18s linear infinite;
    transition: border-color 0.35s, transform 0.4s var(--expo);
}
@keyframes connect-node-spin {
    to { transform: rotate(360deg); }
}
.connect-tl-node-num {
    font-family: var(--mono);
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--navy);
    transition: color 0.3s;
}
.connect-tl-card-foot {
    margin-top: auto;
    padding-top: 1.35rem;
}
.connect-tl-badge {
    display: inline-block;
    font-family: var(--mono);
    font-size: 0.54rem;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--green2);
    background: rgba(88, 175, 108, 0.08);
    border: 1px solid rgba(88, 175, 108, 0.2);
    padding: 4px 10px;
    border-radius: 100px;
    white-space: nowrap;
}

/* Step Card */
.connect-tl-card {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--soft);
    border: 1px solid rgba(43, 45, 66, 0.07);
    padding: 2rem 1.75rem;
    position: relative;
    overflow: hidden;
    transition: transform 0.45s var(--expo), border-color 0.35s, box-shadow 0.45s var(--expo), background 0.35s;
}
.connect-tl-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 0%;
    height: 2.5px;
    background: var(--grad);
    transition: width 0.5s var(--expo);
}
.connect-tl-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.25rem;
}
.connect-tl-kicker {
    font-family: var(--mono);
    font-size: 0.56rem;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--green);
}
.connect-tl-icon {
    width: 38px;
    height: 38px;
    border-radius: 8px;
    background: rgba(88, 175, 108, 0.09);
    color: var(--green2);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.35s, color 0.35s, transform 0.4s var(--expo);
}
.connect-tl-title {
    font-size: 1.22rem;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--navy);
    margin-bottom: 0.65rem;
    line-height: 1.3;
}
.connect-tl-desc {
    font-size: 0.92rem;
    font-weight: 300;
    line-height: 1.75;
    color: rgba(43, 45, 66, 0.66);
    margin: 0;
}

/* Hover States */
.connect-tl-step:hover .connect-tl-node {
    background: var(--grad);
    border-color: transparent;
    transform: scale(1.08);
    box-shadow: 0 0 0 12px var(--white), 0 10px 26px rgba(88, 175, 108, 0.32);
}
.connect-tl-step:hover .connect-tl-node-num {
    color: #ffffff;
}
.connect-tl-step:hover .connect-tl-node-ring {
    border-color: var(--green);
    transform: scale(1.1);
}
.connect-tl-step:hover .connect-tl-card {
    background: var(--white);
    border-color: rgba(88, 175, 108, 0.32);
    transform: translateY(-6px);
    box-shadow: 0 22px 48px rgba(43, 45, 66, 0.07);
}
.connect-tl-step:hover .connect-tl-card::before {
    width: 100%;
}
.connect-tl-step:hover .connect-tl-icon {
    background: var(--grad);
    color: #ffffff;
    transform: rotate(-4deg) scale(1.06);
}

/* Responsive Vertical Timeline on Tablet & Mobile */
@media (max-width: 991px) {
    .connect-tl-track {
        top: 24px;
        bottom: 24px;
        left: 23px;
        right: auto;
        width: 2px;
        height: auto;
    }
    .connect-tl-track-fill {
        width: 100%;
        height: 0%;
        background: linear-gradient(180deg, rgba(88, 175, 108, 0.35) 0%, rgba(17, 153, 142, 0.55) 100%);
        transition: height 1.6s cubic-bezier(0.16, 1, 0.3, 1) 0.2s;
    }
    .connect-tl.visible .connect-tl-track-fill {
        height: 100%;
    }
    .connect-tl-track-pulse {
        left: -1px;
        top: -20%;
        width: 4px;
        height: 20%;
        background: linear-gradient(180deg, transparent 0%, #58af6c 50%, #11998e 85%, transparent 100%);
        animation: connect-tl-signal-vert 4.2s cubic-bezier(0.4, 0, 0.2, 1) 1.2s infinite;
    }
    @keyframes connect-tl-signal-vert {
        0%   { top: -20%; opacity: 0; }
        10%  { opacity: 1; }
        90%  { opacity: 1; }
        100% { top: 100%; opacity: 0; }
    }
    .connect-tl-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    .connect-tl-step {
        display: grid;
        grid-template-columns: 48px 1fr;
        gap: 1.25rem;
        align-items: start;
    }
    .connect-tl-node-row {
        flex-direction: column;
        align-items: center;
        margin-bottom: 0;
        padding-right: 0;
    }
}

/* ════════════════════════════════════════════════
   ENHANCED ARCHITECTURAL FOOTER
════════════════════════════════════════════════ */
.footer {
    background: #0b0d14;
    padding: clamp(75px, 9vw, 115px) 0 38px;
    position: relative;
    overflow: hidden;
    color: rgba(255, 255, 255, 0.75);
}
.ftr-top-bar {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent 0%, var(--green) 30%, var(--green2) 70%, transparent 100%);
    opacity: 0.75;
}
.ftr-grid-bg {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.022) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.022) 1px, transparent 1px);
    background-size: 56px 56px;
    pointer-events: none;
    z-index: 0;
}
.ftr-glow {
    position: absolute;
    width: 650px;
    height: 650px;
    top: -280px;
    right: -140px;
    background: radial-gradient(circle, rgba(88, 175, 108, 0.07) 0%, rgba(17, 153, 142, 0.03) 40%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}
.ftr-watermark {
    position: absolute;
    bottom: -3%;
    left: 50%;
    transform: translateX(-50%);
    font-size: clamp(5rem, 15.5vw, 16rem);
    font-weight: 900;
    letter-spacing: -0.05em;
    line-height: 0.8;
    color: rgba(255, 255, 255, 0.018);
    text-transform: uppercase;
    white-space: nowrap;
    pointer-events: none;
    user-select: none;
    z-index: 0;
}

/* Brand Column */
.footer-logo {
    display: inline-block;
    text-decoration: none;
}
.footer-logo img {
    filter: brightness(0) invert(1);
    opacity: 0.94;
    transition: opacity 0.3s, transform 0.35s var(--expo);
}
.footer-logo:hover img {
    opacity: 1;
    transform: translateX(2px);
}
.ftr-tag {
    font-family: var(--mono);
    font-size: 0.6rem;
    letter-spacing: 2.2px;
    color: var(--green);
    margin-top: 1.35rem;
    margin-bottom: 0.9rem;
    text-transform: uppercase;
}
.ftr-desc {
    font-size: 0.86rem;
    font-weight: 300;
    line-height: 1.75;
    color: rgba(255, 255, 255, 0.46);
    max-width: 360px;
    margin-bottom: 1.6rem;
}
.ftr-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 6px 13px;
    background: rgba(255, 255, 255, 0.035);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 100px;
}
.ftr-status-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--green);
    box-shadow: 0 0 0 0 rgba(88, 175, 108, 0.6);
    animation: pulse-anim 2.5s infinite;
}
.ftr-status-txt {
    font-family: var(--mono);
    font-size: 0.54rem;
    letter-spacing: 2px;
    color: rgba(255, 255, 255, 0.62);
    text-transform: uppercase;
}

/* Column Headings & Links */
.ftr-head {
    font-family: var(--mono);
    font-size: 0.58rem;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.88);
    margin-bottom: 1.45rem;
}
.ftr-links {
    list-style: none;
    padding: 0;
    margin: 0;
}
.ftr-links li {
    margin-bottom: 0.72rem;
}
.ftr-links a {
    font-size: 0.86rem;
    font-weight: 300;
    color: rgba(255, 255, 255, 0.48);
    text-decoration: none;
    transition: color 0.25s, transform 0.25s var(--expo);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.ftr-links a:hover {
    color: #ffffff;
    transform: translateX(5px);
}
.ftr-links a::before {
    content: '';
    width: 0;
    height: 1px;
    background: var(--green);
    transition: width 0.25s var(--expo);
}
.ftr-links a:hover::before {
    width: 10px;
}

/* Direct Contact Coordinates */
.ftr-coord-list {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    margin-bottom: 1.5rem;
}
.ftr-coord-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.ftr-coord-lbl {
    font-family: var(--mono);
    font-size: 0.52rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.3);
}
.ftr-coord-val {
    font-size: 0.88rem;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.78);
    text-decoration: none;
    transition: color 0.25s;
}
.ftr-coord-val small {
    font-family: var(--mono);
    font-size: 0.62rem;
    color: rgba(255, 255, 255, 0.32);
    margin-left: 4px;
}
.ftr-coord-link:hover {
    color: var(--green);
}

/* Social & Quick Initiate Row */
.ftr-social-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding-top: 0.4rem;
}
.ftr-social-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 13px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    font-family: var(--mono);
    font-size: 0.6rem;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.78);
    text-decoration: none;
    transition: all 0.25s var(--expo);
}
.ftr-social-btn:hover {
    background: rgba(88, 175, 108, 0.14);
    border-color: rgba(88, 175, 108, 0.45);
    color: #ffffff;
    transform: translateY(-2px);
}
.ftr-social-arr {
    color: var(--green);
    font-size: 0.72rem;
}
.ftr-initiate-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--mono);
    font-size: 0.6rem;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--green);
    text-decoration: none;
    padding: 7px 4px;
    transition: color 0.25s, transform 0.25s var(--expo);
}
.ftr-initiate-link:hover {
    color: #ffffff;
    transform: translateX(3px);
}

/* Footer Bottom Bar */
.ftr-bottom {
    margin-top: clamp(50px, 6vw, 72px);
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    flex-wrap: wrap;
}
.ftr-bottom p {
    font-family: var(--mono);
    font-size: 0.58rem;
    letter-spacing: 1.5px;
    color: rgba(255, 255, 255, 0.36);
    text-transform: uppercase;
    margin: 0;
}
.ftr-bottom-center p {
    color: rgba(255, 255, 255, 0.28);
}
.ftr-top-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.65);
    font-family: var(--mono);
    font-size: 0.56rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    padding: 6px 12px;
    border-radius: 4px;
    transition: all 0.25s var(--expo);
}
.ftr-top-btn:hover {
    background: var(--grad);
    border-color: transparent;
    color: #ffffff;
    transform: translateY(-2px);
}
@media (max-width: 767px) {
    .ftr-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.85rem;
    }
}

/* ════════════════════════════════════════════════
   ABOUT HERO — TECH BLUEPRINT WATERCOLOR GRAPHIC & PROOF STRIP
════════════════════════════════════════════════ */
.about-nb-hero {
    position: relative;
    overflow: hidden;
}
.about-nb-hero .nb-hero-inner {
    position: relative;
    z-index: 2;
}
.about-hero-art {
    position: absolute;
    top: 50%;
    right: clamp(0%, 3vw, 5%);
    transform: translateY(-50%);
    width: clamp(380px, 46vw, 660px);
    pointer-events: none;
    user-select: none;
    z-index: 1;
    mix-blend-mode: multiply;
    opacity: 0;
    animation: about-art-reveal 1.3s var(--expo) 0.35s forwards;
    -webkit-mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
    mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
}
.about-hero-art img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    mix-blend-mode: multiply;
    filter: contrast(1.04);
}
@keyframes about-art-reveal {
    from {
        opacity: 0;
        transform: translateY(-47%) scale(0.97);
    }
    to {
        opacity: 0.92;
        transform: translateY(-50%) scale(1);
    }
}
@media (max-width: 1199px) {
    .about-hero-art {
        width: clamp(320px, 44vw, 500px);
        right: -2%;
    }
}
@media (max-width: 991px) {
    .about-hero-art {
        width: clamp(280px, 60vw, 420px);
        top: auto;
        bottom: -10px;
        right: -5%;
        transform: none;
        animation: about-art-reveal-mobile 1.3s var(--expo) 0.35s forwards;
    }
    @keyframes about-art-reveal-mobile {
        from { opacity: 0; }
        to   { opacity: 0.22; }
    }
}

/* About Hero Proof Strip */
.about-proof-strip {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.55rem 0.75rem;
    margin-top: 2rem;
    padding: 0.65rem 1.15rem;
    background: rgba(99, 102, 241, 0.045);
    border: 1px solid rgba(99, 102, 241, 0.14);
    border-radius: 6px;
    font-family: var(--mono);
    font-size: 0.64rem;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: rgba(43, 45, 66, 0.65);
    max-width: 640px;
}
.about-proof-highlight {
    color: var(--about-accent);
    font-weight: 600;
}
.about-proof-sep {
    color: rgba(99, 102, 241, 0.4);
}

/* ════════════════════════════════════════════════
   ABOUT SECTION 03 — UNIFIED OUR PHILOSOPHY
════════════════════════════════════════════════ */
.about-phil-eyebrow {
    display: inline-block;
    font-family: var(--mono);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 3.5px;
    text-transform: uppercase;
    color: var(--about-accent);
    margin-bottom: 1.75rem;
}
.about-phil-unified {
    font-size: clamp(1.5rem, 2.6vw, 2.35rem);
    font-weight: 300;
    line-height: 1.52;
    letter-spacing: -0.02em;
    color: var(--navy);
    margin: 0 auto;
    max-width: 960px;
}

/* ════════════════════════════════════════════════
   EXPERTISE PAGE (page-expertise.php)
   Scoped Palette: Solar Orange (#ea580c), Industrial Amber (#f59e0b) & Crimson Red (#dc2626)
════════════════════════════════════════════════ */
:root {
    --exp-main-accent:  #ea580c;
    --exp-main-amber:   #f59e0b;
    --exp-main-red:     #dc2626;
    --exp-main-grad:    linear-gradient(135deg, #dc2626 0%, #ea580c 52%, #f59e0b 100%);
    --exp-main-glow:    rgba(234, 88, 12, 0.25);
}

body.page-expertise {
    --green:      #ea580c !important;
    --green2:     #f59e0b !important;
    --grad:       linear-gradient(135deg, #dc2626 0%, #ea580c 52%, #f59e0b 100%) !important;
    --exp-accent: #ea580c !important;
    --exp-grad:   linear-gradient(135deg, #dc2626 0%, #ea580c 52%, #f59e0b 100%) !important;
}

body.page-expertise .cur-dot {
    background: var(--exp-main-accent) !important;
}
body.page-expertise .cur-ring {
    border-color: rgba(234, 88, 12, 0.45) !important;
}
body.page-expertise .cur-ring.hov {
    border-color: var(--exp-main-accent) !important;
}
body.page-expertise .scroll-progress {
    background: var(--exp-main-grad) !important;
}

/* Hero Pulse Beacon & Typography */
.exp-main-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
}
.exp-main-hero .nb-hero-inner {
    position: relative;
    z-index: 2;
}
.exp-main-hero .pulse-dot,
body.page-expertise .pulse-dot {
    background: var(--exp-main-accent) !important;
    box-shadow: 0 0 0 0 rgba(234, 88, 12, 0.6) !important;
    animation: exp-main-pulse 2.5s infinite !important;
}
@keyframes exp-main-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(234, 88, 12, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(234, 88, 12, 0); }
    100% { box-shadow: 0 0 0 0 rgba(234, 88, 12, 0); }
}
.exp-main-hero .hero-eyebrow .eyebrow-txt {
    color: var(--exp-main-accent) !important;
}
.exp-main-hero-sub {
    font-size: clamp(1rem, 1.55vw, 1.18rem) !important;
    font-weight: 300 !important;
    line-height: 1.78 !important;
    color: rgba(43, 45, 66, 0.72) !important;
    border-left: 2px solid var(--exp-main-accent) !important;
    padding-left: 1.4rem !important;
    max-width: 650px !important;
}
.exp-main-hero-sub strong {
    color: var(--navy) !important;
    font-weight: 600 !important;
}
.exp-main-grad-text {
    background: var(--exp-main-grad);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.exp-tag {
    color: var(--exp-main-accent) !important;
}

/* Right-Side Tech Blueprint Watercolor Illustration */
.expertise-hero-art {
    position: absolute;
    top: 50%;
    right: clamp(0%, 3vw, 5%);
    transform: translateY(-50%);
    width: clamp(380px, 46vw, 660px);
    pointer-events: none;
    user-select: none;
    z-index: 1;
    mix-blend-mode: multiply;
    opacity: 0;
    animation: about-art-reveal 1.3s var(--expo) 0.35s forwards;
    -webkit-mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
    mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
}
.expertise-hero-art img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    mix-blend-mode: multiply;
    filter: contrast(1.04);
}
@media (max-width: 1199px) {
    .expertise-hero-art {
        width: clamp(320px, 44vw, 500px);
        right: -2%;
    }
}
@media (max-width: 991px) {
    .expertise-hero-art {
        width: clamp(280px, 60vw, 420px);
        top: auto;
        bottom: -10px;
        right: -5%;
        transform: none;
        animation: about-art-reveal-mobile 1.3s var(--expo) 0.35s forwards;
    }
}

/* ── Sticky 5-Category Tabs Bar ── */
.exp-tabs-sticky {
    position: sticky;
    top: 68px;
    z-index: 60;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-top: 1px solid rgba(43, 45, 66, 0.08);
    border-bottom: 1px solid rgba(43, 45, 66, 0.08);
    box-shadow: 0 8px 30px rgba(15, 23, 42, 0.03);
}
.exp-tabs-nav {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
}
.exp-tab-btn {
    appearance: none;
    background: transparent;
    border: none;
    border-right: 1px solid rgba(43, 45, 66, 0.07);
    padding: 1.25rem 1.1rem;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    position: relative;
    transition: background 0.3s ease, color 0.3s ease;
    cursor: pointer;
}
.exp-tab-btn:first-child {
    border-left: 1px solid rgba(43, 45, 66, 0.07);
}
.exp-tab-btn::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 3px;
    background: var(--exp-main-grad);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.4s var(--expo);
}
.exp-tab-btn:hover {
    background: rgba(234, 88, 12, 0.03);
}
.exp-tab-btn.is-active {
    background: linear-gradient(180deg, rgba(234, 88, 12, 0.05) 0%, rgba(245, 158, 11, 0.015) 100%);
}
.exp-tab-btn.is-active::after {
    transform: scaleX(1);
}
.exp-tab-num {
    font-family: var(--mono);
    font-size: 0.62rem;
    font-weight: 600;
    letter-spacing: 2.5px;
    color: rgba(43, 45, 66, 0.38);
    transition: color 0.3s ease;
}
.exp-tab-btn:hover .exp-tab-num,
.exp-tab-btn.is-active .exp-tab-num {
    color: var(--exp-main-accent);
}
.exp-tab-label {
    font-size: 0.88rem;
    font-weight: 500;
    line-height: 1.32;
    color: rgba(43, 45, 66, 0.68);
    transition: color 0.3s ease;
}
.exp-tab-btn:hover .exp-tab-label,
.exp-tab-btn.is-active .exp-tab-label {
    color: var(--navy);
    font-weight: 600;
}

@media (max-width: 991px) {
    .exp-tabs-nav {
        display: flex;
        overflow-x: auto;
        scrollbar-width: none;
    }
    .exp-tabs-nav::-webkit-scrollbar {
        display: none;
    }
    .exp-tab-btn {
        flex: 0 0 230px;
        padding: 1rem 1rem;
    }
}

/* ── Tab Panel Transitions & Scoped Elements ── */
.exp-tab-panel {
    opacity: 0;
    transform: translateY(14px);
    transition: opacity 0.45s var(--expo), transform 0.45s var(--expo);
}
.exp-tab-panel.is-active {
    opacity: 1;
    transform: translateY(0);
}

/* Irregular Image Showcase in Solar Orange / Amber / Crimson */
.exp-main-img-backdrop {
    background: linear-gradient(135deg, rgba(220, 38, 38, 0.92) 0%, rgba(234, 88, 12, 0.88) 52%, rgba(245, 158, 11, 0.55) 100%) !important;
    filter: drop-shadow(0 25px 40px rgba(234, 88, 12, 0.28)) !important;
}
.exp-main-img-wrap:hover .exp-main-img-backdrop {
    filter: drop-shadow(0 32px 55px rgba(234, 88, 12, 0.42)) !important;
}
.exp-main-img-overlay {
    background: linear-gradient(180deg, rgba(234, 88, 12, 0.05) 0%, rgba(15, 23, 42, 0.36) 100%) !important;
}

/* Unboxed Capabilities Pillars in Orange / Amber */
.exp-pillar-item {
    border-left-color: rgba(234, 88, 12, 0.25) !important;
}
.exp-pillar-item:hover {
    border-left-color: var(--exp-main-accent) !important;
}
.exp-pillar-num {
    color: var(--exp-main-accent) !important;
}

/* Where It's Been Used Block */
.exp-used-block {
    margin-top: 2.5rem;
    padding-top: 1.6rem;
    border-top: 1px solid rgba(43, 45, 66, 0.1);
}
.exp-used-title {
    font-family: var(--mono);
    font-size: 0.66rem;
    font-weight: 600;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--exp-main-accent);
    margin-bottom: 0.65rem;
}
.exp-used-items {
    font-size: 0.94rem;
    font-weight: 400;
    line-height: 1.75;
    color: var(--navy);
    margin: 0;
}

/* Applied AI — How We Approach It List */
.exp-approach-list {
    display: flex;
    flex-direction: column;
    gap: 1.15rem;
    margin-top: 1.5rem;
}
.exp-approach-item {
    font-size: 0.95rem;
    font-weight: 300;
    line-height: 1.72;
    color: rgba(43, 45, 66, 0.78);
    padding-left: 1.15rem;
    border-left: 2px solid rgba(234, 88, 12, 0.35);
}
.exp-approach-item strong {
    color: var(--navy);
    font-weight: 600;
}

/* Bottom CTA Overrides for Expertise Page */
body.page-expertise .cta-super .hi {
    color: var(--exp-main-accent) !important;
}
.exp-main-btn-lab {
    background: var(--exp-main-grad) !important;
}
.exp-main-btn-lab:hover {
    box-shadow: 0 18px 36px rgba(234, 88, 12, 0.32) !important;
}

/* ════════════════════════════════════════════════
   GOVERNMENT, DEFENSE & RESEARCH PAGE (page-defense-government-research.php)
   Scoped Palette: Tactical Cyan (#0e7490) & Aerospace Azure (#06b6d4)
════════════════════════════════════════════════ */
body.page-defense {
    --green:      #0e7490 !important;
    --green2:     #06b6d4 !important;
    --grad:       linear-gradient(135deg, #0e7490 0%, #06b6d4 100%) !important;
    --sol-accent: #0e7490 !important;
    --sol-grad:   linear-gradient(135deg, #0e7490 0%, #06b6d4 100%) !important;
}
body.page-defense .cur-dot {
    background: #0e7490 !important;
}
body.page-defense .cur-ring {
    border-color: rgba(6, 182, 212, 0.45) !important;
}
body.page-defense .cur-ring.hov {
    border-color: #0e7490 !important;
}
body.page-defense .scroll-progress {
    background: linear-gradient(135deg, #0e7490 0%, #06b6d4 100%) !important;
}

.defense-nb-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
}
.defense-nb-hero .nb-hero-inner {
    position: relative;
    z-index: 2;
}
.defense-hero-title {
    font-size: clamp(2.6rem, 5.2vw, 4.6rem) !important;
    max-width: 720px;
}
.defense-hero-sub {
    font-size: clamp(1rem, 1.55vw, 1.18rem) !important;
    font-weight: 300 !important;
    line-height: 1.78 !important;
    color: rgba(43, 45, 66, 0.72) !important;
    border-left: 2px solid #0e7490 !important;
    padding-left: 1.4rem !important;
    max-width: 650px !important;
}
.defense-hero-sub strong {
    color: var(--navy) !important;
    font-weight: 600 !important;
}

/* Right-Side Defense Facility Blueprint Graphic */
.defense-hero-art {
    position: absolute;
    top: 50%;
    right: clamp(0%, 3vw, 5%);
    transform: translateY(-50%);
    width: clamp(380px, 46vw, 660px);
    pointer-events: none;
    user-select: none;
    z-index: 1;
    mix-blend-mode: multiply;
    opacity: 0;
    animation: about-art-reveal 1.3s var(--expo) 0.35s forwards;
    -webkit-mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
    mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
}
.defense-hero-art img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    mix-blend-mode: multiply;
    filter: contrast(1.04);
}
@media (max-width: 1199px) {
    .defense-hero-art {
        width: clamp(320px, 44vw, 500px);
        right: -2%;
    }
}
@media (max-width: 991px) {
    .defense-hero-art {
        width: clamp(280px, 60vw, 420px);
        top: auto;
        bottom: -10px;
        right: -5%;
        transform: none;
        animation: about-art-reveal-mobile 1.3s var(--expo) 0.35s forwards;
    }
}

/* Defense Selected Projects Unboxed List */
.defense-project-item {
    border-left-color: rgba(14, 116, 144, 0.25) !important;
}
.defense-project-item:hover {
    border-left-color: #0e7490 !important;
}
.defense-project-num {
    color: #0e7490 !important;
}

/* Defense Built-For & CTA */
.defense-built-section {
    background: var(--soft);
    border-bottom: 1px solid rgba(43, 45, 66, 0.06);
}
body.page-defense .cta-super .hi,
.sol-theme--defense .cta-super .hi {
    color: #0e7490 !important;
}
.defense-btn-lab {
    background: linear-gradient(135deg, #0e7490 0%, #06b6d4 100%) !important;
}
.defense-btn-lab:hover {
    box-shadow: 0 18px 36px rgba(14, 116, 144, 0.32) !important;
}

/* ════════════════════════════════════════════════
   FMCG, PACKAGING & PLASTICS PAGE (page-fmcg-packaging-plastics.php)
   Scoped Palette: Industrial Cobalt Blue (#1d4ed8) & Precision Azure (#3b82f6)
════════════════════════════════════════════════ */
.sol-theme--fmcg-cobalt {
    --sol-accent:   #1d4ed8;
    --sol-accent-2: #3b82f6;
    --sol-grad:     linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%);
    --sol-glow:     rgba(29, 78, 216, 0.25);
}
body.page-fmcg {
    --green:      #1d4ed8 !important;
    --green2:     #3b82f6 !important;
    --grad:       linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%) !important;
    --sol-accent: #1d4ed8 !important;
    --sol-grad:   linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%) !important;
}
body.page-fmcg .cur-dot {
    background: #1d4ed8 !important;
}
body.page-fmcg .cur-ring {
    border-color: rgba(59, 130, 246, 0.45) !important;
}
body.page-fmcg .cur-ring.hov {
    border-color: #1d4ed8 !important;
}
body.page-fmcg .scroll-progress {
    background: linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%) !important;
}
.sol-theme--fmcg-cobalt .hero-eyebrow .pulse-dot,
body.page-fmcg .pulse-dot {
    background: #2563eb !important;
    box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.55) !important;
    animation: fmcg-cobalt-pulse 2.5s infinite !important;
}
@keyframes fmcg-cobalt-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.55); }
    70%  { box-shadow: 0 0 0 10px rgba(37, 99, 235, 0); }
    100% { box-shadow: 0 0 0 0 rgba(37, 99, 235, 0); }
}
.sol-theme--fmcg-cobalt .hero-eyebrow .eyebrow-txt,
.sol-theme--fmcg-cobalt .section-tag {
    color: #1d4ed8;
}
.sol-theme--fmcg-cobalt .grad-text {
    background: linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.sol-theme--fmcg-cobalt .exp-img-backdrop {
    background: linear-gradient(135deg, rgba(29, 78, 216, 0.88) 0%, rgba(59, 130, 246, 0.72) 55%, rgba(96, 165, 250, 0.45) 100%);
    filter: drop-shadow(0 25px 40px rgba(29, 78, 216, 0.25));
}

.fmcg-nb-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
}
.fmcg-nb-hero .nb-hero-inner {
    position: relative;
    z-index: 2;
}
.fmcg-hero-title {
    font-size: clamp(2.6rem, 5.2vw, 4.6rem) !important;
    max-width: 720px;
}
.fmcg-hero-sub {
    font-size: clamp(1rem, 1.55vw, 1.18rem) !important;
    font-weight: 300 !important;
    line-height: 1.78 !important;
    color: rgba(43, 45, 66, 0.72) !important;
    border-left: 2px solid #1d4ed8 !important;
    padding-left: 1.4rem !important;
    max-width: 650px !important;
}
.fmcg-hero-sub strong {
    color: var(--navy) !important;
    font-weight: 600 !important;
}

/* Right-Side FMCG Production Conveyor Blueprint Graphic */
.fmcg-hero-art {
    position: absolute;
    top: 50%;
    right: clamp(0%, 3vw, 5%);
    transform: translateY(-50%);
    width: clamp(380px, 46vw, 660px);
    pointer-events: none;
    user-select: none;
    z-index: 1;
    mix-blend-mode: multiply;
    opacity: 0;
    animation: about-art-reveal 1.3s var(--expo) 0.35s forwards;
    -webkit-mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
    mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
}
.fmcg-hero-art img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    mix-blend-mode: multiply;
    filter: contrast(1.04);
}
@media (max-width: 1199px) {
    .fmcg-hero-art {
        width: clamp(320px, 44vw, 500px);
        right: -2%;
    }
}
@media (max-width: 991px) {
    .fmcg-hero-art {
        width: clamp(280px, 60vw, 420px);
        top: auto;
        bottom: -10px;
        right: -5%;
        transform: none;
        animation: about-art-reveal-mobile 1.3s var(--expo) 0.35s forwards;
    }
}

/* FMCG Selected Projects Unboxed List */
.fmcg-project-item {
    border-left-color: rgba(29, 78, 216, 0.25) !important;
}
.fmcg-project-item:hover {
    border-left-color: #1d4ed8 !important;
}
.fmcg-project-num {
    color: #1d4ed8 !important;
}

body.page-fmcg .cta-super .hi,
.sol-theme--fmcg-cobalt .cta-super .hi {
    color: #1d4ed8 !important;
}
.fmcg-btn-lab {
    background: linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%) !important;
}
.fmcg-btn-lab:hover {
    box-shadow: 0 18px 36px rgba(29, 78, 216, 0.32) !important;
}

/* ════════════════════════════════════════════════
   AUTOMOTIVE & PRECISION COMPONENTS PAGE (page-automotive-precision-components.php)
   Scoped Palette: Automotive Signal Crimson (#be123c) & Racing Rose-Red (#e11d48)
════════════════════════════════════════════════ */
.sol-theme--auto-crimson {
    --sol-accent:   #be123c;
    --sol-accent-2: #e11d48;
    --sol-grad:     linear-gradient(135deg, #be123c 0%, #e11d48 100%);
    --sol-glow:     rgba(190, 18, 60, 0.25);
}
body.page-automotive {
    --green:      #be123c !important;
    --green2:     #e11d48 !important;
    --grad:       linear-gradient(135deg, #be123c 0%, #e11d48 100%) !important;
    --sol-accent: #be123c !important;
    --sol-grad:   linear-gradient(135deg, #be123c 0%, #e11d48 100%) !important;
}
body.page-automotive .cur-dot {
    background: #be123c !important;
}
body.page-automotive .cur-ring {
    border-color: rgba(225, 29, 72, 0.45) !important;
}
body.page-automotive .cur-ring.hov {
    border-color: #be123c !important;
}
body.page-automotive .scroll-progress {
    background: linear-gradient(135deg, #be123c 0%, #e11d48 100%) !important;
}
.sol-theme--auto-crimson .hero-eyebrow .pulse-dot,
body.page-automotive .pulse-dot {
    background: #e11d48 !important;
    box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.55) !important;
    animation: auto-crimson-pulse 2.5s infinite !important;
}
@keyframes auto-crimson-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.55); }
    70%  { box-shadow: 0 0 0 10px rgba(225, 29, 72, 0); }
    100% { box-shadow: 0 0 0 0 rgba(225, 29, 72, 0); }
}
.sol-theme--auto-crimson .hero-eyebrow .eyebrow-txt,
.sol-theme--auto-crimson .section-tag {
    color: #be123c;
}
.sol-theme--auto-crimson .grad-text {
    background: linear-gradient(135deg, #be123c 0%, #e11d48 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.sol-theme--auto-crimson .exp-img-backdrop {
    background: linear-gradient(135deg, rgba(190, 18, 60, 0.88) 0%, rgba(225, 29, 72, 0.72) 55%, rgba(244, 63, 94, 0.45) 100%);
    filter: drop-shadow(0 25px 40px rgba(190, 18, 60, 0.25));
}

.automotive-nb-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
}
.automotive-nb-hero .nb-hero-inner {
    position: relative;
    z-index: 2;
}
.automotive-hero-title {
    font-size: clamp(2.6rem, 5.2vw, 4.6rem) !important;
    max-width: 720px;
}
.automotive-hero-sub {
    font-size: clamp(1rem, 1.55vw, 1.18rem) !important;
    font-weight: 300 !important;
    line-height: 1.78 !important;
    color: rgba(43, 45, 66, 0.72) !important;
    border-left: 2px solid #be123c !important;
    padding-left: 1.4rem !important;
    max-width: 650px !important;
}
.automotive-hero-sub strong {
    color: var(--navy) !important;
    font-weight: 600 !important;
}

/* Right-Side Automotive Parts & Sensors Blueprint Graphic */
.automotive-hero-art {
    position: absolute;
    top: 50%;
    right: clamp(0%, 3vw, 5%);
    transform: translateY(-50%);
    width: clamp(380px, 46vw, 660px);
    pointer-events: none;
    user-select: none;
    z-index: 1;
    mix-blend-mode: multiply;
    opacity: 0;
    animation: about-art-reveal 1.3s var(--expo) 0.35s forwards;
    -webkit-mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
    mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
}
.automotive-hero-art img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    mix-blend-mode: multiply;
    filter: contrast(1.04);
}
@media (max-width: 1199px) {
    .automotive-hero-art {
        width: clamp(320px, 44vw, 500px);
        right: -2%;
    }
}
@media (max-width: 991px) {
    .automotive-hero-art {
        width: clamp(280px, 60vw, 420px);
        top: auto;
        bottom: -10px;
        right: -5%;
        transform: none;
        animation: about-art-reveal-mobile 1.3s var(--expo) 0.35s forwards;
    }
}

/* Automotive Selected Projects Unboxed List */
.automotive-project-item {
    border-left-color: rgba(190, 18, 60, 0.25) !important;
}
.automotive-project-item:hover {
    border-left-color: #be123c !important;
}
.automotive-project-num {
    color: #be123c !important;
}

body.page-automotive .cta-super .hi,
.sol-theme--auto-crimson .cta-super .hi {
    color: #be123c !important;
}
.automotive-btn-lab {
    background: linear-gradient(135deg, #be123c 0%, #e11d48 100%) !important;
}
.automotive-btn-lab:hover {
    box-shadow: 0 18px 36px rgba(190, 18, 60, 0.32) !important;
}

/* ════════════════════════════════════════════════
   PROCESS & HEAVY MANUFACTURING PAGE (page-process-heavy-manufacturing.php)
   Scoped Palette: Industrial Copper-Bronze (#b45309) & Amber-Gold (#d97706)
════════════════════════════════════════════════ */
.sol-theme--process-bronze {
    --sol-accent:   #b45309;
    --sol-accent-2: #d97706;
    --sol-grad:     linear-gradient(135deg, #b45309 0%, #d97706 100%);
    --sol-glow:     rgba(180, 83, 9, 0.25);
}
body.page-process-heavy {
    --green:      #b45309 !important;
    --green2:     #d97706 !important;
    --grad:       linear-gradient(135deg, #b45309 0%, #d97706 100%) !important;
    --sol-accent: #b45309 !important;
    --sol-grad:   linear-gradient(135deg, #b45309 0%, #d97706 100%) !important;
}
body.page-process-heavy .cur-dot {
    background: #b45309 !important;
}
body.page-process-heavy .cur-ring {
    border-color: rgba(217, 119, 6, 0.45) !important;
}
body.page-process-heavy .cur-ring.hov {
    border-color: #b45309 !important;
}
body.page-process-heavy .scroll-progress {
    background: linear-gradient(135deg, #b45309 0%, #d97706 100%) !important;
}
.sol-theme--process-bronze .hero-eyebrow .pulse-dot,
body.page-process-heavy .pulse-dot {
    background: #d97706 !important;
    box-shadow: 0 0 0 0 rgba(217, 119, 6, 0.55) !important;
    animation: process-bronze-pulse 2.5s infinite !important;
}
@keyframes process-bronze-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(217, 119, 6, 0.55); }
    70%  { box-shadow: 0 0 0 10px rgba(217, 119, 6, 0); }
    100% { box-shadow: 0 0 0 0 rgba(217, 119, 6, 0); }
}
.sol-theme--process-bronze .hero-eyebrow .eyebrow-txt,
.sol-theme--process-bronze .section-tag {
    color: #b45309;
}
.sol-theme--process-bronze .grad-text {
    background: linear-gradient(135deg, #b45309 0%, #d97706 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.sol-theme--process-bronze .exp-img-backdrop {
    background: linear-gradient(135deg, rgba(180, 83, 9, 0.88) 0%, rgba(217, 119, 6, 0.72) 55%, rgba(245, 158, 11, 0.45) 100%);
    filter: drop-shadow(0 25px 40px rgba(180, 83, 9, 0.25));
}

.process-nb-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
}
.process-nb-hero .nb-hero-inner {
    position: relative;
    z-index: 2;
}
.process-hero-title {
    font-size: clamp(2.6rem, 5.2vw, 4.6rem) !important;
    max-width: 720px;
}
.process-hero-sub {
    font-size: clamp(1rem, 1.55vw, 1.18rem) !important;
    font-weight: 300 !important;
    line-height: 1.78 !important;
    color: rgba(43, 45, 66, 0.72) !important;
    border-left: 2px solid #b45309 !important;
    padding-left: 1.4rem !important;
    max-width: 650px !important;
}
.process-hero-sub strong {
    color: var(--navy) !important;
    font-weight: 600 !important;
}

/* Right-Side Process & Heavy Manufacturing Blueprint Graphic */
.process-hero-art {
    position: absolute;
    top: 50%;
    right: clamp(0%, 3vw, 5%);
    transform: translateY(-50%);
    width: clamp(380px, 46vw, 660px);
    pointer-events: none;
    user-select: none;
    z-index: 1;
    mix-blend-mode: multiply;
    opacity: 0;
    animation: about-art-reveal 1.3s var(--expo) 0.35s forwards;
    -webkit-mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
    mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
}
.process-hero-art img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    mix-blend-mode: multiply;
    filter: contrast(1.04);
}
@media (max-width: 1199px) {
    .process-hero-art {
        width: clamp(320px, 44vw, 500px);
        right: -2%;
    }
}
@media (max-width: 991px) {
    .process-hero-art {
        width: clamp(280px, 60vw, 420px);
        top: auto;
        bottom: -10px;
        right: -5%;
        transform: none;
        animation: about-art-reveal-mobile 1.3s var(--expo) 0.35s forwards;
    }
}

/* Process Selected Projects Unboxed List */
.process-project-item {
    border-left-color: rgba(180, 83, 9, 0.25) !important;
}
.process-project-item:hover {
    border-left-color: #b45309 !important;
}
.process-project-num {
    color: #b45309 !important;
}

body.page-process-heavy .cta-super .hi,
.sol-theme--process-bronze .cta-super .hi {
    color: #b45309 !important;
}
.process-btn-lab {
    background: linear-gradient(135deg, #b45309 0%, #d97706 100%) !important;
}
.process-btn-lab:hover {
    box-shadow: 0 18px 36px rgba(180, 83, 9, 0.32) !important;
}

/* ════════════════════════════════════════════════
   SOLUTION 1: TEST & MEASUREMENT AUTOMATION PAGE (page-test-measurement-automation.php)
   Scoped Palette: Robodeus Emerald (#58af6c) & Calibration Teal (#11998e)
════════════════════════════════════════════════ */
.tma-nb-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
}
.tma-nb-hero .nb-hero-inner {
    position: relative;
    z-index: 2;
}
.tma-hero-title {
    font-size: clamp(2.6rem, 5.2vw, 4.6rem) !important;
    max-width: 720px;
}
.tma-hero-sub {
    font-size: clamp(1rem, 1.55vw, 1.18rem) !important;
    font-weight: 300 !important;
    line-height: 1.78 !important;
    color: rgba(43, 45, 66, 0.72) !important;
    border-left: 2px solid #58af6c !important;
    padding-left: 1.4rem !important;
    max-width: 650px !important;
}
.tma-hero-sub strong {
    color: var(--navy) !important;
    font-weight: 600 !important;
}

/* Right-Side Test & Measurement Automation Blueprint Graphic */
.tma-hero-art {
    position: absolute;
    top: 50%;
    right: clamp(0%, 3vw, 5%);
    transform: translateY(-50%);
    width: clamp(380px, 46vw, 660px);
    pointer-events: none;
    user-select: none;
    z-index: 1;
    mix-blend-mode: multiply;
    opacity: 0;
    animation: about-art-reveal 1.3s var(--expo) 0.35s forwards;
    -webkit-mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
    mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
}
.tma-hero-art img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    mix-blend-mode: multiply;
    filter: contrast(1.04);
}
@media (max-width: 1199px) {
    .tma-hero-art {
        width: clamp(320px, 44vw, 500px);
        right: -2%;
    }
}
@media (max-width: 991px) {
    .tma-hero-art {
        width: clamp(280px, 60vw, 420px);
        top: auto;
        bottom: -10px;
        right: -5%;
        transform: none;
        animation: about-art-reveal-mobile 1.3s var(--expo) 0.35s forwards;
    }
}

/* ════════════════════════════════════════════════
   SOLUTION 2: PRODUCTION MONITORING & TRACEABILITY PAGE (page-production-monitoring-traceability.php)
   Scoped Palette: Electric Cerulean (#0284c7) & Cyber Cyan (#00d2ff)
════════════════════════════════════════════════ */
.pmt-nb-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
}
.pmt-nb-hero .nb-hero-inner {
    position: relative;
    z-index: 2;
}
.pmt-hero-title {
    font-size: clamp(2.6rem, 5.2vw, 4.6rem) !important;
    max-width: 720px;
}
.pmt-hero-sub {
    font-size: clamp(1rem, 1.55vw, 1.18rem) !important;
    font-weight: 300 !important;
    line-height: 1.78 !important;
    color: rgba(43, 45, 66, 0.72) !important;
    border-left: 2px solid #0284c7 !important;
    padding-left: 1.4rem !important;
    max-width: 650px !important;
}
.pmt-hero-sub strong {
    color: var(--navy) !important;
    font-weight: 600 !important;
}

/* Right-Side Production Monitoring & Barcode Tracing Blueprint Graphic */
.pmt-hero-art {
    position: absolute;
    top: 50%;
    right: clamp(0%, 3vw, 5%);
    transform: translateY(-50%);
    width: clamp(380px, 46vw, 660px);
    pointer-events: none;
    user-select: none;
    z-index: 1;
    mix-blend-mode: multiply;
    opacity: 0;
    animation: about-art-reveal 1.3s var(--expo) 0.35s forwards;
    -webkit-mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
    mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
}
.pmt-hero-art img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    mix-blend-mode: multiply;
    filter: contrast(1.04);
}
@media (max-width: 1199px) {
    .pmt-hero-art {
        width: clamp(320px, 44vw, 500px);
        right: -2%;
    }
}
@media (max-width: 991px) {
    .pmt-hero-art {
        width: clamp(280px, 60vw, 420px);
        top: auto;
        bottom: -10px;
        right: -5%;
        transform: none;
        animation: about-art-reveal-mobile 1.3s var(--expo) 0.35s forwards;
    }
}
body.page-traceability .cta-super .hi,
.sol-theme--traceability .cta-super .hi {
    color: #0284c7 !important;
}
.pmt-btn-lab {
    background: linear-gradient(135deg, #0284c7 0%, #00d2ff 100%) !important;
}
.pmt-btn-lab:hover {
    box-shadow: 0 18px 36px rgba(2, 132, 199, 0.32) !important;
}

/* ════════════════════════════════════════════════
   SOLUTION 3: ENVIRONMENTAL & GAS INSTRUMENTATION PAGE (page-environmental-gas-instrumentation.php)
   Scoped Palette: Safety Field Flame (#ea580c -> #fb923c)
════════════════════════════════════════════════ */
.env-nb-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
}
.env-nb-hero .nb-hero-inner {
    position: relative;
    z-index: 2;
}
.env-hero-title {
    font-size: clamp(2.6rem, 5.2vw, 4.6rem) !important;
    max-width: 720px;
}
.env-hero-sub {
    font-size: clamp(1rem, 1.55vw, 1.18rem) !important;
    font-weight: 300 !important;
    line-height: 1.78 !important;
    color: rgba(43, 45, 66, 0.72) !important;
    border-left: 2px solid #ea580c !important;
    padding-left: 1.4rem !important;
    max-width: 650px !important;
}
.env-hero-sub strong {
    color: var(--navy) !important;
    font-weight: 600 !important;
}

/* Right-Side Environmental, Pollution & Gas Instrumentation Blueprint Graphic */
.env-hero-art {
    position: absolute;
    top: 50%;
    right: clamp(0%, 3vw, 5%);
    transform: translateY(-50%);
    width: clamp(380px, 46vw, 660px);
    pointer-events: none;
    user-select: none;
    z-index: 1;
    mix-blend-mode: multiply;
    opacity: 0;
    animation: about-art-reveal 1.3s var(--expo) 0.35s forwards;
    -webkit-mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
    mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
}
.env-hero-art img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    mix-blend-mode: multiply;
    filter: contrast(1.04);
}
@media (max-width: 1199px) {
    .env-hero-art {
        width: clamp(320px, 44vw, 500px);
        right: -2%;
    }
}
@media (max-width: 991px) {
    .env-hero-art {
        width: clamp(280px, 60vw, 420px);
        top: auto;
        bottom: -10px;
        right: -5%;
        transform: none;
        animation: about-art-reveal-mobile 1.3s var(--expo) 0.35s forwards;
    }
}
body.page-environmental .cta-super .hi,
.sol-theme--environmental .cta-super .hi {
    color: #ea580c !important;
}
.env-btn-lab {
    background: linear-gradient(135deg, #ea580c 0%, #fb923c 100%) !important;
}
.env-btn-lab:hover {
    box-shadow: 0 18px 36px rgba(234, 88, 12, 0.32) !important;
}

/* ════════════════════════════════════════════════
   SOLUTION 4: DATA ACQUISITION, LOGGERS & TELEMETRY PAGE (page-data-acquisition-loggers-telemetry.php)
   Scoped Palette: High-Frequency Violet (#7c3aed -> #a855f7)
════════════════════════════════════════════════ */
.daq-nb-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
}
.daq-nb-hero .nb-hero-inner {
    position: relative;
    z-index: 2;
}
.daq-hero-title {
    font-size: clamp(2.6rem, 5.2vw, 4.6rem) !important;
    max-width: 740px;
}
.daq-hero-sub {
    font-size: clamp(1rem, 1.55vw, 1.18rem) !important;
    font-weight: 300 !important;
    line-height: 1.78 !important;
    color: rgba(43, 45, 66, 0.72) !important;
    border-left: 2px solid #7c3aed !important;
    padding-left: 1.4rem !important;
    max-width: 650px !important;
}
.daq-hero-sub strong {
    color: var(--navy) !important;
    font-weight: 600 !important;
}

/* Right-Side Data Acquisition, Loggers & Telemetry Blueprint Graphic */
.daq-hero-art {
    position: absolute;
    top: 50%;
    right: clamp(0%, 3vw, 5%);
    transform: translateY(-50%);
    width: clamp(380px, 46vw, 660px);
    pointer-events: none;
    user-select: none;
    z-index: 1;
    mix-blend-mode: multiply;
    opacity: 0;
    animation: about-art-reveal 1.3s var(--expo) 0.35s forwards;
    -webkit-mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
    mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
}
.daq-hero-art img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    mix-blend-mode: multiply;
    filter: contrast(1.04);
}
@media (max-width: 1199px) {
    .daq-hero-art {
        width: clamp(320px, 44vw, 500px);
        right: -2%;
    }
}
@media (max-width: 991px) {
    .daq-hero-art {
        width: clamp(280px, 60vw, 420px);
        top: auto;
        bottom: -10px;
        right: -5%;
        transform: none;
        animation: about-art-reveal-mobile 1.3s var(--expo) 0.35s forwards;
    }
}
body.page-telemetry .cta-super .hi,
.sol-theme--telemetry .cta-super .hi,
.sol-theme--daq .cta-super .hi {
    color: #7c3aed !important;
}
.daq-btn-lab {
    background: linear-gradient(135deg, #7c3aed 0%, #a855f7 100%) !important;
}
.daq-btn-lab:hover {
    box-shadow: 0 18px 36px rgba(124, 58, 237, 0.32) !important;
}

/* ════════════════════════════════════════════════
   SOLUTION 5: EDGE VISION & ACCESS SYSTEMS PAGE (page-edge-vision-access-systems.php)
   Scoped Palette: Neural Cyber Ruby (#e11d48 -> #fb7185)
════════════════════════════════════════════════ */
.vis-nb-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
}
.vis-nb-hero .nb-hero-inner {
    position: relative;
    z-index: 2;
}
.vis-hero-title {
    font-size: clamp(2.6rem, 5.2vw, 4.6rem) !important;
    max-width: 740px;
}
.vis-hero-sub {
    font-size: clamp(1rem, 1.55vw, 1.18rem) !important;
    font-weight: 300 !important;
    line-height: 1.78 !important;
    color: rgba(43, 45, 66, 0.72) !important;
    border-left: 2px solid #e11d48 !important;
    padding-left: 1.4rem !important;
    max-width: 650px !important;
}
.vis-hero-sub strong {
    color: var(--navy) !important;
    font-weight: 600 !important;
}

/* Right-Side Edge Vision & Access Systems Blueprint Graphic */
.vis-hero-art {
    position: absolute;
    top: 50%;
    right: clamp(0%, 3vw, 5%);
    transform: translateY(-50%);
    width: clamp(380px, 46vw, 660px);
    pointer-events: none;
    user-select: none;
    z-index: 1;
    mix-blend-mode: multiply;
    opacity: 0;
    animation: about-art-reveal 1.3s var(--expo) 0.35s forwards;
    -webkit-mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
    mask-image: radial-gradient(ellipse 86% 84% at 56% 50%, #000 55%, rgba(0,0,0,0.5) 78%, transparent 100%);
}
.vis-hero-art img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    mix-blend-mode: multiply;
    filter: contrast(1.04);
}
@media (max-width: 1199px) {
    .vis-hero-art {
        width: clamp(320px, 44vw, 500px);
        right: -2%;
    }
}
@media (max-width: 991px) {
    .vis-hero-art {
        width: clamp(280px, 60vw, 420px);
        top: auto;
        bottom: -10px;
        right: -5%;
        transform: none;
        animation: about-art-reveal-mobile 1.3s var(--expo) 0.35s forwards;
    }
}
body.page-vision .cta-super .hi,
.sol-theme--vision .cta-super .hi,
.sol-theme--access .cta-super .hi {
    color: #e11d48 !important;
}
.vis-btn-lab {
    background: linear-gradient(135deg, #e11d48 0%, #fb7185 100%) !important;
}
.vis-btn-lab:hover {
    box-shadow: 0 18px 36px rgba(225, 29, 72, 0.32) !important;
}

/* ════════════════════════════════════════════════
   HOMEPAGE (front-page.php) REFINED LIGHT-THEME STYLING
════════════════════════════════════════════════ */
.home-nb-hero {
    background: var(--white);
    position: relative;
    overflow: hidden;
    padding-top: clamp(140px, 16vw, 190px);
    padding-bottom: clamp(60px, 8vw, 100px);
    border-bottom: 1px solid rgba(43, 45, 66, 0.06);
}
.home-nb-hero .nb-hero-inner {
    position: relative;
    z-index: 2;
}
.home-hero-title {
    font-size: clamp(2.4rem, 4.8vw, 4.2rem) !important;
    line-height: 1.12 !important;
    letter-spacing: -0.035em !important;
    font-weight: 300 !important;
    max-width: 780px;
    margin-bottom: 1.8rem;
    color: var(--navy);
}
.home-hero-title strong,
.home-hero-title b {
    font-weight: 600;
}
.home-hero-sub {
    font-size: clamp(1rem, 1.4vw, 1.15rem) !important;
    font-weight: 300 !important;
    line-height: 1.8 !important;
    color: rgba(43, 45, 66, 0.72) !important;
    border-left: 2px solid var(--green) !important;
    padding-left: 1.4rem !important;
    max-width: 640px !important;
    margin-bottom: 2.2rem;
}
.home-hero-sub strong {
    color: var(--navy);
    font-weight: 600;
}

/* Right-side technical blueprint illustration */
.home-hero-art {
    position: absolute;
    top: 50%;
    right: clamp(-2%, 2vw, 4%);
    transform: translateY(-50%);
    width: clamp(440px, 50vw, 760px);
    pointer-events: none;
    user-select: none;
    z-index: 1;
    mix-blend-mode: multiply;
    opacity: 0;
    animation: about-art-reveal 1.3s var(--expo) 0.35s forwards;
    -webkit-mask-image: radial-gradient(ellipse 90% 86% at 55% 50%, #000 60%, rgba(0,0,0,0.4) 82%, transparent 100%);
    mask-image: radial-gradient(ellipse 90% 86% at 55% 50%, #000 60%, rgba(0,0,0,0.4) 82%, transparent 100%);
}
.home-hero-art img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    mix-blend-mode: multiply;
    filter: contrast(1.04);
}
@media (max-width: 1199px) {
    .home-hero-art {
        width: clamp(360px, 46vw, 560px);
        right: -3%;
    }
}
@media (max-width: 991px) {
    .home-hero-art {
        position: relative;
        width: 100%;
        max-width: 540px;
        margin: 2.5rem auto 0;
        top: auto;
        right: auto;
        transform: none;
        animation: about-art-reveal-mobile 1.3s var(--expo) 0.35s forwards;
    }
}

.hero-secondary-btn:hover {
    border-color: var(--navy) !important;
    background: rgba(43, 45, 66, 0.04);
    transform: translateY(-2px);
}
@media (max-width: 767px) {
    .hero-proof-strip {
        font-size: 0.7rem !important;
        gap: 0.5rem !important;
    }
}

/* Light-themed sections */
.home-light-section {
    padding: clamp(80px, 10vw, 130px) 0;
    position: relative;
}
.home-light-section--soft {
    background: var(--soft);
}
.home-light-section--white {
    background: var(--white);
}

/* Clean, crisp light cards for Field Systems */
.home-fs-card {
    background: var(--white);
    border: 1px solid rgba(43, 45, 66, 0.08);
    padding: 2.2rem 2.4rem;
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.4s var(--expo);
}
.home-fs-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 0; height: 3px;
    background: var(--grad);
    transition: width 0.4s var(--expo);
}
.home-fs-card:hover {
    border-color: rgba(88, 175, 108, 0.35);
    transform: translateY(-5px);
    box-shadow: 0 16px 36px rgba(43, 45, 66, 0.06);
}
.home-fs-card:hover::before {
    width: 100%;
}
.home-fs-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.4rem;
}
.home-fs-idx {
    font-family: var(--mono);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 2px;
    color: var(--green);
}
.home-fs-tag {
    font-family: var(--mono);
    font-size: 0.65rem;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 3px 8px;
    background: rgba(43, 45, 66, 0.04);
    color: rgba(43, 45, 66, 0.6);
    border-radius: 2px;
}
.home-fs-title {
    font-size: 1.35rem;
    font-weight: 600;
    color: var(--navy);
    line-height: 1.3;
    margin-bottom: 0.9rem;
    letter-spacing: -0.3px;
}
.home-fs-desc {
    font-size: 0.94rem;
    line-height: 1.7;
    color: rgba(43, 45, 66, 0.7);
    margin-bottom: 1.6rem;
}
.home-fs-link {
    font-family: var(--mono);
    font-size: 0.7rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--navy);
    font-weight: 600;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: color 0.2s, transform 0.2s;
}
.home-fs-card:hover .home-fs-link {
    color: var(--green);
    transform: translateX(4px);
}

/* Why Teams Work With Us — Crisp Light Cards */
.home-why-item {
    display: flex;
    gap: 1.4rem;
    padding: 1.6rem 0;
    border-bottom: 1px solid rgba(43, 45, 66, 0.08);
}
.home-why-item:last-child {
    border-bottom: none;
}
.home-why-num {
    font-family: var(--mono);
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--green);
    min-width: 28px;
    padding-top: 2px;
}
.home-why-title {
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 0.35rem;
    line-height: 1.35;
}
.home-why-text {
    font-size: 0.92rem;
    line-height: 1.65;
    color: rgba(43, 45, 66, 0.7);
    margin: 0;
}

/* How We Work 4-Step Process Box */
.home-step-box {
    background: var(--white);
    border: 1px solid rgba(43, 45, 66, 0.08);
    padding: 2rem 2.2rem;
    position: relative;
    height: 100%;
    transition: all 0.3s var(--expo);
}
.home-step-box:hover {
    border-color: rgba(88, 175, 108, 0.4);
    box-shadow: 0 12px 28px rgba(43, 45, 66, 0.05);
}
.home-step-num {
    font-family: var(--mono);
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--green);
    letter-spacing: 2px;
    margin-bottom: 0.8rem;
}
.home-step-title {
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 0.5rem;
}
.home-step-desc {
    font-size: 0.9rem;
    line-height: 1.65;
    color: rgba(43, 45, 66, 0.7);
    margin: 0;
}

/* ════════════════════════════════════════════════
   PROJECTS CUSTOM POST TYPE STYLES (single-project.php & archive-project.php)
════════════════════════════════════════════════ */

/* Solution Category Badges / Pills */
.proj-sol-badge,
.proj-card-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--mono);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 5px 12px;
    border-radius: 999px;
    background: rgba(43, 45, 66, 0.05);
    color: var(--navy);
    border: 1px solid rgba(43, 45, 66, 0.1);
    transition: all 0.25s ease;
}
.proj-sol-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

/* Category-specific color accents matching Solutions */
.proj-sol-badge--test-measurement-automation,
.proj-card-badge--test-measurement-automation {
    background: rgba(88, 175, 108, 0.08);
    color: #1b873f;
    border-color: rgba(88, 175, 108, 0.25);
}
.proj-sol-badge--production-monitoring-traceability,
.proj-card-badge--production-monitoring-traceability {
    background: rgba(2, 132, 199, 0.08);
    color: #0284c7;
    border-color: rgba(2, 132, 199, 0.25);
}
.proj-sol-badge--environmental-gas-instrumentation,
.proj-card-badge--environmental-gas-instrumentation {
    background: rgba(234, 88, 12, 0.08);
    color: #ea580c;
    border-color: rgba(234, 88, 12, 0.25);
}
.proj-sol-badge--data-acquisition-loggers-telemetry,
.proj-card-badge--data-acquisition-loggers-telemetry {
    background: rgba(124, 58, 237, 0.08);
    color: #7c3aed;
    border-color: rgba(124, 58, 237, 0.25);
}
.proj-sol-badge--edge-vision-access-systems,
.proj-card-badge--edge-vision-access-systems {
    background: rgba(225, 29, 72, 0.08);
    color: #e11d48;
    border-color: rgba(225, 29, 72, 0.25);
}

/* ────────────────────────────────────────────────
   SINGLE PROJECT WRITEUP (single-project.php)
──────────────────────────────────────────────── */
.project-hero-header {
    background: var(--white);
    padding-top: clamp(120px, 14vw, 160px);
    padding-bottom: clamp(40px, 6vw, 70px);
    border-bottom: 1px solid rgba(43, 45, 66, 0.06);
    position: relative;
}
.project-header-top-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1.2rem;
    margin-bottom: 1.8rem;
}
.project-back-link {
    font-family: var(--mono);
    font-size: 0.72rem;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: rgba(43, 45, 66, 0.6);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: color 0.2s, transform 0.2s;
}
.project-back-link:hover {
    color: var(--green);
    transform: translateX(-3px);
}
.project-solution-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.project-hero-title {
    font-size: clamp(2.4rem, 4.8vw, 4.2rem);
    font-weight: 300;
    line-height: 1.12;
    letter-spacing: -0.035em;
    color: var(--navy);
    max-width: 960px;
    margin-bottom: 1.2rem;
}
.project-hero-lead {
    font-size: clamp(1.1rem, 1.5vw, 1.28rem);
    font-weight: 300;
    line-height: 1.75;
    color: rgba(43, 45, 66, 0.76);
    max-width: 860px;
    margin-bottom: 2.5rem;
}

/* Prominent Featured Image in Header */
.project-featured-showcase {
    margin-bottom: 2.8rem;
}
.project-featured-frame {
    position: relative;
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid rgba(43, 45, 66, 0.1);
    box-shadow: 0 24px 60px rgba(43, 45, 66, 0.08);
    background: #000;
}
.project-featured-img {
    width: 100%;
    height: auto;
    max-height: 720px;
    object-fit: cover;
    display: block;
}
.project-featured-tag {
    position: absolute;
    top: 16px;
    right: 16px;
    background: rgba(15, 23, 42, 0.75);
    backdrop-filter: blur(8px);
    color: #ffffff;
    font-family: var(--mono);
    font-size: 0.65rem;
    letter-spacing: 2px;
    padding: 6px 14px;
    border-radius: 2px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    pointer-events: none;
}
.project-featured-caption {
    font-family: var(--mono);
    font-size: 0.74rem;
    color: rgba(43, 45, 66, 0.6);
    margin-top: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.project-caption-bullet {
    color: var(--green);
    font-size: 1rem;
}

/* Quick Specs Card */
.project-specs-card {
    background: var(--soft);
    border: 1px solid rgba(43, 45, 66, 0.08);
    border-radius: 4px;
    padding: 2rem 2.4rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1.6rem;
}
.project-spec-col {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.project-spec-col--full {
    grid-column: 1 / -1;
    border-top: 1px dashed rgba(43, 45, 66, 0.12);
    padding-top: 1.2rem;
}
.project-spec-lbl {
    font-family: var(--mono);
    font-size: 0.66rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: rgba(43, 45, 66, 0.5);
}
.project-spec-val {
    font-size: 1rem;
    font-weight: 600;
    color: var(--navy);
}

/* Project Details Section */
.project-content-section {
    padding: clamp(60px, 8vw, 110px) 0;
    background: var(--white);
}
.project-highlights-panel {
    background: #f8fafc;
    border: 1px solid rgba(43, 45, 66, 0.08);
    border-left: 4px solid var(--green);
    padding: 2.2rem 2.6rem;
    margin-bottom: 3.5rem;
    border-radius: 4px;
    box-shadow: 0 10px 30px rgba(43, 45, 66, 0.03);
}
.project-highlights-badge {
    font-family: var(--mono);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 2px;
    color: var(--green);
    display: block;
    margin-bottom: 4px;
}
.project-highlights-heading {
    font-size: 1.35rem;
    font-weight: 600;
    color: var(--navy);
    margin: 0 0 1.4rem;
}
.project-highlights-grid {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.project-highlight-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 0.98rem;
    line-height: 1.6;
    color: rgba(43, 45, 66, 0.85);
}
.project-highlight-check {
    color: var(--green);
    font-weight: 900;
    font-size: 1.1rem;
    line-height: 1;
    margin-top: 2px;
}

/* Project Body Content Typography */
.project-article-body {
    font-size: 1.08rem;
    line-height: 1.85;
    color: rgba(43, 45, 66, 0.85);
}
.project-article-body h2 {
    font-size: 1.8rem;
    font-weight: 600;
    color: var(--navy);
    margin-top: 3rem;
    margin-bottom: 1.2rem;
    letter-spacing: -0.02em;
}
.project-article-body h3 {
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--navy);
    margin-top: 2.4rem;
    margin-bottom: 1rem;
}
.project-article-body p {
    margin-bottom: 1.6rem;
}
.project-article-body img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    margin: 2.2rem 0;
    border: 1px solid rgba(43, 45, 66, 0.08);
}
.project-article-body blockquote {
    border-left: 3px solid var(--green);
    padding: 1.2rem 1.8rem;
    margin: 2.5rem 0;
    background: var(--soft);
    font-style: italic;
    color: var(--navy);
}
.project-tags-bar {
    margin-top: 3.5rem;
    padding-top: 1.8rem;
    border-top: 1px dashed rgba(43, 45, 66, 0.12);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.project-tags-heading {
    font-family: var(--mono);
    font-size: 0.7rem;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: rgba(43, 45, 66, 0.5);
    margin-right: 6px;
}
.project-tag-pill {
    font-family: var(--mono);
    font-size: 0.68rem;
    padding: 4px 10px;
    background: var(--soft);
    border: 1px solid rgba(43, 45, 66, 0.1);
    color: rgba(43, 45, 66, 0.7);
    border-radius: 2px;
}

/* Prev / Next Project Navigation */
.project-nav-section {
    padding: 2.5rem 0;
    border-top: 1px solid rgba(43, 45, 66, 0.06);
    background: var(--soft);
}
.project-nav-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
}
.project-nav-btn {
    padding: 1.8rem 2.2rem;
    background: var(--white);
    border: 1px solid rgba(43, 45, 66, 0.08);
    border-radius: 4px;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    gap: 6px;
    transition: all 0.3s var(--expo);
}
.project-nav-btn:hover {
    border-color: rgba(88, 175, 108, 0.4);
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(43, 45, 66, 0.05);
}
.project-nav-btn--next {
    text-align: right;
}
.project-nav-hint {
    font-family: var(--mono);
    font-size: 0.68rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--green);
}
.project-nav-name {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--navy);
}

@media (max-width: 767px) {
    .project-nav-row {
        grid-template-columns: 1fr;
    }
}

/* ────────────────────────────────────────────────
   PROJECT ARCHIVE / LISTING (archive-project.php)
──────────────────────────────────────────────── */
.proj-archive-hero {
    background: var(--white);
    border-bottom: 1px solid rgba(43, 45, 66, 0.06);
}
.proj-archive-title {
    font-size: clamp(2.4rem, 4.8vw, 4.2rem) !important;
}
.proj-archive-sub {
    max-width: 680px !important;
}

/* Filter Bar */
.proj-filter-section {
    padding: 1.8rem 0;
    background: var(--white);
    border-bottom: 1px solid rgba(43, 45, 66, 0.06);
    position: sticky;
    top: 72px;
    z-index: 10;
}
.proj-filter-bar {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}
.proj-filter-label {
    font-family: var(--mono);
    font-size: 0.72rem;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: rgba(43, 45, 66, 0.5);
}
.proj-filter-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.proj-filter-btn {
    font-family: var(--mono);
    font-size: 0.7rem;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    padding: 6px 14px;
    background: var(--soft);
    border: 1px solid rgba(43, 45, 66, 0.1);
    color: rgba(43, 45, 66, 0.75);
    border-radius: 999px;
    cursor: pointer;
    transition: all 0.2s ease;
}
.proj-filter-btn:hover {
    background: rgba(43, 45, 66, 0.08);
    color: var(--navy);
}
.proj-filter-btn.is-active {
    background: var(--navy);
    color: #ffffff;
    border-color: var(--navy);
}
.proj-filter-count {
    opacity: 0.6;
    margin-left: 3px;
}

/* Projects Grid */
.proj-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
    gap: 2rem;
}
.proj-card {
    background: var(--white);
    border: 1px solid rgba(43, 45, 66, 0.08);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: all 0.4s var(--expo);
    position: relative;
}
.proj-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 0; height: 3px;
    background: var(--grad);
    transition: width 0.4s var(--expo);
    z-index: 2;
}
.proj-card:hover {
    border-color: rgba(88, 175, 108, 0.35);
    transform: translateY(-6px);
    box-shadow: 0 18px 40px rgba(43, 45, 66, 0.07);
}
.proj-card:hover::before {
    width: 100%;
}
.proj-card-media {
    position: relative;
    width: 100%;
    height: 220px;
    background: #eef2f5;
    overflow: hidden;
}
.proj-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s var(--expo);
}
.proj-card:hover .proj-card-img {
    transform: scale(1.04);
}
.proj-card-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(43, 45, 66, 0.3);
}
.proj-card-badges {
    position: absolute;
    bottom: 12px;
    left: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    z-index: 1;
}
.proj-card-content {
    padding: 1.8rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.proj-card-meta {
    font-family: var(--mono);
    font-size: 0.68rem;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: rgba(43, 45, 66, 0.55);
    margin-bottom: 0.75rem;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}
.proj-card-title {
    font-size: 1.35rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.3px;
    margin-bottom: 0.8rem;
}
.proj-card-title a {
    color: var(--navy);
    text-decoration: none;
    transition: color 0.2s;
}
.proj-card-title a:hover {
    color: var(--green);
}
.proj-card-desc {
    font-size: 0.92rem;
    line-height: 1.65;
    color: rgba(43, 45, 66, 0.72);
    margin-bottom: 1.4rem;
    flex-grow: 1;
}
.proj-card-deliverables {
    font-family: var(--mono);
    font-size: 0.72rem;
    color: rgba(43, 45, 66, 0.6);
    padding: 8px 12px;
    background: var(--soft);
    border-radius: 2px;
    margin-bottom: 1.4rem;
}
.proj-card-deliv-label {
    font-weight: 700;
    color: var(--navy);
}
.proj-card-foot {
    border-top: 1px solid rgba(43, 45, 66, 0.06);
    padding-top: 1.2rem;
    margin-top: auto;
}
.proj-card-link {
    font-family: var(--mono);
    font-size: 0.72rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--navy);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s;
}
.proj-card:hover .proj-card-link {
    color: var(--green);
    transform: translateX(4px);
}

/* Empty State */
.proj-empty-state {
    text-align: center;
    padding: 5rem 2rem;
    background: var(--white);
    border: 1px dashed rgba(43, 45, 66, 0.15);
    max-width: 640px;
    margin: 0 auto;
}
.proj-empty-icon {
    color: rgba(43, 45, 66, 0.35);
    margin-bottom: 1.2rem;
}
.proj-empty-title {
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 0.8rem;
}
.proj-empty-desc {
    font-size: 0.96rem;
    line-height: 1.7;
    color: rgba(43, 45, 66, 0.7);
    margin: 0 auto 1.5rem;
    max-width: 520px;
}

@media (max-width: 767px) {
    .proj-cards-grid {
        grid-template-columns: 1fr;
    }
    .proj-pagination-grid {
        grid-template-columns: 1fr;
    }
}
