/* SitesMechanix Knowledge Core — RC96 approved public library */
body.smx-kc-library-page{background:#061915!important;color:#f2fff9!important;overflow-x:hidden}
body.smx-kc-library-page #main,body.smx-kc-library-page #content,body.smx-kc-library-page .fusion-row,body.smx-kc-library-page .fusion-layout-column,body.smx-kc-library-page .fusion-column-wrapper{background:transparent!important}
body.smx-kc-library-page main.smx-kc-library{position:relative;isolation:isolate;max-width:none!important;width:100%!important;margin:0!important;padding:0!important;background:#061915!important;color:#f2fff9!important;font-family:system-ui,-apple-system,"Segoe UI",sans-serif}
.smx96-shell{position:relative;min-height:100vh;overflow:hidden;background:radial-gradient(circle at 72% 30%,rgba(0,255,177,.12),transparent 25%),linear-gradient(180deg,#020a08 0%,#041611 45%,#061d18 100%);border-top:1px solid rgba(74,255,199,.18);box-shadow:inset 0 0 120px rgba(0,255,185,.035)}
.smx96-shell:before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(0,255,180,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(0,255,180,.045) 1px,transparent 1px);background-size:46px 46px;mask-image:linear-gradient(to bottom,#000,transparent 95%);animation:smx96-grid 20s linear infinite}
.smx96-shell:after{content:"";position:absolute;inset:-20%;z-index:-2;background:radial-gradient(circle at 15% 30%,rgba(0,255,188,.12),transparent 16%),radial-gradient(circle at 82% 25%,rgba(0,255,188,.16),transparent 20%),radial-gradient(circle at 50% 80%,rgba(0,255,188,.08),transparent 22%);animation:smx96-pulse 6s ease-in-out infinite}
.smx96-tech-grid{position:absolute;inset:0;pointer-events:none;z-index:0;opacity:.7}.smx96-tech-grid i{position:absolute;width:5px;height:5px;border-radius:50%;background:#42ffc4;box-shadow:0 0 14px #42ffc4,0 0 30px rgba(66,255,196,.45);animation:smx96-node 3.4s ease-in-out infinite}.smx96-tech-grid i:nth-child(1){left:8%;top:18%}.smx96-tech-grid i:nth-child(2){left:28%;top:8%;animation-delay:.8s}.smx96-tech-grid i:nth-child(3){left:54%;top:16%;animation-delay:1.5s}.smx96-tech-grid i:nth-child(4){left:86%;top:22%;animation-delay:.4s}.smx96-tech-grid i:nth-child(5){left:18%;top:62%;animation-delay:1.1s}.smx96-tech-grid i:nth-child(6){left:68%;top:64%;animation-delay:2s}.smx96-tech-grid i:nth-child(7){left:92%;top:78%;animation-delay:1.7s}
.smx96-topbar{position:relative;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:30px;padding:24px clamp(24px,5vw,76px);border-bottom:1px solid rgba(69,255,201,.13);background:rgba(1,10,8,.55);backdrop-filter:blur(12px)}
.smx96-brand{display:flex;align-items:center;gap:13px;min-width:250px}.smx96-brand-mark{display:grid;place-items:center;width:48px;height:48px;border:1px solid #32ffc0;border-radius:15px;color:#7affd8;font-weight:900;box-shadow:0 0 22px rgba(50,255,192,.25);background:linear-gradient(145deg,#0d3229,#04130f)}.smx96-brand b{display:block;color:#f5fffb;letter-spacing:.08em;font-size:17px}.smx96-brand em{display:block;color:#2fffb7;font-style:normal;letter-spacing:.25em;font-size:10px;margin-top:4px}.smx96-topbar nav{display:flex;gap:34px;align-items:center}.smx96-topbar nav a{color:#e7fff6!important;text-decoration:none!important;font-size:14px;font-weight:600;letter-spacing:.03em;position:relative;padding:13px 0}.smx96-topbar nav a:hover,.smx96-topbar nav a.is-active{color:#45ffc4!important}.smx96-topbar nav a.is-active:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:#45ffc4;box-shadow:0 0 12px #45ffc4}.smx96-jaxis-chip{border:1px solid rgba(63,255,198,.35);border-radius:24px;padding:11px 17px;color:#f4fffb;background:rgba(5,28,22,.72);white-space:nowrap}.smx96-jaxis-chip span{color:#43ffc3;margin-right:7px}.smx96-jaxis-chip b{color:#42ffc4;margin-left:10px}
.smx96-hero{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(430px,1.05fr);align-items:center;min-height:650px;padding:62px clamp(28px,5vw,82px) 72px;max-width:1500px;margin:auto}.smx96-hero-copy{position:relative;z-index:3;max-width:680px}.smx96-kicker,.smx96-section-head>div>span{color:#45ffc4;letter-spacing:.22em;font-size:11px;font-weight:800}.smx96-hero h1{font-size:clamp(58px,6vw,100px);line-height:.94;letter-spacing:-.045em;margin:20px 0 28px;color:#f4fffb!important;font-weight:800}.smx96-hero h1 span{display:block;color:#39ffb8!important;text-shadow:0 0 25px rgba(57,255,184,.14)}.smx96-hero h1 b{display:block;color:#fff!important;font-weight:800}.smx96-hero p{font-size:18px;line-height:1.7;color:#d8eee7!important;max-width:650px;margin:0 0 34px}.smx96-search label{display:block;color:#47ffc4!important;font-size:11px;font-weight:800;letter-spacing:.16em;margin-bottom:11px}.smx96-search>div{display:flex;max-width:720px}.smx96-search input{height:64px!important;flex:1;border:1px solid #31ffc0!important;background:#03120f!important;color:#f6fffb!important;border-radius:12px 0 0 12px!important;padding:0 22px!important;font-size:16px!important;box-shadow:inset 0 0 30px rgba(0,255,180,.03)!important}.smx96-search input::placeholder{color:#8ea9a2!important}.smx96-search button{height:64px;border:1px solid #42ffc4!important;background:linear-gradient(135deg,#25d99f,#55ffc9)!important;color:#02110d!important;border-radius:0 12px 12px 0!important;padding:0 27px!important;font-weight:900;font-size:16px;box-shadow:0 0 25px rgba(44,255,190,.22)}.smx96-search button b{margin-left:10px;font-size:20px}
.smx96-book-stage{position:relative;height:550px;display:grid;place-items:center;perspective:1000px}.smx96-book{position:relative;width:min(690px,100%);z-index:3;filter:drop-shadow(0 25px 45px rgba(0,255,183,.2));animation:smx96-bookfloat 5s ease-in-out infinite}.smx96-book img{display:block;width:100%;height:auto;mix-blend-mode:screen;opacity:.98}.smx96-page{position:absolute;left:48%;top:27%;width:28%;height:39%;border-radius:8% 45% 14% 42%;border:1px solid rgba(173,255,231,.55);background:linear-gradient(110deg,rgba(236,255,250,.08),rgba(44,255,190,.16));transform-origin:left center;box-shadow:0 0 18px rgba(43,255,191,.25);mix-blend-mode:screen}.smx96-page.page-one{animation:smx96-pageone 6.8s ease-in-out infinite}.smx96-page.page-two{left:50%;top:29%;height:35%;animation:smx96-pagetwo 6.8s ease-in-out infinite 1.1s}.smx96-orb{position:absolute;z-index:4;bottom:76px;left:50%;width:82px;height:82px;transform:translateX(-50%);border-radius:50%;border:2px solid #43ffc4;background:radial-gradient(circle,#b9ffe8 0 4%,#0effae 8%,#063d30 35%,#01110d 68%);box-shadow:0 0 18px #43ffc4,0 0 65px rgba(0,255,183,.4);animation:smx96-orb 3s ease-in-out infinite}.smx96-orb i{position:absolute;inset:-15px;border:1px solid rgba(67,255,196,.5);border-radius:50%;animation:smx96-spin 5s linear infinite}.smx96-ring{position:absolute;z-index:1;left:50%;bottom:52px;transform:translateX(-50%);border:1px solid rgba(66,255,196,.42);border-radius:50%;width:170px;height:70px;box-shadow:0 0 20px rgba(66,255,196,.12);animation:smx96-ring 4.2s ease-out infinite}.smx96-ring.ring-b{animation-delay:1.35s}.smx96-ring.ring-c{animation-delay:2.7s}.smx96-scanline{position:absolute;inset:18% 8% 8%;border:1px solid rgba(66,255,196,.1);border-radius:50%;animation:smx96-scan 5s ease-in-out infinite}
.smx96-latest{position:relative;z-index:3;max-width:1400px;margin:auto;padding:30px clamp(28px,5vw,82px) 80px}.smx96-section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:26px}.smx96-section-head h2{margin:8px 0 0!important;color:#f6fffb!important;font-size:42px;letter-spacing:-.03em}.smx96-status{font-size:10px;color:#8fead1;letter-spacing:.16em}.smx96-status i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#45ffc4;box-shadow:0 0 10px #45ffc4;margin-right:8px;animation:smx96-node 1.8s ease-in-out infinite}
.smx96-topics{display:grid;grid-template-columns:repeat(6,1fr);gap:13px;margin-bottom:25px}.smx96-topic-card{min-height:175px;padding:22px 16px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;text-decoration:none!important;color:#f6fffb!important;border:1px solid rgba(52,255,192,.38);background:linear-gradient(180deg,rgba(4,29,23,.94),rgba(1,12,9,.95));clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px);box-shadow:inset 0 0 35px rgba(0,255,182,.05),0 0 15px rgba(0,255,182,.03);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}.smx96-topic-card:hover{transform:translateY(-5px);border-color:#45ffc4;box-shadow:0 0 24px rgba(69,255,196,.18),inset 0 0 30px rgba(69,255,196,.08)}.smx96-topic-icon{display:grid;place-items:center;width:55px;height:55px;border:1px solid #39ffc0;border-radius:50%;color:#46ffc5;font-size:27px;box-shadow:0 0 18px rgba(69,255,196,.16);margin-bottom:15px}.smx96-topic-card strong{font-size:16px}.smx96-topic-card small{color:#a9c9c0!important;margin-top:9px}.smx96-topic-card small b{color:#45ffc4}.smx96-articles{margin-top:10px}.smx96-articles .smx-kc-card{background:#071b16!important;border:1px solid rgba(64,255,196,.24)!important;color:#effff8!important}.smx96-articles .smx-kc-card *{color:inherit}.smx96-empty{min-height:170px;display:flex;align-items:center;gap:24px;padding:28px 34px;border:1px solid rgba(60,255,195,.28);background:linear-gradient(100deg,#061d17,#03100d);box-shadow:inset 0 0 40px rgba(0,255,184,.04)}.smx96-empty-book{display:grid;place-items:center;width:78px;height:78px;border:1px solid #43ffc4;border-radius:18px;color:#45ffc4;font-size:38px;box-shadow:0 0 24px rgba(69,255,196,.16);animation:smx96-bookglow 3s ease-in-out infinite}.smx96-empty strong{display:block;color:#48ffc5!important;font-size:21px}.smx96-empty p{color:#d6eee7!important;margin:8px 0 0}.smx96-prompt{display:flex;align-items:center;gap:18px;margin-top:25px;padding:20px 24px;border:1px solid rgba(61,255,195,.25);background:rgba(2,19,14,.8)}.smx96-prompt-icon{display:grid;place-items:center;width:44px;height:44px;border:1px solid #45ffc4;border-radius:50%;color:#45ffc4}.smx96-prompt strong{color:#48ffc5}.smx96-prompt p{margin:4px 0 0;color:#b8d5cd!important}.smx96-prompt a{margin-left:auto;color:#eafff7!important;border:1px solid #2cbb91;padding:11px 16px;text-decoration:none!important}
.smx96-jaxis{position:relative;z-index:4;max-width:1400px;margin:0 auto 80px;padding:22px 28px;display:flex;align-items:center;gap:24px;border:1px solid rgba(57,255,193,.35);border-radius:20px;background:linear-gradient(90deg,#03120f,#05261e,#03120f);box-shadow:inset 0 0 35px rgba(0,255,181,.06)}.smx96-jaxis-id{min-width:260px}.smx96-jaxis-id strong{display:inline-grid;place-items:center;width:64px;height:64px;border:1px solid #43ffc4;border-radius:50%;color:#45ffc4;box-shadow:0 0 18px rgba(69,255,196,.18);margin-right:15px}.smx96-jaxis-id span{color:#f3fffa}.smx96-jaxis-id small{display:block;color:#45ffc4;margin:5px 0 0 80px}.smx96-wave{height:58px;flex:1;display:flex;align-items:center;justify-content:center;gap:4px}.smx96-wave i{display:block;width:4px;height:12px;border-radius:3px;background:#43ffc4;box-shadow:0 0 8px rgba(67,255,196,.5);animation:smx96-wave 1.05s ease-in-out infinite var(--d)}.smx96-mute{width:42px;height:42px;border-radius:50%;border:1px solid rgba(69,255,196,.35);background:transparent;color:#dffef4}.smx96-jaxis.is-muted .smx96-wave i{animation-play-state:paused;opacity:.35}
@keyframes smx96-grid{to{background-position:46px 46px}}@keyframes smx96-pulse{0%,100%{opacity:.55;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}@keyframes smx96-node{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.35)}}@keyframes smx96-bookfloat{0%,100%{transform:translateY(0) rotateX(0)}50%{transform:translateY(-9px) rotateX(1deg)}}@keyframes smx96-pageone{0%,100%{transform:rotateY(0deg) skewY(0)}45%{transform:rotateY(-28deg) skewY(-2deg)}65%{transform:rotateY(5deg) skewY(1deg)}}@keyframes smx96-pagetwo{0%,100%{transform:rotateY(0)}48%{transform:rotateY(25deg)}70%{transform:rotateY(-4deg)}}@keyframes smx96-orb{0%,100%{box-shadow:0 0 18px #43ffc4,0 0 55px rgba(0,255,183,.3);transform:translateX(-50%) scale(1)}50%{box-shadow:0 0 28px #43ffc4,0 0 90px rgba(0,255,183,.5);transform:translateX(-50%) scale(1.08)}}@keyframes smx96-spin{to{transform:rotate(360deg)}}@keyframes smx96-ring{0%{width:130px;height:48px;opacity:.7}100%{width:560px;height:190px;opacity:0}}@keyframes smx96-scan{0%,100%{opacity:.2;transform:scale(.95)}50%{opacity:.7;transform:scale(1)}}@keyframes smx96-wave{0%,100%{height:10px;opacity:.55}25%{height:32px;opacity:.9}50%{height:54px;opacity:1}75%{height:22px;opacity:.8}}@keyframes smx96-bookglow{0%,100%{box-shadow:0 0 15px rgba(69,255,196,.1)}50%{box-shadow:0 0 30px rgba(69,255,196,.28)}}
@media(max-width:1100px){.smx96-topbar nav{gap:15px}.smx96-topics{grid-template-columns:repeat(3,1fr)}.smx96-hero{grid-template-columns:1fr}.smx96-book-stage{height:430px;order:-1}.smx96-hero-copy{max-width:850px}.smx96-hero h1{font-size:72px}.smx96-jaxis{margin-left:24px;margin-right:24px}}
@media(max-width:700px){.smx96-topbar{padding:15px 18px}.smx96-topbar nav{display:none}.smx96-brand{min-width:0}.smx96-jaxis-chip{display:none}.smx96-hero{padding:45px 20px}.smx96-hero h1{font-size:54px}.smx96-hero p{font-size:15px}.smx96-book-stage{height:300px}.smx96-book{width:125%}.smx96-topics{grid-template-columns:repeat(2,1fr)}.smx96-section-head{display:block}.smx96-status{margin-top:12px}.smx96-jaxis{margin:0 18px 50px;padding:18px;display:block}.smx96-wave{margin:14px 0}.smx96-jaxis-id small{margin-left:0}.smx96-prompt{align-items:flex-start;flex-wrap:wrap}.smx96-prompt a{margin-left:0}}
@media(prefers-reduced-motion:reduce){.smx96-shell:before,.smx96-shell:after,.smx96-tech-grid i,.smx96-book,.smx96-page,.smx96-orb,.smx96-orb i,.smx96-ring,.smx96-scanline,.smx96-status i,.smx96-empty-book,.smx96-wave i{animation:none!important}}


/* =========================================================
   RC102 — ORIGINAL DESIGN HERO VIDEO INTEGRATION
   ========================================================= */

.smx-rc102-video-stage{
    position:absolute;
    z-index:2;
    overflow:hidden;
    pointer-events:none;

    width:56%;
    height:100%;

    right:0;
    top:0;

    border:0;
    background:#001b16;

    isolation:isolate;
}

.smx-rc102-video{
    position:absolute;
    inset:0;

    width:100%;
    height:100%;

    object-fit:cover;
    object-position:center;

    display:block;

    opacity:.94;

    filter:
        saturate(1.08)
        contrast(1.03)
        brightness(.82);

    transform:scale(1.015);
}

.smx-rc102-video-veil{
    position:absolute;
    inset:0;
    z-index:2;

    pointer-events:none;

    background:
        linear-gradient(
            90deg,
            rgba(0,20,16,.98) 0%,
            rgba(0,20,16,.72) 13%,
            rgba(0,20,16,.18) 34%,
            rgba(0,20,16,.02) 60%,
            rgba(0,20,16,.18) 100%
        ),
        linear-gradient(
            180deg,
            rgba(0,25,20,.28),
            transparent 35%,
            rgba(0,15,12,.24)
        );
}

.smx-rc102-orb{
    position:absolute;
    z-index:5;

    left:50%;
    bottom:4%;

    width:72px;
    height:72px;

    transform:translateX(-50%);

    border-radius:50%;

    background:
        radial-gradient(
            circle at 50% 46%,
            #d7fff4 0%,
            #21ffc0 10%,
            #00bd8c 34%,
            #006b55 58%,
            #00291f 78%,
            transparent 79%
        );

    box-shadow:
        0 0 14px rgba(33,255,192,.9),
        0 0 34px rgba(0,255,190,.65),
        0 0 70px rgba(0,255,190,.28);

    animation:smx-rc102-orb-pulse 3.2s ease-in-out infinite;
}

.smx-rc102-ring{
    position:absolute;
    z-index:4;

    left:50%;
    bottom:1%;

    border:1px solid rgba(33,255,192,.75);

    border-radius:50%;

    transform:
        translateX(-50%)
        scale(.55);

    opacity:0;

    animation:
        smx-rc102-ring-expand
        4.2s ease-out infinite;
}

.smx-rc102-ring-1{
    width:110px;
    height:32px;
}

.smx-rc102-ring-2{
    width:220px;
    height:62px;
    animation-delay:1.4s;
}

.smx-rc102-ring-3{
    width:340px;
    height:94px;
    animation-delay:2.8s;
}

@keyframes smx-rc102-orb-pulse{

    0%,100%{
        transform:
            translateX(-50%)
            scale(.96);
    }

    50%{
        transform:
            translateX(-50%)
            scale(1.07);
    }
}

@keyframes smx-rc102-ring-expand{

    0%{
        opacity:.72;

        transform:
            translateX(-50%)
            scale(.55);
    }

    72%{
        opacity:.16;
    }

    100%{
        opacity:0;

        transform:
            translateX(-50%)
            scale(1.25);
    }
}


/* =========================================================
   JAXIS SPEECH WAVE
   ========================================================= */

.smx-rc102-wave{
    position:absolute;

    left:38%;
    right:12%;

    top:50%;

    height:42px;

    transform:translateY(-50%);

    display:flex;
    align-items:center;
    justify-content:center;

    gap:3px;

    pointer-events:none;
}

.smx-rc102-wave i{
    display:block;

    width:3px;

    min-height:5px;

    height:
        var(--smx-wave-height);

    border-radius:4px;

    background:#21ffc0;

    box-shadow:
        0 0 7px rgba(0,255,190,.65);

    transform-origin:center;

    animation:
        smx-rc102-speech
        .82s
        ease-in-out
        infinite alternate;

    animation-delay:
        var(--smx-wave-delay);
}

@keyframes smx-rc102-speech{

    0%{
        transform:scaleY(.18);
        opacity:.42;
    }

    28%{
        transform:scaleY(.65);
        opacity:.72;
    }

    55%{
        transform:scaleY(1);
        opacity:1;
    }

    78%{
        transform:scaleY(.42);
        opacity:.68;
    }

    100%{
        transform:scaleY(.78);
        opacity:.92;
    }
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width:900px){

    .smx-rc102-video-stage{
        position:relative;

        width:100%;
        height:360px;

        right:auto;
        top:auto;

        margin-top:24px;
    }

    .smx-rc102-wave{
        left:30%;
        right:8%;
    }
}

@media (prefers-reduced-motion:reduce){

    .smx-rc102-orb,
    .smx-rc102-ring,
    .smx-rc102-wave i{
        animation:none!important;
    }

    .smx-rc102-video{
        animation:none!important;
    }
}


/* =========================================================
   RC103 — REMOVE ARTIFICIAL ORB/RING OVERLAY
   The approved video already contains its own book,
   energy source and circular wave artwork.
   ========================================================= */

.smx-rc102-orb,
.smx-rc102-ring,
.smx-rc102-ring-1,
.smx-rc102-ring-2,
.smx-rc102-ring-3,
.smx97-orb,
.smx97-ring,
.smx97-ring.r1,
.smx97-ring.r2,
.smx97-ring.r3{
    display:none!important;
}

/* =========================================================
   SitesMechanix Knowledge Core — RC105
   Original RC96 hero geometry adapted to current markup.
   Video replaces the original book artwork.
   No artificial orb/rings.
   ========================================================= */

body.smx-kc-library-page{
    background:#061915!important;
    color:#f2fff9!important;
    overflow-x:hidden;
}

body.smx-kc-library-page #main,
body.smx-kc-library-page #content,
body.smx-kc-library-page .fusion-row,
body.smx-kc-library-page .fusion-layout-column,
body.smx-kc-library-page .fusion-column-wrapper{
    background:transparent!important;
}

body.smx-kc-library-page main.smx-kc-library{
    position:relative;
    isolation:isolate;
    max-width:none!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:
        radial-gradient(circle at 78% 25%,rgba(0,255,177,.10),transparent 24%),
        linear-gradient(180deg,#020a08 0%,#041611 48%,#061d18 100%)!important;
    color:#f2fff9!important;
    font-family:system-ui,-apple-system,"Segoe UI",sans-serif;
}

/* HERO */

.smx-kc-hero{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(430px,1.05fr);
    align-items:center;
    min-height:650px;
    padding:62px clamp(28px,5vw,82px) 72px;
    max-width:1500px;
    margin:auto;
    overflow:hidden;
}

/* Existing text remains the left column */

.smx-kc-kicker{
    color:#45ffc4!important;
    letter-spacing:.22em;
    font-size:11px;
    font-weight:800;
    margin-bottom:20px;
}

.smx-kc-hero h1{
    font-size:clamp(58px,6vw,100px)!important;
    line-height:.94!important;
    letter-spacing:-.045em!important;
    margin:0 0 28px!important;
    color:#f4fffb!important;
    font-weight:800!important;
    max-width:680px;
}

/*
 * Make the existing single text node behave like
 * the original three-line headline.
 */
.smx-kc-hero h1{
    max-width:650px;
}

/* Description */

.smx-kc-hero > p{
    font-size:18px!important;
    line-height:1.7!important;
    color:#d8eee7!important;
    max-width:650px;
    margin:0 0 34px!important;
}

/* Search */

.smx-kc-search{
    position:relative;
    z-index:5;
}

.smx-kc-search label{
    display:block;
    color:#47ffc4!important;
    font-size:11px!important;
    font-weight:800!important;
    letter-spacing:.16em;
    margin-bottom:11px;
}

.smx-kc-search > div{
    display:flex;
    max-width:720px;
}

.smx-kc-search input{
    height:64px!important;
    flex:1;
    border:1px solid #31ffc0!important;
    background:#03120f!important;
    color:#f6fffb!important;
    border-radius:12px 0 0 12px!important;
    padding:0 22px!important;
    font-size:16px!important;
    box-shadow:inset 0 0 30px rgba(0,255,180,.03)!important;
}

.smx-kc-search input::placeholder{
    color:#8ea9a2!important;
}

.smx-kc-search button{
    height:64px!important;
    border:1px solid #42ffc4!important;
    background:linear-gradient(135deg,#25d99f,#55ffc9)!important;
    color:#02110d!important;
    border-radius:0 12px 12px 0!important;
    padding:0 27px!important;
    font-weight:900!important;
    font-size:16px!important;
    box-shadow:0 0 25px rgba(44,255,190,.22)!important;
}

/* =========================================================
   VIDEO — RIGHT SIDE OF ORIGINAL HERO
   ========================================================= */

.smx-rc102-video-stage{
    position:relative!important;
    height:550px!important;
    width:100%!important;
    display:grid!important;
    place-items:center!important;
    overflow:hidden!important;
    perspective:1000px;
    isolation:isolate;
    border-radius:28px;
}

/*
 * The video fills the visual stage.
 * object-fit:cover deliberately crops the 16:9 source so
 * it reads as part of the hero rather than a pasted video.
 */

.smx-rc102-video{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
    display:block!important;
    border:0!important;
    border-radius:28px!important;
    z-index:1!important;

    filter:
        saturate(.92)
        contrast(1.04)
        brightness(.72)!important;

    transform:scale(1.08);
}

/*
 * Fade the rectangular edges into the SitesMechanix
 * background. This is the important part that makes the
 * 16:9 source feel integrated.
 */

.smx-rc102-video-veil{
    position:absolute!important;
    inset:0!important;
    z-index:2!important;
    pointer-events:none!important;
    border-radius:28px!important;

    background:
        linear-gradient(
            90deg,
            rgba(2,10,8,.92) 0%,
            rgba(2,10,8,.20) 13%,
            rgba(2,10,8,0) 32%,
            rgba(2,10,8,0) 68%,
            rgba(2,10,8,.22) 86%,
            rgba(2,10,8,.92) 100%
        ),
        linear-gradient(
            180deg,
            rgba(2,10,8,.72) 0%,
            rgba(2,10,8,0) 18%,
            rgba(2,10,8,0) 78%,
            rgba(2,10,8,.82) 100%
        );

    box-shadow:
        inset 0 0 80px rgba(2,10,8,.78),
        inset 0 0 25px rgba(66,255,196,.10);
}

/*
 * Emerald atmospheric glow around the video.
 * Not a ball. Not rings. Just light integration.
 */

.smx-rc102-video-stage::after{
    content:"";
    position:absolute;
    inset:4%;
    z-index:0;
    border-radius:32px;
    pointer-events:none;

    box-shadow:
        0 0 80px rgba(0,255,183,.12),
        0 0 150px rgba(0,255,183,.07);

    opacity:.9;
}

/* Remove any legacy artificial visual elements if CSS
   from an older RC is still cached/present. */

.smx-rc102-orb,
.smx-rc102-ring,
.smx97-orb,
.smx97-ring,
.smx96-orb,
.smx96-ring{
    display:none!important;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media(max-width:1100px){

    .smx-kc-hero{
        grid-template-columns:1fr;
        min-height:auto;
        padding:55px 28px 65px;
    }

    .smx-kc-hero > p{
        max-width:850px;
    }

    .smx-rc102-video-stage{
        height:430px!important;
        order:-1;
        margin-bottom:35px;
    }

    .smx-kc-hero h1{
        font-size:72px!important;
    }
}

@media(max-width:700px){

    .smx-kc-hero{
        padding:40px 20px 50px;
    }

    .smx-kc-hero h1{
        font-size:54px!important;
    }

    .smx-kc-hero > p{
        font-size:15px!important;
    }

    .smx-rc102-video-stage{
        height:300px!important;
        border-radius:20px;
    }

    .smx-rc102-video,
    .smx-rc102-video-veil{
        border-radius:20px!important;
    }
}



/* =========================================================
   RC106 — HERO COMPOSITION
   ========================================================= */

body.smx-kc-library-page .smx-kc-hero{
    position:relative!important;
    display:block!important;

    width:100%!important;
    max-width:1500px!important;
    min-height:650px!important;

    margin:0 auto!important;
    padding:70px 5vw 80px!important;

    box-sizing:border-box!important;
    overflow:hidden!important;
}

/*
 * The original hero text occupies the left side.
 */

body.smx-kc-library-page .smx-kc-hero > .smx-kc-kicker,
body.smx-kc-library-page .smx-kc-hero > h1,
body.smx-kc-library-page .smx-kc-hero > p,
body.smx-kc-library-page .smx-kc-hero > .smx-kc-search{
    position:relative!important;
    z-index:10!important;

    width:48%!important;
    max-width:680px!important;
}

/*
 * Kicker
 */

body.smx-kc-library-page .smx-kc-hero > .smx-kc-kicker{
    display:block!important;
    margin:0 0 20px!important;
}

/*
 * Headline.
 *
 * Explicit width forces the intended three-line composition
 * instead of allowing the heading to run through the video.
 */

body.smx-kc-library-page .smx-kc-hero > h1{
    font-size:clamp(58px,6vw,94px)!important;
    line-height:.93!important;
    letter-spacing:-.045em!important;

    margin:0 0 28px!important;

    color:#f4fffb!important;
}

/*
 * Description
 */

body.smx-kc-library-page .smx-kc-hero > p{
    font-size:18px!important;
    line-height:1.65!important;

    margin:0 0 32px!important;

    color:#d7eee7!important;
}

/*
 * Search
 */

body.smx-kc-library-page .smx-kc-hero > .smx-kc-search{
    margin:0!important;
}

/*
 * VIDEO
 *
 * The video is deliberately oversized and cropped.
 * It therefore behaves like artwork rather than a player.
 */

body.smx-kc-library-page .smx-kc-hero .smx-rc102-video-stage{
    position:absolute!important;

    z-index:3!important;

    top:30px!important;
    right:-3%!important;

    width:59%!important;
    height:590px!important;

    margin:0!important;

    border-radius:0!important;

    overflow:hidden!important;

    background:transparent!important;

    pointer-events:none!important;
}

body.smx-kc-library-page .smx-kc-hero .smx-rc102-video{
    position:absolute!important;

    inset:-4%!important;

    width:108%!important;
    height:108%!important;

    max-width:none!important;

    object-fit:cover!important;

    object-position:center!important;

    border:0!important;
    border-radius:0!important;

    opacity:.94!important;

    transform:none!important;

    filter:
        saturate(1.05)
        contrast(1.04)
        brightness(.78)!important;
}

/*
 * Seamless fade from video into the hero background.
 */

body.smx-kc-library-page .smx-kc-hero .smx-rc102-video-veil{
    position:absolute!important;

    inset:0!important;

    z-index:5!important;

    border-radius:0!important;

    background:
        linear-gradient(
            90deg,
            #020a08 0%,
            rgba(2,10,8,.92) 7%,
            rgba(2,10,8,.52) 20%,
            rgba(2,10,8,.05) 42%,
            transparent 70%
        ),
        linear-gradient(
            180deg,
            rgba(2,10,8,.85) 0%,
            transparent 20%,
            transparent 78%,
            rgba(2,10,8,.88) 100%
        ),
        linear-gradient(
            270deg,
            rgba(2,10,8,.70) 0%,
            transparent 18%
        )!important;

    pointer-events:none!important;
}

/*
 * Do not display any artificial book/orb/ring layer.
 */

body.smx-kc-library-page .smx-kc-hero
.smx97-book-stage,
body.smx-kc-library-page .smx-kc-hero
.smx97-book-art,
body.smx-kc-library-page .smx-kc-hero
.smx97-page-sheen,
body.smx-kc-library-page .smx-kc-hero
.smx97-orb,
body.smx-kc-library-page .smx-kc-hero
.smx97-ring,
body.smx-kc-library-page .smx-kc-hero
.smx-rc102-orb,
body.smx-kc-library-page .smx-kc-hero
.smx-rc102-ring{
    display:none!important;
}

/*
 * Existing decorative orbit stays behind the hero content.
 */

body.smx-kc-library-page .smx-kc-orbit{
    z-index:0!important;
}

/*
 * Mobile.
 */

@media(max-width:950px){

    body.smx-kc-library-page .smx-kc-hero{
        min-height:0!important;
        padding:50px 25px 60px!important;
    }

    body.smx-kc-library-page .smx-kc-hero > .smx-kc-kicker,
    body.smx-kc-library-page .smx-kc-hero > h1,
    body.smx-kc-library-page .smx-kc-hero > p,
    body.smx-kc-library-page .smx-kc-hero > .smx-kc-search{
        width:100%!important;
        max-width:800px!important;
    }

    body.smx-kc-library-page .smx-kc-hero .smx-rc102-video-stage{
        position:relative!important;

        top:auto!important;
        right:auto!important;

        width:100%!important;
        height:360px!important;

        margin:35px 0 0!important;
    }

    body.smx-kc-library-page .smx-kc-hero > h1{
        font-size:clamp(52px,10vw,76px)!important;
    }
}


/* =========================================================
   RC107
   ORIGINAL KNOWLEDGE DESIGN PROPORTIONS
   VIDEO = LIVE HERO ARTWORK
   ========================================================= */

body.smx-kc-library-page .smx-kc-hero{
    position:relative!important;
    display:block!important;

    width:100%!important;
    max-width:1280px!important;

    min-height:520px!important;

    margin:0 auto!important;

    padding:
        58px
        5.2%
        58px!important;

    box-sizing:border-box!important;

    overflow:hidden!important;
}

/* ---------------------------------------------------------
   LEFT SIDE — ORIGINAL TEXT AREA
   --------------------------------------------------------- */

body.smx-kc-library-page .smx-kc-hero > .smx-kc-kicker,
body.smx-kc-library-page .smx-kc-hero > h1,
body.smx-kc-library-page .smx-kc-hero > p,
body.smx-kc-library-page .smx-kc-hero > .smx-kc-search{

    position:relative!important;

    z-index:20!important;

    width:46%!important;

    max-width:590px!important;
}

/* KICKER */

body.smx-kc-library-page .smx-kc-hero > .smx-kc-kicker{
    margin:
        0
        0
        20px!important;

    font-size:10px!important;

    letter-spacing:.22em!important;

    color:#36ffc0!important;
}

/* HEADLINE */

body.smx-kc-library-page .smx-kc-hero > h1{

    margin:
        0
        0
        24px!important;

    max-width:560px!important;

    font-size:
        clamp(54px,5.2vw,82px)!important;

    line-height:
        .94!important;

    letter-spacing:
        -.045em!important;

    font-weight:
        800!important;

    color:#f4fffb!important;
}

/*
 * Force the visual rhythm of the original:
 *
 * Learn.
 * Understand.
 * Build Better.
 */

body.smx-kc-library-page .smx-kc-hero > h1{
    text-wrap:balance!important;
}

/* DESCRIPTION */

body.smx-kc-library-page .smx-kc-hero > p{

    margin:
        0
        0
        28px!important;

    max-width:560px!important;

    font-size:15px!important;

    line-height:1.65!important;

    color:#cfe5de!important;
}

/* SEARCH */

body.smx-kc-library-page .smx-kc-hero > .smx-kc-search{
    margin:0!important;
}

body.smx-kc-library-page .smx-kc-search > div{
    max-width:570px!important;
}

body.smx-kc-library-page .smx-kc-search input{
    height:58px!important;

    font-size:15px!important;

    border-radius:
        9px 0 0 9px!important;
}

body.smx-kc-library-page .smx-kc-search button{
    height:58px!important;

    border-radius:
        0 9px 9px 0!important;

    padding:
        0 24px!important;
}

/* ---------------------------------------------------------
   VIDEO
   --------------------------------------------------------- */

/*
 * IMPORTANT:
 *
 * Do NOT make this 59% x 590px.
 *
 * The original visual was approximately a 16:9 artwork
 * occupying the right half of the hero.
 */

body.smx-kc-library-page .smx-kc-hero .smx-rc102-video-stage{

    position:absolute!important;

    z-index:4!important;

    top:50%!important;

    right:3.5%!important;

    transform:
        translateY(-50%)!important;

    width:
        min(48%,620px)!important;

    aspect-ratio:
        16 / 9!important;

    height:auto!important;

    min-height:0!important;

    margin:0!important;

    padding:0!important;

    border-radius:0!important;

    overflow:hidden!important;

    background:transparent!important;

    pointer-events:none!important;
}

/*
 * Preserve the video's natural aspect ratio.
 *
 * NO 108% enlargement.
 * NO giant vertical stage.
 */

body.smx-kc-library-page .smx-kc-hero .smx-rc102-video{

    position:absolute!important;

    inset:0!important;

    width:100%!important;

    height:100%!important;

    max-width:none!important;

    object-fit:cover!important;

    object-position:center center!important;

    transform:none!important;

    border:0!important;

    border-radius:0!important;

    display:block!important;

    opacity:1!important;

    filter:
        saturate(.98)
        contrast(1.02)
        brightness(.82)!important;
}

/*
 * Blend the video's edges into the original dark
 * SitesMechanix environment.
 */

body.smx-kc-library-page .smx-kc-hero .smx-rc102-video-veil{

    position:absolute!important;

    inset:0!important;

    z-index:5!important;

    border-radius:0!important;

    pointer-events:none!important;

    background:

        linear-gradient(
            90deg,
            rgba(2,10,8,.95) 0%,
            rgba(2,10,8,.55) 8%,
            rgba(2,10,8,.10) 25%,
            transparent 48%
        ),

        linear-gradient(
            180deg,
            rgba(2,10,8,.40) 0%,
            transparent 18%,
            transparent 78%,
            rgba(2,10,8,.65) 100%
        ),

        linear-gradient(
            270deg,
            rgba(2,10,8,.20) 0%,
            transparent 25%
        );
}

/*
 * NO artificial visual objects.
 */

body.smx-kc-library-page
.smx-rc102-orb,

body.smx-kc-library-page
.smx-rc102-ring,

body.smx-kc-library-page
.smx97-orb,

body.smx-kc-library-page
.smx97-ring,

body.smx-kc-library-page
.smx97-book-stage,

body.smx-kc-library-page
.smx97-book-art{

    display:none!important;
}

/* ---------------------------------------------------------
   HERO BACKGROUND
   --------------------------------------------------------- */

body.smx-kc-library-page .smx-kc-hero::before{

    content:"";

    position:absolute;

    inset:0;

    z-index:0;

    pointer-events:none;

    background:

        radial-gradient(
            circle at 82% 45%,
            rgba(0,255,185,.09),
            transparent 31%
        ),

        linear-gradient(
            90deg,
            rgba(0,0,0,.16),
            transparent 50%,
            rgba(0,255,185,.025)
        );
}

/* ---------------------------------------------------------
   DESKTOP WIDTH CONTROL
   --------------------------------------------------------- */

@media(min-width:1200px){

    body.smx-kc-library-page .smx-kc-hero{
        min-height:540px!important;
    }

    body.smx-kc-library-page
    .smx-kc-hero
    .smx-rc102-video-stage{

        width:600px!important;
    }
}

/* ---------------------------------------------------------
   TABLET
   --------------------------------------------------------- */

@media(max-width:950px){

    body.smx-kc-library-page .smx-kc-hero{

        min-height:0!important;

        padding:
            45px
            28px
            55px!important;
    }

    body.smx-kc-library-page
    .smx-kc-hero > .smx-kc-kicker,

    body.smx-kc-library-page
    .smx-kc-hero > h1,

    body.smx-kc-library-page
    .smx-kc-hero > p,

    body.smx-kc-library-page
    .smx-kc-hero > .smx-kc-search{

        width:100%!important;

        max-width:700px!important;
    }

    body.smx-kc-library-page
    .smx-kc-hero
    .smx-rc102-video-stage{

        position:relative!important;

        top:auto!important;

        right:auto!important;

        transform:none!important;

        width:100%!important;

        max-width:640px!important;

        aspect-ratio:16 / 9!important;

        margin:
            35px
            auto
            0!important;
    }
}


/* =========================================================
   SitesMechanix Knowledge Core — RC108
   FULL-WIDTH LIVING HERO VIDEO
   ========================================================= */

body.smx-kc-library-page .smx-kc-hero{
    position:relative!important;
    isolation:isolate!important;
    overflow:hidden!important;
    min-height:620px!important;
    background:#020806!important;
}

/* Full hero video layer */
body.smx-kc-library-page .smx-rc102-video-stage{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    z-index:-2!important;
    background:#020806!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
}

/* Actual video */
body.smx-kc-library-page .smx-rc102-video{
    position:absolute!important;
    inset:0!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
    object-fit:cover!important;
    object-position:center center!important;
    border:0!important;
    border-radius:0!important;
    background:#020806!important;
}

/* Darken the left side for HTML content */
body.smx-kc-library-page .smx-rc102-video-stage::before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:2!important;
    pointer-events:none!important;
    background:
        linear-gradient(
            90deg,
            rgba(1,9,7,.96) 0%,
            rgba(1,10,8,.88) 28%,
            rgba(1,10,8,.48) 50%,
            rgba(1,10,8,.12) 72%,
            rgba(1,10,8,.18) 100%
        )!important;
}

/* Subtle overall cinematic darkening */
body.smx-kc-library-page .smx-rc102-video-stage::after{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:3!important;
    pointer-events:none!important;
    background:rgba(0,8,6,.18)!important;
}

/* Hero content remains above the video */
body.smx-kc-library-page
.smx-kc-hero > *:not(.smx-rc102-video-stage){
    position:relative!important;
    z-index:5!important;
}

/* Keep text/search in the left-side safe area */
body.smx-kc-library-page
.smx-kc-hero > h1,
body.smx-kc-library-page
.smx-kc-hero > p,
body.smx-kc-library-page
.smx-kc-hero > form,
body.smx-kc-library-page
.smx-kc-hero > .smx-kc-kicker{
    max-width:650px;
}

/* Search stays above the video */
body.smx-kc-library-page .smx-kc-search{
    position:relative!important;
    z-index:7!important;
}

/* Remove browser video controls if any appear */
body.smx-kc-library-page
.smx-rc102-video::-webkit-media-controls{
    display:none!important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width:900px){

    body.smx-kc-library-page .smx-kc-hero{
        min-height:560px!important;
    }

    body.smx-kc-library-page .smx-rc102-video{
        object-position:center center!important;
    }

    body.smx-kc-library-page
    .smx-rc102-video-stage::before{
        background:
            linear-gradient(
                180deg,
                rgba(1,9,7,.92) 0%,
                rgba(1,9,7,.78) 35%,
                rgba(1,9,7,.45) 65%,
                rgba(1,9,7,.72) 100%
            )!important;
    }
}

@media (max-width:600px){

    body.smx-kc-library-page .smx-kc-hero{
        min-height:620px!important;
    }

    body.smx-kc-library-page .smx-rc102-video{
        object-position:center center!important;
    }
}


/* ============================================================
   SITESMECHANIX KNOWLEDGE CORE
   FINAL HERO OVERRIDE — 2026-08-24
   Purpose:
   - Full-bleed video background
   - Remove obsolete orbit/circle decoration
   - Keep Knowledge content readable above video
   - Preserve existing video JS/controller
   ============================================================ */

/* The hero itself is the video canvas. */
body.smx-kc-library-page .smx-kc-hero{
    position:relative !important;
    isolation:isolate !important;
    overflow:hidden !important;
    min-height:560px !important;
    width:100% !important;
    max-width:none !important;
    background:#001f1a !important;
}

/* Kill the obsolete decorative orbit and old hero pseudo-decoration. */
body.smx-kc-library-page .smx-kc-orbit{
    display:none !important;
}

body.smx-kc-library-page .smx-kc-hero::before,
body.smx-kc-library-page .smx-kc-hero::after{
    display:none !important;
    content:none !important;
}

/* The JS-created video stage becomes the actual full hero background. */
body.smx-kc-library-page .smx-kc-hero > .smx-rc102-video-stage{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    min-width:100% !important;
    min-height:100% !important;
    max-width:none !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    transform:none !important;
    z-index:0 !important;
    overflow:hidden !important;
    pointer-events:none !important;
}

/* Video fills the entire hero instead of behaving like a 16:9 card. */
body.smx-kc-library-page .smx-kc-hero .smx-rc102-video{
    position:absolute !important;
    inset:0 !important;
    display:block !important;
    width:100% !important;
    height:100% !important;
    min-width:100% !important;
    min-height:100% !important;
    max-width:none !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    object-fit:cover !important;
    object-position:center center !important;
    transform:none !important;
    opacity:1 !important;
}

/* Dark emerald readability layer. */
body.smx-kc-library-page .smx-kc-hero .smx-rc102-video-veil{
    position:absolute !important;
    inset:0 !important;
    display:block !important;
    width:100% !important;
    height:100% !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:
        linear-gradient(
            90deg,
            rgba(0,20,17,.90) 0%,
            rgba(0,25,21,.72) 42%,
            rgba(0,25,21,.38) 72%,
            rgba(0,25,21,.58) 100%
        ) !important;
    z-index:1 !important;
    pointer-events:none !important;
}

/* Every actual hero content element sits above the video. */
body.smx-kc-library-page .smx-kc-hero > .smx-kc-kicker,
body.smx-kc-library-page .smx-kc-hero > h1,
body.smx-kc-library-page .smx-kc-hero > p,
body.smx-kc-library-page .smx-kc-hero > .smx-kc-search{
    position:relative !important;
    z-index:5 !important;
}

/* Keep the content grouped on the readable side of the video. */
body.smx-kc-library-page .smx-kc-hero > .smx-kc-kicker{
    margin-left:auto !important;
    margin-right:auto !important;
}

body.smx-kc-library-page .smx-kc-hero > h1,
body.smx-kc-library-page .smx-kc-hero > p,
body.smx-kc-library-page .smx-kc-hero > .smx-kc-search{
    max-width:720px !important;
    margin-left:0 !important;
    margin-right:auto !important;
}

/* Search remains fully usable. */
body.smx-kc-library-page .smx-kc-hero .smx-kc-search,
body.smx-kc-library-page .smx-kc-hero .smx-kc-search input,
body.smx-kc-library-page .smx-kc-hero .smx-kc-search button{
    position:relative !important;
    z-index:10 !important;
}

/* Mobile: maintain a true full-bleed hero without crushing the content. */
@media (max-width:767px){
    body.smx-kc-library-page .smx-kc-hero{
        min-height:620px !important;
    }

    body.smx-kc-library-page .smx-kc-hero .smx-rc102-video{
        object-position:center center !important;
    }

    body.smx-kc-library-page .smx-kc-hero .smx-rc102-video-veil{
        background:
            linear-gradient(
                180deg,
                rgba(0,20,17,.68) 0%,
                rgba(0,25,21,.82) 55%,
                rgba(0,20,17,.94) 100%
            ) !important;
    }
}


/* ============================================================
   KNOWLEDGE CORE — TRUE FULL-BLEED HERO
   Break the hero out of Avada's constrained content container.
   ============================================================ */

body.smx-kc-library-page .smx-kc-hero{
    width:100vw !important;
    max-width:none !important;
    margin-left:calc(50% - 50vw) !important;
    margin-right:calc(50% - 50vw) !important;
    box-sizing:border-box !important;
}

/* Keep the hero content readable while the video spans the viewport. */
body.smx-kc-library-page .smx-kc-hero > .smx-kc-kicker,
body.smx-kc-library-page .smx-kc-hero > h1,
body.smx-kc-library-page .smx-kc-hero > p,
body.smx-kc-library-page .smx-kc-hero > .smx-kc-search{
    width:calc(100% - 12vw) !important;
    max-width:720px !important;
    margin-left:6vw !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
}

/* The video canvas must also be viewport-wide. */
body.smx-kc-library-page .smx-kc-hero > .smx-rc102-video-stage{
    width:100% !important;
    max-width:none !important;
    left:0 !important;
    right:0 !important;
}

/* Do not allow the old decorative orbit to return. */
body.smx-kc-library-page .smx-kc-orbit{
    display:none !important;
}

/* Mobile full-bleed breakout. */
@media (max-width:767px){

    body.smx-kc-library-page .smx-kc-hero{
        width:100vw !important;
        margin-left:calc(50% - 50vw) !important;
        margin-right:calc(50% - 50vw) !important;
    }

    body.smx-kc-library-page .smx-kc-hero > .smx-kc-kicker,
    body.smx-kc-library-page .smx-kc-hero > h1,
    body.smx-kc-library-page .smx-kc-hero > p,
    body.smx-kc-library-page .smx-kc-hero > .smx-kc-search{
        width:calc(100% - 40px) !important;
        max-width:none !important;
        margin-left:20px !important;
        margin-right:20px !important;
    }
}


/* ============================================================
   KNOWLEDGE CORE — AVADA SHELL OVERRIDE
   The Knowledge Library owns its entire page canvas.
   ============================================================ */

body.smx-kc-library-page{
    background:#061915 !important;
}

/* Remove Avada's normal content-width limitation ONLY on Knowledge. */
body.smx-kc-library-page #main,
body.smx-kc-library-page .fusion-main-content,
body.smx-kc-library-page .fusion-row,
body.smx-kc-library-page .fusion-builder-row{
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    box-sizing:border-box !important;
}

/* Don't let an Avada ancestor clip the full-width Knowledge canvas. */
body.smx-kc-library-page #main,
body.smx-kc-library-page .fusion-main-content,
body.smx-kc-library-page .fusion-row{
    overflow:visible !important;
}

/* The Knowledge shell itself owns the viewport. */
body.smx-kc-library-page main.smx-kc-library{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
}

/* Hero is now genuinely viewport-wide. */
body.smx-kc-library-page .smx-kc-hero{
    position:relative !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    box-sizing:border-box !important;
}

/* Preserve readable hero content width. */
body.smx-kc-library-page .smx-kc-hero > .smx-kc-kicker,
body.smx-kc-library-page .smx-kc-hero > h1,
body.smx-kc-library-page .smx-kc-hero > p,
body.smx-kc-library-page .smx-kc-hero > .smx-kc-search{
    margin-left:clamp(24px,8vw,140px) !important;
    margin-right:auto !important;
}

/* Video stage owns the entire hero. */
body.smx-kc-library-page .smx-kc-hero > .smx-rc102-video-stage{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
}

/* Kill the obsolete orbit if anything still carries the class. */
body.smx-kc-library-page .smx-kc-orbit{
    display:none !important;
}

@media(max-width:767px){

    body.smx-kc-library-page .smx-kc-hero > .smx-kc-kicker,
    body.smx-kc-library-page .smx-kc-hero > h1,
    body.smx-kc-library-page .smx-kc-hero > p,
    body.smx-kc-library-page .smx-kc-hero > .smx-kc-search{
        margin-left:20px !important;
        margin-right:20px !important;
    }
}


/* ============================================================
   KNOWLEDGE CORE — FINAL PAGE CANVAS
   Make every Avada wrapper containing the Knowledge Library
   transparent to the Library's full-width canvas.
   ============================================================ */

body.smx-kc-library-page .fusion-row:has(.smx-kc-library),
body.smx-kc-library-page .fusion-builder-row:has(.smx-kc-library),
body.smx-kc-library-page .fusion-layout-column:has(.smx-kc-library),
body.smx-kc-library-page .fusion-column-wrapper:has(.smx-kc-library),
body.smx-kc-library-page .fusion-flex-container:has(.smx-kc-library),
body.smx-kc-library-page #content:has(.smx-kc-library) {
    width:100vw !important;
    max-width:none !important;
    min-width:0 !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    box-sizing:border-box !important;
}

/* Remove the specific column gutters around the Knowledge canvas. */
body.smx-kc-library-page .fusion-layout-column:has(.smx-kc-library) {
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
}

/* Knowledge itself remains the page canvas. */
body.smx-kc-library-page main.smx-kc-library {
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
}

/* Hero occupies that canvas. */
body.smx-kc-library-page main.smx-kc-library .smx-kc-hero {
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
}


/* ============================================================
   KNOWLEDGE CORE — DETACHED FULL PAGE SHELL
   ============================================================ */

body.smx-kc-dom-detached .smx-kc-full-page-shell{
    display:block !important;
    position:relative !important;
    width:100vw !important;
    max-width:none !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    left:auto !important;
    right:auto !important;
    overflow:visible !important;
    box-sizing:border-box !important;
}

body.smx-kc-dom-detached .smx-kc-full-page-shell > main.smx-kc-library{
    display:block !important;
    position:relative !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
}

body.smx-kc-dom-detached .smx-kc-full-page-shell .smx-kc-hero{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
}


/* ============================================================
   RC110 — KNOWLEDGE DARK CANVAS TEXT CORRECTION
   ============================================================ */

body.smx-kc-library-page,
body.smx-kc-library-page .smx-kc-library{
    color:#f4fffb !important;
}

/* Section headings */
body.smx-kc-library-page .smx-kc-section,
body.smx-kc-library-page .smx-kc-section-head,
body.smx-kc-library-page .smx-kc-section-head span,
body.smx-kc-library-page .smx-kc-section-head h2{
    color:#f4fffb !important;
}

/* Empty-state text */
body.smx-kc-library-page .smx-kc-empty,
body.smx-kc-library-page .smx-kc-empty h3,
body.smx-kc-library-page .smx-kc-empty p{
    color:#f4fffb !important;
}

/* Knowledge cards */
body.smx-kc-library-page .smx-kc-card,
body.smx-kc-library-page .smx-kc-card h3,
body.smx-kc-library-page .smx-kc-card p,
body.smx-kc-library-page .smx-kc-card a{
    color:#f4fffb;
}

/* Make the secondary metadata readable */
body.smx-kc-library-page .smx-kc-meta{
    color:rgba(244,255,251,.72) !important;
}

/* Search label */
body.smx-kc-library-page .smx-kc-search label{
    color:#f4fffb !important;
}


/* ============================================================
   KNOWLEDGE CORE — CENTERED SITE WORKSPACE
   Match the normal SitesMechanix interior-page layout.
   Header/footer remain full width.
   ============================================================ */

/* The Knowledge page itself uses the same centered workspace
   philosophy as Contact / interior pages. */
body.smx-kc-library-page .smx-kc-full-page-shell{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
    background:transparent !important;
}

/* Center the actual Knowledge application. */
body.smx-kc-library-page .smx-kc-full-page-shell > main.smx-kc-library{
    width:calc(100% - 48px) !important;
    max-width:1100px !important;
    margin:0 auto !important;
    padding:0 !important;
    box-sizing:border-box !important;
}

/* The hero belongs to the centered application, not the
   entire browser viewport. */
body.smx-kc-library-page .smx-kc-hero{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    box-sizing:border-box !important;
    border-radius:0 0 18px 18px !important;
}

/* Video fills the centered hero only. */
body.smx-kc-library-page .smx-kc-hero > .smx-rc102-video-stage{
    width:100% !important;
    max-width:none !important;
    left:0 !important;
    right:0 !important;
}

/* Keep the hero content inside the same centered workspace. */
body.smx-kc-library-page .smx-kc-hero > .smx-kc-kicker,
body.smx-kc-library-page .smx-kc-hero > h1,
body.smx-kc-library-page .smx-kc-hero > p,
body.smx-kc-library-page .smx-kc-hero > .smx-kc-search{
    margin-left:0 !important;
    margin-right:auto !important;
}

/* Library section stays inside the workspace. */
body.smx-kc-library-page .smx-kc-section{
    width:100% !important;
    max-width:none !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
}

/* Topics stay inside the workspace. */
body.smx-kc-library-page .smx-kc-topics{
    width:100% !important;
    max-width:none !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
}

/* Cards/grid stay within the same controlled width. */
body.smx-kc-library-page .smx-kc-grid,
body.smx-kc-library-page .smx-kc-empty{
    width:100% !important;
    max-width:none !important;
    box-sizing:border-box !important;
}

/* Desktop breathing room similar to the rest of the site. */
@media (min-width:1101px){
    body.smx-kc-library-page .smx-kc-full-page-shell > main.smx-kc-library{
        max-width:1100px !important;
    }
}

/* Tablet */
@media (max-width:1100px){
    body.smx-kc-library-page .smx-kc-full-page-shell > main.smx-kc-library{
        width:calc(100% - 40px) !important;
    }
}

/* Phone */
@media (max-width:767px){
    body.smx-kc-library-page .smx-kc-full-page-shell > main.smx-kc-library{
        width:calc(100% - 24px) !important;
    }
}


/* ============================================================
   RC111 — FINAL KNOWLEDGE INTERIOR WIDTH
   Match SitesMechanix interior pages such as Contact.
   Header/footer stay full width.
   Knowledge application is centered.
   ============================================================ */

/* Kill every previous viewport-width instruction on the
   Knowledge application itself. */
main.smx-kc-library,
.smx-kc-full-page-shell > main.smx-kc-library {
    display:block !important;
    position:relative !important;

    width:calc(100% - 48px) !important;
    max-width:1100px !important;
    min-width:0 !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;

    box-sizing:border-box !important;
}

/* The hero must fill ONLY the centered Knowledge application. */
main.smx-kc-library .smx-kc-hero {
    display:block !important;
    position:relative !important;

    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;

    margin-left:0 !important;
    margin-right:0 !important;

    box-sizing:border-box !important;
}

/* Absolutely kill the old viewport breakout rules. */
main.smx-kc-library .smx-kc-hero {
    left:auto !important;
    right:auto !important;
}

/* Video fills the hero, not the browser viewport. */
main.smx-kc-library .smx-rc102-video-stage {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;

    left:0 !important;
    right:0 !important;

    margin-left:0 !important;
    margin-right:0 !important;
}

/* Search/content remains aligned with the Knowledge workspace. */
main.smx-kc-library .smx-kc-hero > .smx-kc-kicker,
main.smx-kc-library .smx-kc-hero > h1,
main.smx-kc-library .smx-kc-hero > p,
main.smx-kc-library .smx-kc-hero > .smx-kc-search {
    box-sizing:border-box !important;
}

/* Library content cannot escape the centered workspace. */
main.smx-kc-library .smx-kc-section,
main.smx-kc-library .smx-kc-topics,
main.smx-kc-library .smx-kc-grid,
main.smx-kc-library .smx-kc-empty {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;

    margin-left:0 !important;
    margin-right:0 !important;

    box-sizing:border-box !important;
}

/* Desktop */
@media (min-width:1101px) {
    main.smx-kc-library,
    .smx-kc-full-page-shell > main.smx-kc-library {
        width:1100px !important;
        max-width:1100px !important;
    }
}

/* Tablet */
@media (min-width:768px) and (max-width:1100px) {
    main.smx-kc-library,
    .smx-kc-full-page-shell > main.smx-kc-library {
        width:calc(100% - 40px) !important;
        max-width:1100px !important;
    }
}

/* Mobile */
@media (max-width:767px) {
    main.smx-kc-library,
    .smx-kc-full-page-shell > main.smx-kc-library {
        width:calc(100% - 24px) !important;
        max-width:none !important;
    }
}


/* ============================================================
   RC114 — KNOWLEDGE CORE EMERALD NEON VISUAL PASS
   Dark futuristic canvas + strong SitesMechanix emerald energy.
   ============================================================ */

/* ------------------------------------------------------------
   GLOBAL KNOWLEDGE CANVAS
   ------------------------------------------------------------ */

body.smx-kc-library-page,
body.smx-kc-library-page .smx-kc-library{
    background:
        radial-gradient(
            circle at 50% 12%,
            rgba(0,255,180,.10),
            transparent 32%
        ),
        radial-gradient(
            circle at 12% 55%,
            rgba(0,255,170,.055),
            transparent 25%
        ),
        radial-gradient(
            circle at 88% 55%,
            rgba(0,255,170,.055),
            transparent 25%
        ),
        #020d0b !important;

    color:#f4fffb !important;
}

/* ------------------------------------------------------------
   HERO — BRIGHTER EMERALD ENERGY
   ------------------------------------------------------------ */

body.smx-kc-library-page .smx-kc-hero{
    position:relative !important;
    overflow:hidden !important;

    background:
        linear-gradient(
            90deg,
            rgba(0,255,170,.10),
            transparent 42%,
            rgba(0,255,170,.08)
        ),
        #020c0a !important;

    border:1px solid rgba(35,255,190,.30) !important;

    box-shadow:
        0 0 0 1px rgba(0,255,180,.06),
        0 0 35px rgba(0,255,170,.12),
        inset 0 0 55px rgba(0,255,170,.06) !important;
}

/* Emerald atmospheric glow behind hero. */
body.smx-kc-library-page .smx-kc-hero::before{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    inset:-25% -10% !important;
    pointer-events:none !important;

    background:
        radial-gradient(
            ellipse at 72% 48%,
            rgba(0,255,170,.18),
            transparent 42%
        ),
        radial-gradient(
            ellipse at 18% 55%,
            rgba(0,255,170,.08),
            transparent 38%
        ) !important;

    z-index:1 !important;
}

/* Keep actual hero content above the atmosphere. */
body.smx-kc-library-page .smx-kc-hero > *{
    position:relative !important;
    z-index:3 !important;
}

/* ------------------------------------------------------------
   HERO VIDEO — BRIGHTEN THE BOOK
   ------------------------------------------------------------ */

body.smx-kc-library-page .smx-rc102-video{
    filter:
        brightness(1.20)
        contrast(1.08)
        saturate(1.28) !important;
}

/* Emerald cinematic wash. */
body.smx-kc-library-page .smx-rc102-video-veil{
    background:
        linear-gradient(
            90deg,
            rgba(0,255,170,.14),
            transparent 48%,
            rgba(0,255,170,.10)
        ),
        radial-gradient(
            ellipse at 75% 52%,
            rgba(0,255,170,.15),
            transparent 45%
        ) !important;

    opacity:1 !important;
    mix-blend-mode:screen !important;
}

/* ------------------------------------------------------------
   KICKER / LABELS
   ------------------------------------------------------------ */

body.smx-kc-library-page .smx-kc-kicker{
    color:#36ffc2 !important;

    text-shadow:
        0 0 8px rgba(0,255,180,.65),
        0 0 22px rgba(0,255,180,.30) !important;
}

/* ------------------------------------------------------------
   MAIN HEADING
   ------------------------------------------------------------ */

body.smx-kc-library-page .smx-kc-hero h1{
    color:#f5fffc !important;

    text-shadow:
        0 0 18px rgba(0,255,180,.15) !important;
}

/* ------------------------------------------------------------
   SEARCH — MAKE IT A FEATURE
   ------------------------------------------------------------ */

body.smx-kc-library-page .smx-kc-search{
    position:relative !important;
}

body.smx-kc-library-page .smx-kc-search input{
    background:
        linear-gradient(
            180deg,
            rgba(0,255,170,.055),
            rgba(0,0,0,.35)
        ) !important;

    border:1px solid rgba(39,255,190,.55) !important;

    color:#f5fffc !important;

    box-shadow:
        0 0 12px rgba(0,255,170,.12),
        inset 0 0 18px rgba(0,255,170,.045) !important;
}

body.smx-kc-library-page .smx-kc-search input:focus{
    border-color:#38ffc2 !important;

    box-shadow:
        0 0 0 2px rgba(0,255,180,.12),
        0 0 24px rgba(0,255,180,.30),
        inset 0 0 20px rgba(0,255,180,.08) !important;

    outline:none !important;
}

body.smx-kc-library-page .smx-kc-search button{
    background:
        linear-gradient(
            135deg,
            #21e6a2,
            #00b978
        ) !important;

    color:#00130e !important;

    border:1px solid #61ffd1 !important;

    box-shadow:
        0 0 12px rgba(0,255,180,.45),
        0 0 30px rgba(0,255,180,.20) !important;

    text-shadow:none !important;
}

body.smx-kc-library-page .smx-kc-search button:hover{
    background:
        linear-gradient(
            135deg,
            #5affcf,
            #19df9d
        ) !important;

    box-shadow:
        0 0 18px rgba(0,255,180,.65),
        0 0 40px rgba(0,255,180,.30) !important;
}

/* ------------------------------------------------------------
   TOPIC / CATEGORY NAVIGATION
   ------------------------------------------------------------ */

body.smx-kc-library-page .smx-kc-topics{
    background:rgba(0,255,170,.025) !important;
}

body.smx-kc-library-page .smx-kc-topics a{
    color:#b9e9dc !important;

    border:1px solid rgba(39,255,190,.25) !important;

    background:
        linear-gradient(
            135deg,
            rgba(0,255,170,.055),
            rgba(0,0,0,.22)
        ) !important;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        color .2s ease,
        transform .2s ease !important;
}

body.smx-kc-library-page .smx-kc-topics a:hover,
body.smx-kc-library-page .smx-kc-topics a.is-active{
    color:#55ffd0 !important;

    border-color:#29ffc0 !important;

    background:
        linear-gradient(
            135deg,
            rgba(0,255,170,.14),
            rgba(0,255,170,.045)
        ) !important;

    box-shadow:
        0 0 12px rgba(0,255,180,.22),
        inset 0 0 16px rgba(0,255,180,.06) !important;

    text-shadow:
        0 0 8px rgba(0,255,180,.45) !important;
}

/* ------------------------------------------------------------
   SECTION HEAD
   ------------------------------------------------------------ */

body.smx-kc-library-page .smx-kc-section-head{
    border-bottom:1px solid rgba(39,255,190,.20) !important;
}

body.smx-kc-library-page .smx-kc-section-head span{
    color:#39ffc2 !important;

    text-shadow:
        0 0 8px rgba(0,255,180,.55) !important;
}

body.smx-kc-library-page .smx-kc-section-head h2{
    color:#f5fffc !important;

    text-shadow:
        0 0 14px rgba(0,255,180,.12) !important;
}

/* ------------------------------------------------------------
   KNOWLEDGE CARDS
   ------------------------------------------------------------ */

body.smx-kc-library-page .smx-kc-card{
    position:relative !important;

    background:
        linear-gradient(
            145deg,
            rgba(0,255,170,.065),
            rgba(0,10,8,.72)
        ) !important;

    border:1px solid rgba(39,255,190,.28) !important;

    box-shadow:
        0 0 0 1px rgba(0,255,180,.025),
        0 0 18px rgba(0,255,170,.08),
        inset 0 0 25px rgba(0,255,170,.025) !important;

    transition:
        transform .2s ease,
        border-color .2s ease,
        box-shadow .2s ease !important;
}

body.smx-kc-library-page .smx-kc-card:hover{
    transform:translateY(-3px) !important;

    border-color:#39ffc2 !important;

    box-shadow:
        0 0 18px rgba(0,255,180,.28),
        0 0 42px rgba(0,255,180,.12),
        inset 0 0 28px rgba(0,255,180,.06) !important;
}

body.smx-kc-library-page .smx-kc-card h3{
    color:#f4fffb !important;
}

body.smx-kc-library-page .smx-kc-card a{
    color:#46ffc8 !important;
}

body.smx-kc-library-page .smx-kc-card a:hover{
    color:#8affdf !important;

    text-shadow:
        0 0 10px rgba(0,255,180,.50) !important;
}

/* ------------------------------------------------------------
   EMPTY STATE — MAKE IT LOOK INTENTIONAL
   ------------------------------------------------------------ */

body.smx-kc-library-page .smx-kc-empty{
    background:
        linear-gradient(
            145deg,
            rgba(0,255,170,.055),
            rgba(0,0,0,.25)
        ) !important;

    border:1px solid rgba(39,255,190,.25) !important;

    box-shadow:
        inset 0 0 30px rgba(0,255,170,.035),
        0 0 18px rgba(0,255,170,.06) !important;
}

body.smx-kc-library-page .smx-kc-empty h3{
    color:#43ffc5 !important;

    text-shadow:
        0 0 10px rgba(0,255,180,.35) !important;
}

/* ------------------------------------------------------------
   JAXIS ASSISTANCE AREA
   ------------------------------------------------------------ */

body.smx-kc-library-page .smx-kc-jaxis,
body.smx-kc-library-page [class*="jaxis"]{
    border-color:rgba(39,255,190,.28) !important;
}

/* ------------------------------------------------------------
   EMERALD EDGE ENERGY
   ------------------------------------------------------------ */

body.smx-kc-library-page .smx-kc-section::before{
    content:"" !important;
    display:block !important;
    height:1px !important;
    width:100% !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(0,255,180,.55),
            transparent
        ) !important;

    box-shadow:
        0 0 12px rgba(0,255,180,.35) !important;

    margin-bottom:20px !important;
}

/* ------------------------------------------------------------
   MOBILE
   ------------------------------------------------------------ */

@media(max-width:767px){

    body.smx-kc-library-page .smx-kc-hero h1{
        text-shadow:
            0 0 12px rgba(0,255,180,.18) !important;
    }

    body.smx-kc-library-page .smx-kc-card{
        box-shadow:
            0 0 12px rgba(0,255,170,.08),
            inset 0 0 18px rgba(0,255,170,.025) !important;
    }
}


/* ============================================================
   RC114 — KNOWLEDGE CONTENT RAIL ALIGNMENT
   Align library content with the hero search left edge.
   ============================================================ */

body.smx-kc-library-page{
    --smx-kc-content-rail:min(1050px, calc(100% - 64px));
}

/* The library content begins on the same rail as the search. */
body.smx-kc-library-page .smx-kc-section,
body.smx-kc-library-page .smx-kc-topics,
body.smx-kc-library-page .smx-kc-grid,
body.smx-kc-library-page .smx-kc-empty,
body.smx-kc-library-page .smx-kc-jaxis-slot{
    width:var(--smx-kc-content-rail) !important;
    max-width:var(--smx-kc-content-rail) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
}

/* Section heading uses the exact same left edge. */
body.smx-kc-library-page .smx-kc-section-head{
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    text-align:left !important;
}

/* Latest Knowledge */
body.smx-kc-library-page .smx-kc-section-head span,
body.smx-kc-library-page .smx-kc-section-head h2{
    text-align:left !important;
    margin-left:0 !important;
}

/* Empty state stays on the same rail. */
body.smx-kc-library-page .smx-kc-empty{
    margin-left:auto !important;
    margin-right:auto !important;
    text-align:left !important;
}

/* Empty-state contents align left. */
body.smx-kc-library-page .smx-kc-empty h3,
body.smx-kc-library-page .smx-kc-empty p{
    text-align:left !important;
    margin-left:0 !important;
}

/* Topic navigation uses the same rail. */
body.smx-kc-library-page .smx-kc-topics{
    margin-left:auto !important;
    margin-right:auto !important;
}

/* Article grid uses the same rail. */
body.smx-kc-library-page .smx-kc-grid{
    margin-left:auto !important;
    margin-right:auto !important;
}

/* JAXIS uses the same rail. */
body.smx-kc-library-page .smx-kc-jaxis-slot{
    margin-left:auto !important;
    margin-right:auto !important;
}

/* Mobile */
@media(max-width:767px){

    body.smx-kc-library-page{
        --smx-kc-content-rail:calc(100% - 32px);
    }

    body.smx-kc-library-page .smx-kc-section,
    body.smx-kc-library-page .smx-kc-topics,
    body.smx-kc-library-page .smx-kc-grid,
    body.smx-kc-library-page .smx-kc-empty,
    body.smx-kc-library-page .smx-kc-jaxis-slot{
        width:var(--smx-kc-content-rail) !important;
        max-width:var(--smx-kc-content-rail) !important;
    }
}


/* ============================================================
   RC114 — LIBRARY CONTENT ALIGNS WITH SEARCH FIELD
   Do NOT change the overall page width.
   Move only the library's internal content rail.
   ============================================================ */

body.smx-kc-library-page{
    --smx-kc-search-align:43px;
}

/* Latest Knowledge + Explore the library */
body.smx-kc-library-page .smx-kc-section{
    transform:translateX(var(--smx-kc-search-align)) !important;
}

/* Topic/navigation rail */
body.smx-kc-library-page .smx-kc-topics{
    transform:translateX(var(--smx-kc-search-align)) !important;
}

/* Article/empty-state rail */
body.smx-kc-library-page .smx-kc-grid,
body.smx-kc-library-page .smx-kc-empty{
    transform:translateX(var(--smx-kc-search-align)) !important;
}

/* JAXIS follows the same content rail */
body.smx-kc-library-page .smx-kc-jaxis-slot{
    transform:translateX(var(--smx-kc-search-align)) !important;
}

/* Keep mobile centered — don't carry the desktop offset down. */
@media(max-width:767px){

    body.smx-kc-library-page{
        --smx-kc-search-align:0px;
    }

    body.smx-kc-library-page .smx-kc-section,
    body.smx-kc-library-page .smx-kc-topics,
    body.smx-kc-library-page .smx-kc-grid,
    body.smx-kc-library-page .smx-kc-empty,
    body.smx-kc-library-page .smx-kc-jaxis-slot{
        transform:none !important;
    }
}


/* ============================================================
   RC114 — KNOWLEDGE MASTER INNER CONTENT RAIL
   Everything below the hero follows the hero text/search edge.
   ============================================================ */

body.smx-kc-library-page{
    --smx-kc-inner-rail:52px;
}

/* The section itself remains constrained with the site. */
body.smx-kc-library-page .smx-kc-section{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding-left:var(--smx-kc-inner-rail) !important;
    padding-right:var(--smx-kc-inner-rail) !important;
    box-sizing:border-box !important;
}

/* Latest Knowledge heading */
body.smx-kc-library-page .smx-kc-section-head{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    text-align:left !important;
    box-sizing:border-box !important;
}

/* Make both heading lines share EXACTLY the same left edge. */
body.smx-kc-library-page .smx-kc-section-head span,
body.smx-kc-library-page .smx-kc-section-head h2{
    display:block !important;
    width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    text-align:left !important;
    box-sizing:border-box !important;
}

/* Empty state/card follows the exact same rail. */
body.smx-kc-library-page .smx-kc-empty{
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    box-sizing:border-box !important;
    text-align:left !important;
}

/* Book icon stays at the content rail. */
body.smx-kc-library-page .smx-kc-empty > *{
    text-align:left !important;
}

/* Empty-state title and description. */
body.smx-kc-library-page .smx-kc-empty h3,
body.smx-kc-library-page .smx-kc-empty p{
    margin-left:0 !important;
    margin-right:0 !important;
    text-align:left !important;
}

/* Article grid also uses the same inner rail. */
body.smx-kc-library-page .smx-kc-grid{
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    box-sizing:border-box !important;
}

/* Topic navigation follows the same rail. */
body.smx-kc-library-page .smx-kc-topics{
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:var(--smx-kc-inner-rail) !important;
    padding-right:var(--smx-kc-inner-rail) !important;
    box-sizing:border-box !important;
}

/* Stronger SitesMechanix emerald accents. */
body.smx-kc-library-page .smx-kc-section-head span{
    color:#39ffc3 !important;
    text-shadow:0 0 12px rgba(57,255,195,.35) !important;
}

body.smx-kc-library-page .smx-kc-section-head h2{
    color:#ffffff !important;
}

/* Empty-state book/card gets the same emerald edge treatment. */
body.smx-kc-library-page .smx-kc-empty{
    border-color:rgba(57,255,195,.42) !important;
    box-shadow:
        0 0 18px rgba(57,255,195,.08),
        inset 0 0 24px rgba(57,255,195,.035) !important;
}

body.smx-kc-library-page .smx-kc-empty h3{
    color:#ffffff !important;
}

body.smx-kc-library-page .smx-kc-empty p{
    color:rgba(244,255,251,.72) !important;
}

/* Mobile */
@media(max-width:767px){

    body.smx-kc-library-page{
        --smx-kc-inner-rail:20px;
    }

    body.smx-kc-library-page .smx-kc-section{
        padding-left:20px !important;
        padding-right:20px !important;
    }

    body.smx-kc-library-page .smx-kc-topics{
        padding-left:20px !important;
        padding-right:20px !important;
    }
}


/* ============================================================
   RC114 — KNOWLEDGE CORE TOPIC COMMAND CENTER
   ============================================================ */

body.smx-kc-library-page .smx-kc-topic-command{
    width:var(--smx-kc-content-rail, min(1050px, calc(100% - 64px))) !important;
    max-width:var(--smx-kc-content-rail, min(1050px, calc(100% - 64px))) !important;
    margin:0 auto 34px !important;
    box-sizing:border-box;
}

body.smx-kc-library-page .smx-kc-topic-heading{
    margin:0 0 18px;
}

body.smx-kc-library-page .smx-kc-topic-heading span{
    display:block;
    margin-bottom:6px;
    color:#45ffc4 !important;
    font-size:11px;
    font-weight:800;
    letter-spacing:.22em;
    text-transform:uppercase;
}

body.smx-kc-library-page .smx-kc-topic-heading h2{
    margin:0 !important;
    color:#f4fffb !important;
    font-size:30px;
    line-height:1.1;
    text-align:left !important;
}

body.smx-kc-library-page .smx-kc-topic-grid{
    display:grid !important;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:12px;
    width:100%;
}

body.smx-kc-library-page .smx-kc-topic-widget{
    position:relative;
    min-height:158px;
    display:flex !important;
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start;
    padding:18px 15px 16px;
    box-sizing:border-box;
    overflow:hidden;
    text-decoration:none !important;

    color:#f4fffb !important;

    border:1px solid rgba(69,255,196,.30);
    border-radius:12px;

    background:
        linear-gradient(145deg,
            rgba(8,39,30,.92),
            rgba(2,19,15,.96));

    box-shadow:
        inset 0 0 24px rgba(0,255,180,.035),
        0 0 0 rgba(69,255,196,0);

    transition:
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease,
        background .22s ease;
}

body.smx-kc-library-page .smx-kc-topic-widget::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
        linear-gradient(135deg,
            rgba(69,255,196,.09),
            transparent 35%,
            transparent 70%,
            rgba(69,255,196,.04));
}

body.smx-kc-library-page .smx-kc-topic-widget:hover,
body.smx-kc-library-page .smx-kc-topic-widget.is-active{
    transform:translateY(-3px);
    border-color:#45ffc4;
    background:
        linear-gradient(145deg,
            rgba(7,56,42,.98),
            rgba(2,22,17,.98));
    box-shadow:
        0 0 18px rgba(69,255,196,.16),
        inset 0 0 25px rgba(69,255,196,.07);
}

body.smx-kc-library-page .smx-kc-topic-icon{
    position:relative;
    z-index:1;
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    margin-bottom:17px;

    border:1px solid rgba(69,255,196,.70);
    border-radius:12px;

    color:#45ffc4 !important;
    font-size:20px;
    font-weight:800;

    background:rgba(1,25,18,.85);

    box-shadow:
        0 0 15px rgba(69,255,196,.12),
        inset 0 0 15px rgba(69,255,196,.05);
}

body.smx-kc-library-page .smx-kc-topic-name{
    position:relative;
    z-index:1;
    display:block;
    color:#f4fffb !important;
    font-size:15px;
    font-weight:700;
    line-height:1.2;
}

body.smx-kc-library-page .smx-kc-topic-count{
    position:relative;
    z-index:1;
    display:block;
    margin-top:8px;
    color:rgba(216,244,236,.68) !important;
    font-size:12px;
}

body.smx-kc-library-page .smx-kc-topic-arrow{
    position:absolute;
    z-index:2;
    right:13px;
    bottom:12px;
    color:#45ffc4 !important;
    font-size:17px;
    opacity:.75;
}

body.smx-kc-library-page .smx-kc-topic-widget:hover .smx-kc-topic-arrow{
    opacity:1;
    transform:translateX(3px);
}

/* Article cards become the next visual layer beneath the topic system. */
body.smx-kc-library-page .smx-kc-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}

body.smx-kc-library-page .smx-kc-card{
    min-height:220px;
    border:1px solid rgba(69,255,196,.25) !important;
    border-radius:14px !important;
    background:
        linear-gradient(145deg,
            rgba(7,31,24,.97),
            rgba(2,17,13,.98)) !important;
    box-shadow:
        inset 0 0 30px rgba(69,255,196,.035),
        0 0 0 rgba(69,255,196,0) !important;
    transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease !important;
}

body.smx-kc-library-page .smx-kc-card:hover{
    transform:translateY(-3px);
    border-color:rgba(69,255,196,.65) !important;
    box-shadow:
        0 0 20px rgba(69,255,196,.12),
        inset 0 0 30px rgba(69,255,196,.06) !important;
}

body.smx-kc-library-page .smx-kc-card h3,
body.smx-kc-library-page .smx-kc-card h3 a{
    color:#45ffc4 !important;
}

body.smx-kc-library-page .smx-kc-card p{
    color:#d6eee7 !important;
}

body.smx-kc-library-page .smx-kc-card .smx-kc-read{
    color:#45ffc4 !important;
}

@media(max-width:1100px){
    body.smx-kc-library-page .smx-kc-topic-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media(max-width:767px){
    body.smx-kc-library-page .smx-kc-topic-grid,
    body.smx-kc-library-page .smx-kc-grid{
        grid-template-columns:1fr;
    }

    body.smx-kc-library-page .smx-kc-topic-widget{
        min-height:125px;
    }
}



/* ============================================================
   RC114 — KNOWLEDGE CORE SINGLE ARTICLE EXPERIENCE
   SitesMechanix Knowledge Core
   Futuristic technical knowledge interface
   ============================================================ */


/* ------------------------------------------------------------
   01. GLOBAL ARTICLE CANVAS
   ------------------------------------------------------------ */

body.smx-kc-article-page,
body.smx-kc-article-page #main,
body.smx-kc-article-page .fusion-main-wrapper,
body.smx-kc-article-page .fusion-row,
body.smx-kc-article-page #content{
    background:
        radial-gradient(
            circle at 50% 8%,
            rgba(0,255,180,.075),
            transparent 34%
        ),
        radial-gradient(
            circle at 12% 55%,
            rgba(0,255,160,.035),
            transparent 28%
        ),
        linear-gradient(
            180deg,
            #020c0a 0%,
            #031411 42%,
            #020907 100%
        ) !important;
    color:#eafff7 !important;
}


/* ------------------------------------------------------------
   02. KNOWLEDGE SHELL
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-shell{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 0 90px !important;
    position:relative;
    overflow:hidden;
    background:
        linear-gradient(
            180deg,
            rgba(0,18,14,.98),
            rgba(1,10,8,.98)
        ) !important;
}


/* subtle technical grid */

body.smx-kc-article-page .smx-kc-shell::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:.18;
    background-image:
        linear-gradient(
            rgba(0,255,180,.045) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(0,255,180,.045) 1px,
            transparent 1px
        );
    background-size:42px 42px;
    mask-image:linear-gradient(
        to bottom,
        black,
        transparent 72%
    );
}


/* ------------------------------------------------------------
   03. ARTICLE MASTER RAIL
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-article{
    width:min(1180px,calc(100% - 48px)) !important;
    max-width:1180px !important;
    margin:0 auto !important;
    position:relative;
    z-index:2;
}


/* ------------------------------------------------------------
   04. ARTICLE HERO
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-article-head{
    position:relative;
    margin:48px 0 0 !important;
    padding:58px 68px 52px !important;
    border:1px solid rgba(0,255,180,.22);
    border-radius:28px;
    overflow:hidden;

    background:
        radial-gradient(
            circle at 78% 35%,
            rgba(0,255,180,.12),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            rgba(3,29,23,.98),
            rgba(1,14,11,.98)
        );

    box-shadow:
        0 30px 90px rgba(0,0,0,.45),
        inset 0 0 80px rgba(0,255,180,.025);
}


/* technical corner treatment */

body.smx-kc-article-page .smx-kc-article-head::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:180px;
    height:2px;
    background:
        linear-gradient(
            90deg,
            #36ffc2,
            transparent
        );
    box-shadow:0 0 18px rgba(54,255,194,.7);
}

body.smx-kc-article-page .smx-kc-article-head::after{
    content:"KNOWLEDGE CORE // FIELD NOTE";
    position:absolute;
    right:30px;
    top:25px;
    color:rgba(95,255,210,.42);
    font:700 9px/1.2 monospace;
    letter-spacing:.18em;
}


/* ------------------------------------------------------------
   05. BREADCRUMBS
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-breadcrumbs{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:26px !important;
    font:700 10px/1.2 monospace;
    letter-spacing:.12em;
    text-transform:uppercase;
}

body.smx-kc-article-page .smx-kc-breadcrumbs a{
    color:#69f5c9 !important;
    text-decoration:none !important;
}

body.smx-kc-article-page .smx-kc-breadcrumbs span{
    color:rgba(255,255,255,.28);
}


/* ------------------------------------------------------------
   06. KICKER
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-kicker{
    color:#35ffc0 !important;
    font:800 10px/1.2 monospace !important;
    letter-spacing:.2em !important;
    text-transform:uppercase;
    text-shadow:0 0 16px rgba(53,255,192,.35);
}


/* ------------------------------------------------------------
   07. TITLE
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-article-head h1{
    max-width:950px !important;
    margin:15px 0 22px !important;

    color:#f5fffb !important;

    font-size:
        clamp(
            42px,
            5.6vw,
            78px
        ) !important;

    line-height:1.02 !important;
    letter-spacing:-.045em !important;
    font-weight:800 !important;

    text-shadow:
        0 0 30px rgba(0,255,180,.08);
}


/* ------------------------------------------------------------
   08. META
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-article-head .smx-kc-meta{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin:20px 0 18px !important;
}

body.smx-kc-article-page .smx-kc-article-head .smx-kc-meta span{
    display:inline-flex;
    align-items:center;
    padding:8px 12px;
    border:1px solid rgba(0,255,180,.18);
    border-radius:999px;
    background:rgba(0,255,180,.035);
    color:rgba(235,255,248,.72) !important;
    font:700 9px/1.2 monospace;
    letter-spacing:.1em;
    text-transform:uppercase;
}


/* ------------------------------------------------------------
   09. TOPIC TAG
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-tags{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

body.smx-kc-article-page .smx-kc-tags a{
    display:inline-flex;
    padding:9px 14px;
    border:1px solid rgba(54,255,194,.3);
    border-radius:999px;

    color:#36ffc2 !important;
    background:
        linear-gradient(
            135deg,
            rgba(0,255,180,.09),
            rgba(0,255,180,.025)
        );

    font:800 10px/1 monospace;
    letter-spacing:.08em;
    text-transform:uppercase;
    text-decoration:none !important;

    box-shadow:
        0 0 20px rgba(0,255,180,.04);
}


/* ------------------------------------------------------------
   10. CONTENT LAYOUT
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-layout{
    display:grid !important;
    grid-template-columns:230px minmax(0,1fr) !important;
    gap:34px !important;

    margin-top:30px !important;
    align-items:start !important;
}


/* ------------------------------------------------------------
   11. TABLE OF CONTENTS
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-toc{
    position:sticky;
    top:25px;

    padding:22px !important;

    border:1px solid rgba(0,255,180,.18);
    border-radius:18px;

    background:
        linear-gradient(
            145deg,
            rgba(4,35,28,.9),
            rgba(1,18,14,.88)
        );

    box-shadow:
        0 20px 55px rgba(0,0,0,.3),
        inset 0 0 30px rgba(0,255,180,.025);
}

body.smx-kc-article-page .smx-kc-toc strong{
    display:block;
    margin-bottom:15px;

    color:#36ffc2 !important;

    font:800 9px/1.2 monospace;
    letter-spacing:.16em;
    text-transform:uppercase;
}

body.smx-kc-article-page .smx-kc-toc-list{
    display:grid;
    gap:7px;
}

body.smx-kc-article-page .smx-kc-toc-list a{
    display:block;
    padding:8px 9px;

    color:rgba(238,255,248,.68) !important;

    border-left:1px solid rgba(0,255,180,.15);

    font-size:12px;
    line-height:1.4;
    text-decoration:none !important;

    transition:
        color .18s ease,
        border-color .18s ease,
        background .18s ease;
}

body.smx-kc-article-page .smx-kc-toc-list a:hover{
    color:#5dffd0 !important;
    border-left-color:#36ffc2;
    background:rgba(0,255,180,.045);
}


/* ------------------------------------------------------------
   12. ARTICLE READING SURFACE
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-content{
    min-width:0 !important;
    padding:48px 58px 60px !important;

    border:1px solid rgba(0,255,180,.13);
    border-radius:24px;

    background:
        linear-gradient(
            145deg,
            rgba(5,30,24,.97),
            rgba(2,17,13,.97)
        );

    box-shadow:
        0 25px 70px rgba(0,0,0,.32),
        inset 0 0 55px rgba(0,255,180,.018);
}


/* ------------------------------------------------------------
   13. ARTICLE TYPOGRAPHY
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-content,
body.smx-kc-article-page .smx-kc-content p,
body.smx-kc-article-page .smx-kc-content li{
    color:#d8eee7 !important;
}

body.smx-kc-article-page .smx-kc-content p{
    max-width:780px;
    margin:0 0 22px !important;

    font-size:17px !important;
    line-height:1.78 !important;
    letter-spacing:.005em;
}

body.smx-kc-article-page .smx-kc-content h2{
    position:relative;

    margin:58px 0 20px !important;
    padding-top:18px;

    color:#f2fffa !important;

    font-size:
        clamp(
            28px,
            3vw,
            42px
        ) !important;

    line-height:1.12 !important;
    letter-spacing:-.025em !important;
}

body.smx-kc-article-page .smx-kc-content h2::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:72px;
    height:2px;

    background:#36ffc2;
    box-shadow:0 0 12px rgba(54,255,194,.7);
}

body.smx-kc-article-page .smx-kc-content h3{
    margin:38px 0 14px !important;

    color:#72ffd4 !important;

    font-size:22px !important;
    line-height:1.25 !important;
}

body.smx-kc-article-page .smx-kc-content strong{
    color:#f5fffb !important;
}

body.smx-kc-article-page .smx-kc-content a{
    color:#45ffc6 !important;
    text-decoration-color:rgba(69,255,198,.35) !important;
    text-underline-offset:3px;
}


/* ------------------------------------------------------------
   14. LISTS — NOT GROCERY LISTS
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-content ul,
body.smx-kc-article-page .smx-kc-content ol{
    max-width:780px;
    margin:22px 0 30px !important;
    padding:0 !important;

    list-style:none !important;
}

body.smx-kc-article-page .smx-kc-content li{
    position:relative;

    margin:9px 0 !important;
    padding:14px 18px 14px 42px !important;

    border:1px solid rgba(0,255,180,.10);
    border-radius:12px;

    background:
        linear-gradient(
            90deg,
            rgba(0,255,180,.045),
            rgba(0,255,180,.012)
        );

    line-height:1.6 !important;
}

body.smx-kc-article-page .smx-kc-content li::before{
    content:"";
    position:absolute;
    left:17px;
    top:21px;

    width:7px;
    height:7px;

    border-radius:50%;
    background:#36ffc2;

    box-shadow:
        0 0 8px rgba(54,255,194,.9);
}


/* ------------------------------------------------------------
   15. BLOCKQUOTES / CALLOUTS
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-content blockquote{
    max-width:780px;

    margin:32px 0 !important;
    padding:26px 28px !important;

    border:1px solid rgba(0,255,180,.22) !important;
    border-left:3px solid #36ffc2 !important;
    border-radius:16px;

    background:
        radial-gradient(
            circle at 0 50%,
            rgba(0,255,180,.10),
            transparent 42%
        ),
        rgba(0,255,180,.035);

    color:#eafff7 !important;

    box-shadow:
        inset 0 0 30px rgba(0,255,180,.025),
        0 14px 40px rgba(0,0,0,.2);
}


/* ------------------------------------------------------------
   16. CODE / TECHNICAL SECTIONS
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-content pre{
    max-width:850px;

    margin:28px 0 !important;
    padding:22px !important;

    overflow:auto;

    border:1px solid rgba(0,255,180,.18);
    border-radius:14px;

    background:#010806 !important;
    color:#8dffd9 !important;

    box-shadow:
        inset 0 0 35px rgba(0,255,180,.025);
}

body.smx-kc-article-page .smx-kc-content code{
    color:#71ffd2 !important;
}


/* ------------------------------------------------------------
   17. TOOLS
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-tools{
    display:flex;
    justify-content:flex-start;
    gap:10px;

    margin:22px 0 42px !important;
}

body.smx-kc-article-page .smx-kc-tools a,
body.smx-kc-article-page .smx-kc-tools button{
    padding:10px 16px;

    border:1px solid rgba(0,255,180,.22);
    border-radius:999px;

    background:rgba(0,255,180,.035);

    color:#6bffd1 !important;

    font:800 9px/1 monospace;
    letter-spacing:.1em;
    text-transform:uppercase;

    cursor:pointer;
}


/* ------------------------------------------------------------
   18. RELATED KNOWLEDGE
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-related{
    margin-top:45px !important;
    padding:36px !important;

    border:1px solid rgba(0,255,180,.16);
    border-radius:22px;

    background:
        linear-gradient(
            145deg,
            rgba(4,31,25,.96),
            rgba(2,16,13,.96)
        );
}

body.smx-kc-article-page .smx-kc-related .smx-kc-section-head span,
body.smx-kc-article-page .smx-kc-discussion .smx-kc-section-head span{
    color:#36ffc2 !important;

    font:800 9px/1.2 monospace;
    letter-spacing:.16em;
}

body.smx-kc-article-page .smx-kc-related .smx-kc-section-head h2,
body.smx-kc-article-page .smx-kc-discussion .smx-kc-section-head h2{
    color:#f3fffa !important;
    margin:8px 0 24px !important;
}

body.smx-kc-article-page .smx-kc-related-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
}

body.smx-kc-article-page .smx-kc-related-card{
    position:relative;

    display:flex !important;
    justify-content:space-between;
    gap:18px;

    min-height:110px;
    padding:22px;

    border:1px solid rgba(0,255,180,.14);
    border-radius:15px;

    background:rgba(0,255,180,.025);

    color:#ecfff8 !important;
    text-decoration:none !important;

    font-weight:700;

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

body.smx-kc-article-page .smx-kc-related-card:hover{
    transform:translateY(-3px);

    border-color:rgba(54,255,194,.48);

    box-shadow:
        0 14px 35px rgba(0,0,0,.28),
        0 0 25px rgba(0,255,180,.055);
}

body.smx-kc-article-page .smx-kc-related-card span{
    flex:0 0 auto;
    color:#36ffc2;
}


/* ------------------------------------------------------------
   19. JAXIS
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-jaxis-slot{
    margin-top:32px !important;
    min-height:110px;

    border:1px solid rgba(0,255,180,.24);
    border-radius:20px;

    background:
        radial-gradient(
            circle at 10% 50%,
            rgba(0,255,180,.10),
            transparent 35%
        ),
        linear-gradient(
            135deg,
            rgba(3,35,27,.98),
            rgba(1,15,12,.98)
        );

    color:#55ffd0 !important;

    box-shadow:
        0 20px 50px rgba(0,0,0,.25),
        inset 0 0 35px rgba(0,255,180,.025);

    display:flex;
    align-items:center;
    padding:24px 28px !important;

    font:800 11px/1.4 monospace;
    letter-spacing:.08em;
}


/* ------------------------------------------------------------
   20. DISCUSSION
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-discussion{
    margin-top:36px !important;
    padding:30px !important;

    border-top:1px solid rgba(0,255,180,.14);

    color:#b8d5cb !important;
}


/* ------------------------------------------------------------
   21. FEATURED READING ACCENT
   ------------------------------------------------------------ */

body.smx-kc-article-page .smx-kc-content hr{
    border:0 !important;
    height:1px !important;
    margin:42px 0 !important;

    background:
        linear-gradient(
            90deg,
            rgba(54,255,194,.55),
            rgba(54,255,194,.08),
            transparent
        ) !important;
}


/* ------------------------------------------------------------
   22. RESPONSIVE
   ------------------------------------------------------------ */

@media(max-width:900px){

    body.smx-kc-article-page .smx-kc-article{
        width:calc(100% - 28px) !important;
    }

    body.smx-kc-article-page .smx-kc-article-head{
        padding:42px 30px 38px !important;
    }

    body.smx-kc-article-page .smx-kc-layout{
        grid-template-columns:1fr !important;
    }

    body.smx-kc-article-page .smx-kc-toc{
        position:relative;
        top:auto;
    }

    body.smx-kc-article-page .smx-kc-content{
        padding:38px 30px 46px !important;
    }
}

@media(max-width:600px){

    body.smx-kc-article-page .smx-kc-article{
        width:calc(100% - 18px) !important;
    }

    body.smx-kc-article-page .smx-kc-article-head{
        margin-top:20px !important;
        padding:32px 22px !important;
        border-radius:20px;
    }

    body.smx-kc-article-page .smx-kc-article-head::after{
        display:none;
    }

    body.smx-kc-article-page .smx-kc-article-head h1{
        font-size:clamp(38px,12vw,58px) !important;
    }

    body.smx-kc-article-page .smx-kc-content{
        padding:30px 20px 38px !important;
        border-radius:18px;
    }

    body.smx-kc-article-page .smx-kc-content p{
        font-size:16px !important;
        line-height:1.7 !important;
    }

    body.smx-kc-article-page .smx-kc-related{
        padding:24px !important;
    }

    body.smx-kc-article-page .smx-kc-related-grid{
        grid-template-columns:1fr !important;
    }
}


/* ============================================================
   RC114 END
   ============================================================ */


/* ============================================================
   RC115 — KNOWLEDGE ARTICLE DARK CANVAS
   The article must be a self-contained Knowledge Core surface.
   Do NOT inherit Avada's white article/page canvas.
   ============================================================ */

/* ------------------------------------------------------------
   ARTICLE OUTER SURFACE
   ------------------------------------------------------------ */

body:has(.smx-kc-article),
body:has(.smx-kc-shell){
    background:#020b09 !important;
}

/* Kill Avada's light content canvas ONLY when Knowledge Article
   markup is present. */
body:has(.smx-kc-article) #main,
body:has(.smx-kc-article) .fusion-row,
body:has(.smx-kc-article) .post-content,
body:has(.smx-kc-article) .fusion-post-content,
body:has(.smx-kc-shell) #main{
    background:#020b09 !important;
}

/* ------------------------------------------------------------
   KNOWLEDGE ARTICLE SHELL
   ------------------------------------------------------------ */

.smx-kc-article,
.smx-kc-shell{
    position:relative !important;
    background:
        radial-gradient(
            circle at 78% 12%,
            rgba(0,255,180,.09),
            transparent 28%
        ),
        radial-gradient(
            circle at 18% 70%,
            rgba(0,255,170,.045),
            transparent 32%
        ),
        linear-gradient(
            180deg,
            #03120f 0%,
            #020b09 48%,
            #010706 100%
        ) !important;

    color:#f4fffb !important;
    border:1px solid rgba(0,255,180,.18) !important;
    border-radius:24px !important;
    box-shadow:
        0 0 45px rgba(0,255,180,.06),
        inset 0 0 70px rgba(0,255,170,.025) !important;

    overflow:hidden !important;
}

/* ------------------------------------------------------------
   ARTICLE CONTENT
   ------------------------------------------------------------ */

.smx-kc-article *,
.smx-kc-shell *{
    box-sizing:border-box;
}

.smx-kc-article .smx-kc-content,
.smx-kc-shell .smx-kc-content{
    color:#eafff8 !important;
}

.smx-kc-article p,
.smx-kc-article li,
.smx-kc-shell p,
.smx-kc-shell li{
    color:rgba(234,255,248,.86) !important;
}

/* ------------------------------------------------------------
   HEADINGS
   ------------------------------------------------------------ */

.smx-kc-article h1,
.smx-kc-article h2,
.smx-kc-article h3,
.smx-kc-article h4,
.smx-kc-article h5,
.smx-kc-article h6,
.smx-kc-shell h1,
.smx-kc-shell h2,
.smx-kc-shell h3,
.smx-kc-shell h4,
.smx-kc-shell h5,
.smx-kc-shell h6{
    color:#f5fffc !important;
    text-shadow:0 0 18px rgba(0,255,180,.10) !important;
}

/* Main article title */
.smx-kc-article-head h1,
.smx-kc-shell .smx-kc-article-head h1{
    color:#ffffff !important;
}

/* Accent headings */
.smx-kc-article h2,
.smx-kc-article h3,
.smx-kc-shell h2,
.smx-kc-shell h3{
    color:#43ffc0 !important;
}

/* ------------------------------------------------------------
   LINKS
   ------------------------------------------------------------ */

.smx-kc-article a,
.smx-kc-shell a{
    color:#42ffc0 !important;
    text-decoration-color:rgba(66,255,192,.35) !important;
}

.smx-kc-article a:hover,
.smx-kc-shell a:hover{
    color:#8affdc !important;
    text-shadow:0 0 12px rgba(66,255,192,.45) !important;
}

/* ------------------------------------------------------------
   ARTICLE HEADER
   ------------------------------------------------------------ */

.smx-kc-article-head{
    background:
        linear-gradient(
            135deg,
            rgba(0,255,180,.08),
            rgba(0,0,0,.18)
        ) !important;

    border-bottom:1px solid rgba(0,255,180,.18) !important;
}

/* ------------------------------------------------------------
   TABLE OF CONTENTS
   ------------------------------------------------------------ */

.smx-kc-toc{
    background:
        linear-gradient(
            145deg,
            rgba(0,255,180,.075),
            rgba(0,20,16,.82)
        ) !important;

    border:1px solid rgba(0,255,180,.20) !important;
    box-shadow:
        inset 0 0 25px rgba(0,255,170,.025),
        0 0 20px rgba(0,255,170,.04) !important;

    color:#eafff8 !important;
}

.smx-kc-toc *,
.smx-kc-toc a{
    color:#dffff4 !important;
}

.smx-kc-toc a:hover{
    color:#42ffc0 !important;
}

/* ------------------------------------------------------------
   CODE / COMMAND / TECHNICAL BLOCKS
   ------------------------------------------------------------ */

.smx-kc-article pre,
.smx-kc-article code,
.smx-kc-shell pre,
.smx-kc-shell code{
    background:#010807 !important;
    color:#8affdc !important;
    border-color:rgba(0,255,180,.20) !important;
}

.smx-kc-article pre,
.smx-kc-shell pre{
    border:1px solid rgba(0,255,180,.18) !important;
    border-radius:12px !important;
    box-shadow:
        inset 0 0 25px rgba(0,255,170,.025),
        0 0 18px rgba(0,255,170,.035) !important;
}

/* ------------------------------------------------------------
   BLOCKQUOTES / CALLOUTS
   ------------------------------------------------------------ */

.smx-kc-article blockquote,
.smx-kc-shell blockquote{
    background:
        linear-gradient(
            135deg,
            rgba(0,255,180,.08),
            rgba(0,0,0,.18)
        ) !important;

    color:#eafff8 !important;
    border-left:3px solid #32ffb2 !important;
}

/* ------------------------------------------------------------
   TABLES
   ------------------------------------------------------------ */

.smx-kc-article table,
.smx-kc-shell table{
    background:#03120f !important;
    color:#eafff8 !important;
    border-color:rgba(0,255,180,.18) !important;
}

.smx-kc-article th,
.smx-kc-article td,
.smx-kc-shell th,
.smx-kc-shell td{
    color:#eafff8 !important;
    border-color:rgba(0,255,180,.14) !important;
}

.smx-kc-article th,
.smx-kc-shell th{
    background:rgba(0,255,180,.08) !important;
    color:#42ffc0 !important;
}

/* ------------------------------------------------------------
   RELATED CONTENT / JAXIS
   ------------------------------------------------------------ */

.smx-kc-related,
.smx-kc-jaxis-slot{
    background:
        linear-gradient(
            145deg,
            rgba(0,255,180,.06),
            rgba(0,8,6,.75)
        ) !important;

    color:#eafff8 !important;
    border-color:rgba(0,255,180,.18) !important;
}

.smx-kc-related *,
.smx-kc-jaxis-slot *{
    color:inherit !important;
}

/* ------------------------------------------------------------
   HORIZONTAL RULES
   ------------------------------------------------------------ */

.smx-kc-article hr,
.smx-kc-shell hr{
    border:0 !important;
    border-top:1px solid rgba(0,255,180,.18) !important;
    box-shadow:0 0 8px rgba(0,255,180,.08) !important;
}

/* ------------------------------------------------------------
   IMAGES
   ------------------------------------------------------------ */

.smx-kc-article img,
.smx-kc-shell img{
    border-radius:14px !important;
}

/* ------------------------------------------------------------
   REMOVE WHITE AVADA ARTICLE WRAPPERS
   ------------------------------------------------------------ */

body:has(.smx-kc-article) .fusion-post-wrapper,
body:has(.smx-kc-article) .fusion-post-content,
body:has(.smx-kc-article) .fusion-content-widget-area,
body:has(.smx-kc-article) .post,
body:has(.smx-kc-article) article{
    background:transparent !important;
}

/* ------------------------------------------------------------
   MOBILE
   ------------------------------------------------------------ */

@media(max-width:767px){

    .smx-kc-article,
    .smx-kc-shell{
        border-radius:16px !important;
    }

    .smx-kc-article p,
    .smx-kc-shell p{
        font-size:16px;
        line-height:1.75;
    }

}


/* ============================================================
   LAUNCH P0 — KNOWLEDGE ARTICLE WIDTH
   Escape Avada's narrow fusion-row while preserving
   a professional reading column.
   ============================================================ */

body.smx-kc-article-page .smx-kc-shell,
body.smx-public-experience .smx-kc-shell{
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    box-sizing:border-box !important;
}

body.smx-kc-article-page .smx-kc-article,
body.smx-public-experience .smx-kc-article{
    width:min(1180px, calc(100% - 48px)) !important;
    max-width:1180px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
}

body.smx-kc-article-page .smx-kc-layout,
body.smx-public-experience .smx-kc-layout{
    width:100% !important;
    max-width:none !important;
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) 300px !important;
    gap:48px !important;
    box-sizing:border-box !important;
}

body.smx-kc-article-page .smx-kc-content,
body.smx-public-experience .smx-kc-content{
    width:100% !important;
    max-width:820px !important;
    min-width:0 !important;
}

body.smx-kc-article-page .smx-kc-toc,
body.smx-public-experience .smx-kc-toc{
    width:100% !important;
    max-width:300px !important;
    min-width:0 !important;
}

@media(max-width:900px){

    body.smx-kc-article-page .smx-kc-article,
    body.smx-public-experience .smx-kc-article{
        width:calc(100% - 32px) !important;
    }

    body.smx-kc-article-page .smx-kc-layout,
    body.smx-public-experience .smx-kc-layout{
        grid-template-columns:1fr !important;
        gap:28px !important;
    }

    body.smx-kc-article-page .smx-kc-content,
    body.smx-public-experience .smx-kc-content,
    body.smx-kc-article-page .smx-kc-toc,
    body.smx-public-experience .smx-kc-toc{
        max-width:none !important;
    }
}