/*
Theme Name: ShadowTelemetry
Theme URI: https://shadowtelemetry.com
Author: ShadowTelemetry Team
Author URI: https://shadowtelemetry.com
Description: ShadowTelemetry theme is a clean, modern, and elegant free WordPress theme crafted for bloggers, creators, and content-focused websites. Perfect for niches like fashion, lifestyle, travel, tech, health, beauty, and online magazines, it features a visually appealing layout with a highlighted featured post section, organized content blocks, and a stylish sidebar for better content discovery. Designed with simplicity and readability in mind, ShadowTelemetry theme offers a fully responsive and Retina-ready layout, ensuring your website looks stunning on all devices. The intuitive navigation, minimal typography, and balanced spacing create a smooth and engaging user experience. The theme is lightweight, SEO-optimized, and easy to customize, making it suitable for both beginners and experienced users. It also supports WooCommerce integration for creating an online store and includes RTL support for broader accessibility. Whether you're building a personal blog or a professional content platform, ShadowTelemetry theme provides a polished, performance-focused foundation to showcase your content beautifully.
Template: shadowtelemetry-parent
Version: 1.0.9
Requires at least: 5.3
Tested up to: 6.9
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: shadowtelemetry
Tags: blog, one-column, two-columns, three-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-menu, custom-logo, featured-images, footer-widgets, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, e-commerce
*/


/*
Customization of this theme starts here
*/

/* style.css */


/*--------------------------------------------------------------
Header Sections
--------------------------------------------------------------*/
body {
    background-color: #ffffff;
}

#site-menu {
    text-align: left;
}

.entry-header {
    height: 150px;
    border-bottom: none;
}

.blog .post-title {
    font-size: 28px;
    line-height: 38px;
}

.blog article .post-meta {
    margin-bottom: 10px;
}

.blog .post-page-content {
    padding-top: 10px;
}

#main-navigation {
    background-color: #f2f2f2;
    border: none;
    text-align: center;
}

.site-menu-wrapper {
    margin: 0 auto;   
}

#top-navigation {
    background-color: #e8400c;
    color: #ffffff;
    border-bottom: 1px solid #dddddd;
}

aside .st_parent-widget h2, 
.st_parent-widget .widget-title {
    background: transparent;
    border: none;
    font-weight: 700;
    font-family: Montserrat, sans-serif;
    font-size: 16px;
    color: #111111;
    text-align: left;
    text-transform: none;
    letter-spacing: 0;
    padding: 0 0 12px;
    margin-bottom: 16px;
    position: relative;
    display: block;
    overflow: visible;
    width: 100%;
}

aside .st_parent-widget h2::after,
.st_parent-widget .widget-title::after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(to right, #e8400c 50px, #e8e8e8 50px);
    border: none;
}

aside .st_parent-widget h2::after {
    border-top: none;
}

#st_parent-post-slider .owl-stage-outer:after {
    background-color: #f2f2f2;
}

#st_parent-post-slider .owl-nav {
    background-color: #f2f2f2;
}

.post-title {
    word-wrap: break-word;
}

.st_parent-slider-title {
    width: 460px;
    word-wrap: break-word;
}

@media screen and (max-width: 480px) {
    .st_parent-slider-title {
        width: 300px;
    }
}

.site-images {
    min-height: 245px;
    background: #f2f2f2;
}

#site-footer {
    background: #f2f2f2;
}

#site-footer .st_parent-widget .widget-title {
    border: none;
    font-weight: 700;
    background: transparent;
    color: #111111;
    font-family: Montserrat, sans-serif;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 1.4;
    margin-bottom: 16px;
    overflow: visible;
    padding: 0 0 12px;
    position: relative;
    text-align: left;
    text-transform: none;
    display: block;
    width: 100%;
}

#site-footer .st_parent-widget .widget-title::after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(to right, #e8400c 50px, #e8e8e8 50px);
    border: none;
}

.footer-widgets {
    border-bottom: 1px solid #a19376;    
}

.single .post-date {
    color: #111111 !important;
    font-family: 'Lato', sans-serif;
    font-size: 13px;
}

.single .post-title-author { 
    color: #111111 !important;
    display: inline-block;
    font-family: 'Lato', sans-serif;
    font-size: 13px;
    font-weight: normal;
}

@media screen and (max-width: 480px) {
    .content-column > li {
        width: 100%;
    }
}

/*--------------------------------------------------------------
Trending Ticker Bar
--------------------------------------------------------------*/

#trending-ticker-bar {
    width: 100%;
    background: #ffffff;
    border-bottom: 1px solid #e8e8e8;
    overflow: hidden;
    z-index: 1100;
    position: relative;
}

.trending-ticker-inner {
    display: flex;
    align-items: center;
    height: 44px;
    max-width: 100%;
}

/* Label badge */
.trending-ticker-label {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    background: #e8400c;
    color: #ffffff;
    font-family: Montserrat, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 0 16px;
    height: 100%;
    white-space: nowrap;
    z-index: 2;
}

.trending-ticker-icon {
    font-size: 13px;
    line-height: 1;
}

/* Scrolling track wrapper — clips overflow */
.trending-ticker-track-wrap {
    flex: 1;
    overflow: hidden;
    position: relative;
    height: 100%;
    /* Fade edges */
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 3%, black 97%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0%, black 3%, black 97%, transparent 100%);
}

/* The moving track */
.trending-ticker-track {
    display: flex;
    align-items: center;
    height: 100%;
    white-space: nowrap;
    animation: ticker-scroll 15s linear infinite;
    will-change: transform;
}

.trending-ticker-track:hover {
    animation-play-state: paused;
}

@keyframes ticker-scroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* Individual post item */
.trending-ticker-item {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 0 30px 0 0;
    text-decoration: none;
    color: inherit;
    flex-shrink: 0;
}

.trending-ticker-item:hover .trending-ticker-title {
    color: #e8400c;
}

/* Thumbnail */
.trending-ticker-thumb {
    width: 30px !important;
    height: 30px !important;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    border: 2px solid #e8e8e8;
}

.trending-ticker-no-thumb {
    display: inline-block;
    background-color: #e0e0e0;
}

/* Date */
.trending-ticker-date {
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    color: #999999;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Title */
.trending-ticker-title {
    font-family: Montserrat, sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #222222;
    white-space: nowrap;
    transition: color 0.2s ease;
}

/* Separator dot between items */
.trending-ticker-item::after {
    content: '';
    display: inline-block;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #dddddd;
    margin-left: 25px;
    flex-shrink: 0;
}

.trending-ticker-item:last-child::after {
    display: none;
}

@media (max-width: 480px) {
    .trending-ticker-label {
        padding: 0 12px;
        font-size: 10px;
    }
    .trending-ticker-title {
        font-size: 12px;
    }
    .trending-ticker-date {
        display: none;
    }
}

/*--------------------------------------------------------------
Top Navigation
--------------------------------------------------------------*/

#top-navigation {
  text-align: center;
  box-shadow: 0px 1px 5px rgba(0,0,0, 0.1);
  border-bottom: 1px solid #e4e4e4;
}

#top-menu {
  display: inline-block;
}

#top-menu li {
  position: relative;
}

#top-menu > li.menu-item-has-children > a:after {
    content: none;
    display: none;
}

#top-menu ul li.menu-item-has-children>a:after {
    font-family: FontAwesome;
    content: "\f105";
    font-size: 14px;
    float: right;
}

#top-menu > li {
  display: inline-block;
  list-style: none;
}

#top-menu li a {
  display: block;
  position: relative;
  padding: 0 5px;
  margin-left: 5px;
  color: #ffffff;
}

#top-menu a:focus {
  outline: 3px dotted #000000 !important;
}

#top-menu li a:first-child {
  margin-left: 0;
}

#top-menu > li > a {
  display: block;
  text-decoration: none;
}

#top-menu > li:first-child > a {
  padding-left: 0px;
}

#top-menu > li:last-child > a {
  padding-right: 0px;
}

#top-menu ul ul {
  top: -1px;
  left: 100%;
}

#top-menu .sub-menu {
  position: absolute;
  left: -999em;
  z-index: 1101;
  width: 170px;
  text-align: left;
  border: 1px solid #e4e4e4;
  border-width: 1px;
  opacity: 0;
}

#top-menu .menu-item:hover > ul, #top-menu .menu-item:focus-within > ul {
  left: 0;
  opacity: 1;
}

#top-menu .menu-item:hover ul ul, #top-menu .menu-item:focus-within ul ul{
  left: 100%;
}

#top-menu .sub-menu a {
  border-bottom-style: solid;
  border-bottom-width: 1px; 
}

#top-menu .sub-menu > li:last-of-type > a {
  border: none;
}

#top-menu .sub-menu li:first-child > .sub-menu {
  margin-top: -1px;
}

#top-menu .sub-menu > li > a {
  display: block;
  width: 100%;
  padding: 8px 15px;
  margin: 0;
}

#top-menu li a {
  font-size: 11px;
  line-height: 40px;
  letter-spacing: 1px;
  font-weight: 600;
  text-transform: uppercase;
}
#top-menu .sub-menu > li > a {
  font-size: 11px;
  line-height: 24px;
  letter-spacing: 0.5px;
}

#top-menu li a {
  font-size: 11px;
  line-height: 40px;
  letter-spacing: 1px;
  font-weight: 600;
}
#top-menu .sub-menu > li > a {
  font-size: 11px;
  line-height: 22px;
  letter-spacing: 0.5px;
}

#top-menu li a,
#main-menu li a {
  text-transform: uppercase;
}

#top-navigation > div {
  padding-left: 30px;
  padding-right: 30px;
}

.post-categories {
    background: #f2f2f2;
    border: 1px solid #dfd6c5;
}

.st_parent-small-image-box {
    background-color: #f2f2f2;
    border-radius: 10px;
}

.wp-block-search__button {
    background: #f2f2f2;
    border: 1px solid #dddddd;
}

#main-navigation #searchform #s {
    border: 1px solid #bdb29b;
}

#main-navigation #searchform #searchsubmit, .close-st_parent-search {
    background: #f2f2f2;
    border: 1px solid #dddddd;
}


#st_parent-post-slider {
    padding-bottom: 40px;
    margin-top: 40px;
}

.widget_categories > ul > li {
    border-bottom: 1px solid #f2f2f2;
}

aside .wp-block-latest-posts.wp-block-latest-posts__list li {
    border-bottom: 1px solid #f2f2f2;
}

.wp-block-search__label {
    display: none;
}


/*--------------------------------------------------------------
Featured Boxes Sections
--------------------------------------------------------------*/

#featured-boxes {
  border-bottom: 1px solid #eee;
  background: #fff;
  margin-top: 40px;
}

#featured-boxes .wrapped-content {
  font-size: 0;
  text-align: center;
}

#featured-boxes .featured-box {
  position: relative;
  float: left;
}

#featured-boxes .featured-box img {
  border-radius: 14px;
}

#featured-boxes a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


#featured-boxes .st_parent-wrap-outer {
  padding: 12px;
}

#featured-boxes h4 {
  display: inline-block;
  padding: 11px 20px;
  font-family: 'Lato', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  background-color: rgba(0,0,0,0.50);
  color: #ffffff !important;
}

#featured-boxes .featured-box {
    width: calc((100% - 50px ) /3);
    width: -webkit-calc((100% - 70px ) /3);
    margin-right: 34px;
}

#featured-boxes .featured-box:last-child {
    margin-right: 0;
}


@media screen and (max-width: 768px) {
    .featured-box {
        display: block;
    }
    .main-navigation-search {
        right: 20px;
        top: 14px !important;
    }
}


@media screen and (max-width: 480px) {
    #featured-boxes .featured-box {
        width: 100%;
        margin-bottom: 34px;
    }
    
    #featured-boxes {
      padding: 20px !important;
    }
}


/* Media Query Min 768px
   ========================================================================== */
@media screen and (min-width: 768px) {
    .blog .post-page-content p {
        padding: 0 24px;
    }
    #main-navigation .wrapped-content {
        padding-left: 0;
    }
    .main-navigation-search {
        right: 0;
    }
    #main-navigation .navigation-socials {
        right: 35px;
    }

}



/*--------------------------------------------------------------
Posts Ticker
--------------------------------------------------------------*/

.st_parent-latest {
    margin-bottom: 40px;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* Wrapper — gives padding so the card has breathing room */
.st_parent-latest-posts-ticker {
    background: transparent;
    padding: 0;
    position: relative;
}

.st_parent-latest-posts-ticker .item {
    padding: 10px;
}

/* Hero card — full-bleed background image */
.lpt-card {
    position: relative;
    width: 100%;
    height: 460px;
    border-radius: 14px;
    overflow: hidden;
    background-color: #1a1a2e;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

/* Dark gradient overlay — strong at bottom, fades to transparent at top */
.lpt-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0.08) 0%,
        rgba(0, 0, 0, 0.25) 40%,
        rgba(0, 0, 0, 0.75) 75%,
        rgba(0, 0, 0, 0.88) 100%
    );
    border-radius: 14px;
    z-index: 1;
}

/* Bottom content block */
.lpt-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 28px 30px 30px;
    z-index: 2;
}

/* Category badge */
.lpt-category {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(0, 0, 0, 0.45);
    color: #ffffff;
    font-family: Montserrat, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 5px 12px 5px 8px;
    border-radius: 4px;
    margin-bottom: 12px;
}

.lpt-category-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    background-color: #e8400c;
    border-radius: 2px;
    flex-shrink: 0;
}

/* Post title */
.lpt-title {
    margin: 0 0 16px;
    padding: 0;
    font-family: Montserrat, sans-serif;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.3;
    color: #ffffff;
}

.lpt-title a {
    color: #ffffff !important;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.lpt-title a:hover {
    opacity: 0.85;
}

/* Author / date meta row */
.lpt-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #e8e8e8;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
}

.lpt-avatar {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid rgba(255,255,255,0.6);
    flex-shrink: 0;
}

.lpt-author {
    font-weight: 500;
    color: #ffffff;
}

.lpt-divider {
    color: rgba(255,255,255,0.5);
    font-weight: 300;
}

.lpt-date {
    color: #e0e0e0;
}

/* ── Nav buttons — top-right, square with rounded corners ── */
.st_parent-latest-posts-ticker .owl-nav {
    position: absolute;
    top: 20px;
    right: 20px;
    display: flex !important;
    gap: 8px;
    z-index: 10;
    margin: 0;
    pointer-events: none;
}

.st_parent-latest-posts-ticker .owl-nav button {
    pointer-events: all;
    width: 40px !important;
    height: 40px !important;
    background: rgba(255, 255, 255, 0.92) !important;
    border: none !important;
    border-radius: 8px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0,0,0,0.25);
    transition: background 0.2s ease;
    margin: 0 !important;
    padding: 0 !important;
}

.st_parent-latest-posts-ticker .owl-nav button:hover {
    background: #ffffff !important;
}

.st_parent-latest-posts-ticker .owl-nav button span {
    color: #333333 !important;
    font-size: 30px !important;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -5px;
}

/* ── Dots — vertical, left side ── */
.st_parent-latest-posts-ticker .owl-dots {
    position: absolute;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
    display: flex !important;
    flex-direction: column;
    gap: 8px;
    z-index: 10;
    margin: 0 !important;
}

.st_parent-latest-posts-ticker .owl-dots .owl-dot {
    display: block !important;
    margin: 0 !important;
}

.st_parent-latest-posts-ticker .owl-dots .owl-dot span {
    display: block !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.45) !important;
    margin: 0 !important;
    transition: background 0.2s ease, transform 0.2s ease;
}

.st_parent-latest-posts-ticker .owl-dots .owl-dot.active span {
    background: #ffffff !important;
    transform: scale(1.4);
}

/* Responsive */
@media (max-width: 768px) {
    .lpt-card {
        height: 380px;
    }
    .lpt-title {
        font-size: 22px;
    }
    .lpt-content {
        padding: 20px;
    }
}

@media (max-width: 480px) {
    .lpt-card {
        height: 320px;
    }
    .lpt-title {
        font-size: 18px;
        line-height: 1.3;
    }
    .lpt-meta {
        font-size: 12px;
    }
    .st_parent-latest-posts-ticker .owl-nav {
        top: 12px;
        right: 12px;
    }
    .st_parent-latest-posts-ticker .owl-nav button {
        width: 34px !important;
        height: 34px !important;
    }
}


/*--------------------------------------------------------------
Slider Customization
--------------------------------------------------------------*/

#st_parent-post-slider .owl-nav {
   align-items: unset;
   background-color: unset;
   height: unset;
   justify-content: unset;
   margin: unset;
   max-width: unset;
   text-align: unset;
   width: unset;
}
 #st_parent-post-slider .owl-nav button {
   display: unset;
}
 #st_parent-post-slider .owl-nav button:focus {
   box-shadow: unset;
   outline: unset;
}
 #st_parent-post-slider .owl-nav [class*=owl-]:hover {
   background: unset;
}
 #st_parent-post-slider .owl-dots {
   display: unset;
}

#st_parent-post-slider .owl-stage-outer {
border-radius: 14px;
}

 #st_parent-post-slider .owl-stage-outer:after {
   background-color: unset;
   bottom: unset;
   content: unset;
   display: unset;
   height: unset;
   left: unset;
   position: unset;
   transform: unset;
   width: unset;
   z-index: unset;
}
 #st_parent-post-slider .owl-next {
   border-radius: unset;
   margin-left: unset;
   margin-top: unset;
   padding-left: unset;
   position: unset;
}
 #st_parent-post-slider .owl-next span {
   color: unset;
   font-size: unset;
}
 #st_parent-post-slider .owl-next::after {
   background: unset;
   border-radius: unset;
   content: unset;
   height: unset;
   position: unset;
   right: unset;
   top: unset;
   width: unset;
}
 #st_parent-post-slider .owl-prev {
   border-radius: unset;
   margin-right: unset;
   margin-top: unset;
   padding-right: unset;
   position: unset;
}
 #st_parent-post-slider .owl-prev span {
   color: unset;
   font-size: unset;
}
 #st_parent-post-slider .owl-prev::after {
   background: unset;
   border-radius: unset;
   content: unset;
   height: unset;
   position: unset;
   right: unset;
   top: unset;
   width: unset;
}


#st_parent-post-slider {
    padding: 0 4px !important;
}

#st_parent-post-slider .slide-item {
    height: 480px;
}

#st_parent-post-slider {
   padding-bottom: 15px;
}
 #st_parent-post-slider .slider-item:first-child {
   display: block;
}
 #st_parent-post-slider .slide-item {
   background-size: cover;
   background-position: center;
}

#st_parent-post-slider .owl-nav {
    position: absolute;
    top: 44%;
    left: 0;
    width: 100%;
    display: block;
    justify-content: space-between;
    transform: translateY(-50%);
    pointer-events: none; 
}

#st_parent-post-slider .owl-nav button {
    background: rgba(255, 255, 255, 0.6);
    border: none;
    font-size: 60px !important; 
    pointer-events: all;
    color: #777 !important; 
    cursor: pointer;
    padding: 6px 8px 15px 10px !important;
}

#st_parent-post-slider .owl-nav button:hover {
    color: #000 !important; 
}

#st_parent-post-slider .owl-nav [class*=owl-]:hover {
       background: rgba(255, 255, 255, 0.7);
}

#st_parent-post-slider .owl-nav .owl-prev {
    position: absolute;
    left: 10px; 
    border-radius: 5px;
}

#st_parent-post-slider .owl-nav .owl-next {
    position: absolute;
    right: 10px; 
    border-radius: 5px;
}

#st_parent-post-slider .owl-dots {
    margin-top: -32px;
    position: relative;
}

.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background: #fbfbfb;
}


 #st_parent-post-slider .st_parent-wrap-inner {
   vertical-align: bottom;
}
 #st_parent-post-slider.wrapped-content img {
   width: 100%;
}
 #st_parent-post-slider.wrapped-content .slider-item-bg {
   height: 540px;
}
 .slider-item {
   display: none;
   position: relative;
}
 .slider-item-bg {
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
   height: 450px;
}
 .st_parent-slider-info {
   display: inline-block;
   max-width: 840px;
   padding: 40px;
}
 .slider-categories {
   font-size: 13px;
   font-weight: bold;
   letter-spacing: 3px;
   margin-bottom: 16px;
   text-transform: uppercase;
}
 .st_parent-slider-title {
   font-size: 36px;
   letter-spacing: 1px;
   line-height: 44px;
   margin-bottom: 25px;
}
 .st_parent-slider-read-more a {
   background: rgba(255, 255, 255, 0.1);
   border: 1px solid rgba(255, 255, 255, 0.8);
   cursor: pointer;
   display: inline-block;
   font-size: 13px;
   font-weight: bold;
   letter-spacing: 2px;
   line-height: 30px;
   margin-bottom: 30px;
   padding: 0 25px;
   text-transform: uppercase;
}

#st_parent-post-slider .owl-dots {
   display: block !important;
   padding: 0 !important;
}

@media screen and (max-width: 480px) {
    #st_parent-post-slider .owl-nav {
        display: none;
    }
    .st_parent-slider-info {
        padding: 10px;
    }
    .st_parent-slider-title {
        font-size: 24px;
        letter-spacing: 1px;
        line-height: 31px;
        margin-bottom: 25px;
    }
    #st_parent-post-slider .slide-item {
        height: 240px;
    }
}


@media screen and (max-width: 1200px) {
    #st_parent-post-slider.wrapped-content {
        padding-bottom: 12px;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    
}


/* Shine Effect on post images */
.site-images a {
    position: relative;
    display: block;
}
.site-images a::before {
    position: absolute;
    top: 0;
    left: -75%;
    z-index: 2;
    display: block;
    content: '';
    width: 50%;
    height: 100%;
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
    -webkit-transform: skewX(-25deg);
    transform: skewX(-25deg);
}
.site-images a:hover::before {
    -webkit-animation: shine .75s;
    animation: shine .75s;
}
@-webkit-keyframes shine {
    100% {
        left: 125%;
    }
}
@keyframes shine {
    100% {
        left: 125%;
    }
}



/*--------------------------------------------------------------
Home Blog List Layout Customization
--------------------------------------------------------------*/

.blog .content-column li,
.archive .content-column li {
    margin-bottom: 36px;
    padding-bottom: 36px;
    border-bottom: 1px solid #eeeeee;
    list-style: none;
}

.blog .content-column li:last-child,
.archive .content-column li:last-child {
    border-bottom: none;
}

/* Card — flat, no shadow, auto height */
.blog .content-column article,
.archive .content-column article {
    display: flex;
    align-items: flex-start;
    gap: 28px;
    background: #ffffff;
    box-shadow: none;
    height: auto;
    overflow: visible;
}

/* Image column — fixed width, rounded corners */
.blog .post-image-col,
.archive .post-image-col {
    flex: 0 0 300px;
    width: 300px;
}

.blog .post-image-col .site-images,
.archive .post-image-col .site-images {
    height: 220px;
    min-height: unset;
    border-radius: 10px;
    overflow: visible;
    background: #f2f2f2;
}

.blog .site-images a,
.archive .site-images a {
    display: block;
    height: 100%;
    border-radius: 10px;
    overflow: hidden;
}

.blog .site-images a img,
.archive .site-images a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 10px;
}

.blog .site-images .no-thumbnail,
.archive .site-images .no-thumbnail {
    width: 100%;
    height: 100%;
    background-color: #e8e8e8;
    border-radius: 10px;
}

/* Content column */
.blog .post-content-col,
.archive .post-content-col {
    flex: 1;
    padding: 4px 0 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Category badge */
.bl-category-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-family: Montserrat, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: #444444;
    margin-bottom: 4px;
}

.bl-category-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    background-color: #e8400c;
    border-radius: 2px;
    flex-shrink: 0;
}

/* Post title */
.blog .post-title,
.archive .post-title {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
    word-wrap: break-word;
}

.blog .post-title a,
.archive .post-title a {
    color: #111111;
    text-decoration: none;
    transition: color 0.2s ease;
}

.blog .post-title a:hover,
.archive .post-title a:hover {
    color: #e8400c;
}

/* Meta row: By Author • Date */
.bl-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: Montserrat, sans-serif;
    font-size: 13px;
    color: #777777;
    flex-wrap: wrap;
}

.bl-category-badge a {
    color: #444444;
    text-decoration: none;
    transition: color 0.2s ease;
}

.bl-category-badge a:hover {
    color: #e8400c;
}

.bl-author a {
    color: #555555;
    text-decoration: none;
    font-weight: 600;
    transition: color 0.2s ease;
}

.bl-author a:hover {
    color: #e8400c;
}

.bl-meta-dot {
    color: #aaaaaa;
    font-size: 10px;
}

.bl-date {
    color: #777777;
}

/* Excerpt */
.blog .post-page-content,
.archive .post-page-content {
    padding-top: 0;
    margin-top: 0;
}

.blog .post-page-content p,
.archive .post-page-content p {
    padding: 0;
    margin: 0;
    font-size: 15px;
    color: #555555;
    line-height: 1.6;
}

/* Hide post-footer / read more button */
.blog .post-footer,
.archive .post-footer {
    display: none;
}

/* Read More link */
.bl-read-more {
    margin-top: 12px;
}

.bl-read-more a {
    display: inline;
    background: none;
    border: none;
    border-radius: 0;
    padding: 0;
    color: #e8400c;
    font-family: Montserrat, sans-serif;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: color 0.2s ease;
}

.bl-read-more a:hover {
    color: #a07a3a;
    text-decoration: underline;
}

/* Post header reset */
.blog .post-header,
.archive .post-header {
    text-align: unset;
}

/* Responsive — tablet */
@media (max-width: 768px) {
    .blog .content-column article,
    .archive .content-column article {
        flex-direction: column;
        gap: 16px;
    }

    .blog .post-image-col,
    .archive .post-image-col {
        flex: none;
        width: 100%;
    }

    .blog .post-image-col .site-images,
    .archive .post-image-col .site-images {
        height: 240px;
    }

    .blog .post-title,
    .archive .post-title {
        font-size: 20px;
    }
}

/* Responsive — mobile */
@media (max-width: 480px) {
    .blog .post-image-col .site-images,
    .archive .post-image-col .site-images {
        height: 200px;
    }

    .blog .post-title,
    .archive .post-title {
        font-size: 18px;
    }

    .bl-meta {
        font-size: 12px;
    }
}

.navigation-search-button {
    border-radius: 20px;
    cursor: pointer;
    font-size: 14px;
    line-height: 24px;
    position: relative;
}

.main-navigation-search {
    top: 7px;
}

.navigation-search-button i {
    color: #ffffff !important;
}

.continue-read a {
    background: #ffffff;
    border: 1px solid #e8400c;
    color: #e8400c !important;
    text-decoration: none;
}

#main-navigation #searchform #searchsubmit, .close-st_parent-search {
    background: #f2f2f2;
    border: 1px solid #e8400c;
}

.st_parent-latest-articles {
    margin-bottom: 30px;
    margin-top: 70px;
    padding: 0 0 12px;
    text-align: left;
    font-size: 18px;
    font-weight: 700;
    font-family: Montserrat, sans-serif;
    color: #111111;
    border: none;
    display: block;
    position: relative;
}

.st_parent-latest-articles::after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(to right, #e8400c 50px, #e8e8e8 50px);
}





.main-content.wrapped-content {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

@media screen and (max-width: 1180px) {
    .main-content.wrapped-content {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }   
}

.content-post .post-footer {
    padding: 3px 0 !important;
}

.st_parent-pixel-category-title {
    margin-bottom: 30px;
    margin-top: 1px;
    padding: 0 0 12px;
    text-align: left;
    font-size: 18px;
    font-weight: 700;
    font-family: Montserrat, sans-serif;
    color: #111111;
    border: none;
    display: block;
    position: relative;
    width: 100%;
}

.st_parent-pixel-category-title::after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(to right, #e8400c 50px, #e8e8e8 50px);
}

/*--------------------------------------------------------------
Single Post Hero Header
--------------------------------------------------------------*/

/* Hero block */
.sph-hero {
    position: relative;
    width: 100%;
    min-height: 480px;
    border-radius: 12px;
    overflow: hidden;
    background-color: #2a2a2a;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    box-shadow: 0 0 0 1px #e0e0e0;
    margin-bottom: 36px;
    display: flex;
    align-items: flex-end;
}

/* Gradient overlay — only when image present */
.sph-has-image .sph-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0.05) 0%,
        rgba(0, 0, 0, 0.20) 40%,
        rgba(0, 0, 0, 0.72) 75%,
        rgba(0, 0, 0, 0.88) 100%
    );
    z-index: 1;
}

/* Content sits above overlay */
.sph-content {
    position: relative;
    z-index: 2;
    width: 100%;
    padding: 32px 36px 36px;
}

/* Category badges */
.sph-categories {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.sph-cat-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(0, 0, 0, 0.45);
    color: #ffffff !important;
    font-family: Montserrat, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    text-decoration: none;
    padding: 5px 12px 5px 8px;
    border-radius: 20px;
    transition: background 0.2s ease;
}

.sph-cat-badge:hover {
    background: rgba(0, 0, 0, 0.65);
    color: #ffffff !important;
}

.sph-cat-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #e8400c;
    flex-shrink: 0;
}

/* Post title */
.sph-hero .sph-title {
    font-family: Montserrat, sans-serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.3;
    color: #ffffff !important;
    margin: 0 0 18px;
    padding: 0;
    word-wrap: break-word;
}

/* Meta row */
.sph-meta {
    display: flex;
    align-items: center;
    gap: 14px;
}

.sph-avatar {
    width: 44px !important;
    height: 44px !important;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid rgba(255, 255, 255, 0.6);
    flex-shrink: 0;
}

.sph-meta-text {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.sph-author {
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: #ffffff;
    line-height: 1.2;
}

.sph-meta-row {
    display: flex;
    align-items: center;
    gap: 6px;
    font-family: Montserrat, sans-serif;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.8);
    flex-wrap: wrap;
}

.sph-sep {
    color: rgba(255, 255, 255, 0.45);
}

.sph-date,
.sph-read-time {
    color: rgba(255, 255, 255, 0.85);
}

.sph-comments {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: rgba(255, 255, 255, 0.85);
}

.sph-comment-icon {
    display: inline-block;
    vertical-align: middle;
    margin-top: -1px;
}

/* No-image fallback — dark grey, no overlay needed */
.sph-no-image .sph-content {
    padding-top: 60px; /* extra top padding since no image above */
}

/* Responsive */
@media (max-width: 768px) {
    .sph-hero {
        min-height: 380px;
        border-radius: 8px;
    }
    .sph-title {
        font-size: 24px;
    }
    .sph-content {
        padding: 24px 20px 28px;
    }
}

@media (max-width: 480px) {
    .sph-hero {
        min-height: 300px;
    }
    .sph-title {
        font-size: 20px;
    }
    .sph-meta-row {
        font-size: 12px;
    }
    .sph-avatar {
        width: 36px !important;
        height: 36px !important;
    }
}


/*--------------------------------------------------------------
Additional Customizations
--------------------------------------------------------------*/

/* Remove featured boxes border */
#featured-boxes {
	border-bottom: none;
}

/* Media widget image rounded corners */
#media_image-3 img {
	border-radius: 10px;
}

/* Blog post title styling */
.blog .post-title {
	font-size: 28px !important;
	line-height: 36px !important;
	margin-bottom: 10px !important;
}

/* Blog listing author link */
.bl-author a {
	color: #555555 !important;
	text-decoration: none;
	font-weight: 500;
	transition: color 0.2s ease;
}

/* Latest posts ticker item padding */
.st_parent-latest-posts-ticker .item {
	padding: 0px;
}

/* Single post hero author link */
.sph-author a {
	color: #ffffff !important;
	text-decoration: none;
	transition: opacity 0.2s ease;
}

.sph-author a:hover {
	opacity: 0.85;
}

/* Polished Dark Mode Overrides */
body.dark-mode,
body.dark-mode #site-container,
body.dark-mode .site-content,
body.dark-mode .main-content,
body.dark-mode #primary,
body.dark-mode .entry-header,
body.dark-mode article,
body.dark-mode .post-page-content {
    background-color: #121212 !important;
    color: #e0e0e0 !important;
}

body.dark-mode #main-navigation,
body.dark-mode .site-images,
body.dark-mode #site-footer,
body.dark-mode #trending-ticker-bar,
body.dark-mode .st_parent-small-image-box,
body.dark-mode .post-categories,
body.dark-mode .st_parent-search,
body.dark-mode .wp-block-search__button,
body.dark-mode .featured-box h4,
body.dark-mode #st_parent-post-slider .owl-stage-outer:after,
body.dark-mode #st_parent-post-slider .owl-nav {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
    border-color: #333333 !important;
}

body.dark-mode .trending-ticker-title,
body.dark-mode .widget-title,
body.dark-mode h1, body.dark-mode h2, body.dark-mode h3, 
body.dark-mode h4, body.dark-mode h5, body.dark-mode h6,
body.dark-mode h1 a, body.dark-mode h2 a, body.dark-mode h3 a,
body.dark-mode .single .post-title-author,
body.dark-mode .single .post-date,
body.dark-mode .site-branding a,
body.dark-mode .site-description,
body.dark-mode a {
    color: #ffffff !important;
}

body.dark-mode a:hover {
    color: #e8400c !important;
}

body.dark-mode #top-navigation {
    background-color: #1e1e1e !important;
    border-bottom: 1px solid #333333 !important;
}

body.dark-mode #top-menu .sub-menu {
    background-color: #1e1e1e !important;
    border-color: #333333 !important;
}

body.dark-mode #top-menu .sub-menu > li > a {
    color: #ffffff !important;
    border-bottom-color: #333333 !important;
}

body.dark-mode #top-menu .sub-menu > li > a:hover,
body.dark-mode #top-menu .sub-menu > li > a:focus {
    color: #ff9b70 !important;
    background-color: #242424 !important;
}

body.dark-mode .lpt-card {
    background-color: #000000 !important;
}

body.dark-mode .trending-ticker-label {
    background: #cc3609 !important;
}

/*--------------------------------------------------------------
Most Viewed Widget
--------------------------------------------------------------*/
.st-most-viewed-posts {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.st-mv-post-item {
    display: flex;
    align-items: center;
    gap: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #f2f2f2;
}

.st-mv-post-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.st-mv-post-thumb {
    flex-shrink: 0;
    width: 70px;
    height: 70px;
    border-radius: 8px;
    overflow: hidden;
}

.st-mv-post-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.st-mv-post-thumb:hover img {
    transform: scale(1.05);
}

body.dark-mode .st-mv-post-item {
    border-bottom-color: #333333;
}

body.dark-mode .st-mv-post-title a {
    color: #e0e0e0 !important;
}

body.dark-mode .st-mv-post-title a:hover {
    color: #e8400c !important;
}

.st-mv-post-details {
    flex: 1;
}

.st-mv-post-title {
    margin: 0 0 5px;
    font-size: 14px;
    line-height: 1.4;
    font-family: Montserrat, sans-serif;
    font-weight: 600;
}

.st-mv-post-title a {
    color: #111111 !important;
    text-decoration: none;
    transition: color 0.2s ease;
}

.st-mv-post-title a:hover {
    color: #e8400c !important;
}

.st-mv-post-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    font-size: 11px;
    color: #888888;
    font-family: Montserrat, sans-serif;
}

.st-mv-post-views {
    color: #e8400c;
    font-weight: 600;
}

.st-threat-intel-posts .st-mv-post-thumb {
    display: none !important;
}

.st-threat-intel-posts .st-mv-post-item {
    padding-left: 0;
}

.st-threat-intel-posts .st-mv-post-details {
    width: 100%;
}

.st-threat-intel-posts .st-mv-post-title {
    font-size: 14px;
    line-height: 1.35;
}


/* Responsiveness for smaller screens if in main column etc, though sidebar usually stacks */
@media (max-width: 480px) {
    .st-mv-post-thumb {
        width: 60px;
        height: 60px;
    }
    .st-mv-post-title {
        font-size: 13px;
    }
}

/* Custom Sidebar Width (Widened right sidebar without squeezing main content) */
@media screen and (min-width: 1024px) {
    .wrapped-content {
        /* Increase max-width by 60px to accommodate wider sidebar */
        max-width: 1260px !important;
    }
    .sidebar-right {
        /* Default is roughly 300-320px depending on gutter. Make it slightly wider. */
        width: 380px !important;
    }
    [data-layout*="rightsidebar"] .content-wrap {
        width: calc(100% - 380px) !important;
    }
}

/*--------------------------------------------------------------
ShadowTelemetry Professional Motion And Homepage Console
--------------------------------------------------------------*/
:root {
    --st-ink: #111827;
    --st-muted: #5b6472;
    --st-panel: #ffffff;
    --st-panel-soft: #f6f8fb;
    --st-line: #dfe5ec;
    --st-accent: #e8400c;
    --st-cyan: #0ea5b7;
    --st-green: #18a058;
}

body {
    position: relative;
}

body::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(14, 165, 183, 0.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(232, 64, 12, 0.045) 1px, transparent 1px);
    background-size: 46px 46px, 46px 46px;
    opacity: 0.62;
}

#site-container,
#primary,
#site-footer {
    position: relative;
    z-index: 1;
}

#main-menu > li > a {
    position: relative;
}

#main-menu > li > a::after {
    content: '';
    position: absolute;
    right: 50%;
    bottom: 7px;
    left: 50%;
    height: 2px;
    background: linear-gradient(90deg, var(--st-accent), var(--st-cyan));
    transition: left 0.22s ease, right 0.22s ease;
}

#main-menu > li > a:hover::after,
#main-menu > li.current-menu-item > a::after {
    right: 8px;
    left: 8px;
}

.site-branding a,
.logo-img img {
    transition: transform 0.28s ease, filter 0.28s ease;
}

.site-branding a:hover,
.logo-img:hover img {
    transform: translateY(-2px);
    filter: drop-shadow(0 12px 18px rgba(14, 165, 183, 0.16));
}

#wp-theme-toggle:hover {
    transform: rotate(12deg) scale(1.08);
}

#wp-theme-toggle:focus-visible {
    outline: 2px solid var(--st-cyan) !important;
    outline-offset: 4px;
    border-radius: 999px;
}

.st-showcase {
    background:
        linear-gradient(135deg, rgba(17, 24, 39, 0.96), rgba(24, 33, 48, 0.94)),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.08) 0 1px, transparent 1px 80px);
    color: #ffffff;
    margin: 0 0 34px;
    overflow: hidden;
    position: relative;
}

.st-showcase::after {
    content: '';
    position: absolute;
    inset: auto 0 0;
    height: 3px;
    background: linear-gradient(90deg, var(--st-accent), var(--st-cyan), var(--st-green));
}

.st-showcase-inner {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(420px, 1.05fr);
    gap: 34px;
    align-items: center;
    max-width: 1260px;
    margin: 0 auto;
    padding: 34px 20px 38px;
}

.st-showcase-copy {
    max-width: 590px;
}

.st-showcase-kicker {
    color: #72e5f1;
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.6px;
    line-height: 1.3;
    margin: 0 0 10px;
    text-transform: uppercase;
}

.st-showcase h1 {
    color: #ffffff !important;
    font-family: Montserrat, sans-serif;
    font-size: 38px;
    font-weight: 800;
    line-height: 1.12;
    margin: 0 0 14px;
}

.st-showcase-copy > p:not(.st-showcase-kicker) {
    color: rgba(255, 255, 255, 0.78);
    font-size: 16px;
    line-height: 1.7;
    margin: 0;
}

.st-showcase-metrics {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 22px;
}

.st-showcase-metric {
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.07);
    border-radius: 8px;
    min-width: 138px;
    padding: 12px 14px;
}

.st-showcase-metric strong {
    color: #ffffff;
    display: block;
    font-family: Montserrat, sans-serif;
    font-size: 24px;
    line-height: 1;
}

.st-showcase-metric span {
    color: rgba(255, 255, 255, 0.72);
    display: block;
    font-family: Montserrat, sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1px;
    margin-top: 7px;
    text-transform: uppercase;
}

.st-showcase-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.st-showcase-card {
    background: rgba(255, 255, 255, 0.075);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    color: #ffffff !important;
    display: block;
    min-height: 168px;
    overflow: hidden;
    padding: 20px;
    position: relative;
    text-decoration: none;
    transition: background 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
}

.st-showcase-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(180deg, var(--st-accent), var(--st-cyan));
}

.st-showcase-card:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(114, 229, 241, 0.42);
    transform: translateY(-4px);
}

.st-showcase-card span,
.st-showcase-card strong,
.st-showcase-card em {
    display: block;
    font-style: normal;
}

.st-showcase-card span {
    color: #72e5f1;
    font-family: Montserrat, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.3px;
    margin-bottom: 20px;
    text-transform: uppercase;
}

.st-showcase-card strong {
    color: #ffffff;
    font-family: Montserrat, sans-serif;
    font-size: 19px;
    line-height: 1.25;
    margin-bottom: 9px;
}

.st-showcase-card em {
    color: rgba(255, 255, 255, 0.72);
    font-size: 13px;
    line-height: 1.55;
}

.lpt-card,
.sph-hero,
#featured-boxes .featured-box img,
.blog .post-image-col .site-images,
.archive .post-image-col .site-images,
.st-mv-post-thumb {
    transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}

.lpt-card:hover,
.sph-hero:hover,
.blog .content-column article:hover .site-images,
.archive .content-column article:hover .site-images {
    transform: translateY(-3px);
    box-shadow: 0 18px 42px rgba(17, 24, 39, 0.16);
}

#featured-boxes .featured-box:hover img,
.st-mv-post-item:hover .st-mv-post-thumb {
    transform: translateY(-3px) scale(1.015);
    box-shadow: 0 14px 30px rgba(17, 24, 39, 0.14);
}

.trending-ticker-label {
    animation: st-alert-pulse 2.8s ease-in-out infinite;
}

@keyframes st-alert-pulse {
    0%, 100% {
        box-shadow: inset 0 0 0 rgba(255, 255, 255, 0), 0 0 0 rgba(232, 64, 12, 0);
    }
    50% {
        box-shadow: inset 0 0 18px rgba(255, 255, 255, 0.16), 0 0 18px rgba(232, 64, 12, 0.14);
    }
}

body.st-motion-ready .st-motion-item {
    opacity: 0;
    transform: translateY(24px);
    visibility: hidden;
    will-change: opacity, transform;
}

body.st-motion-ready .st-motion-item.is-visible {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
    transition: opacity 0.7s ease, transform 0.7s ease;
}

body.st-reduce-motion .st-motion-item {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    visibility: visible !important;
}

/* Ensure the IOC Toolkit article body remains visible even if motion observers do not fire. */
body.single-post.postid-2606 .post-page-content.st-motion-item {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
}

body.single-post.postid-2606 .ioc-workflow-diagram,
body.single-post.postid-2606 .ioc-workflow-diagram * {
    text-align: left !important;
}

body.dark-mode::before {
    opacity: 0.32;
}

body.dark-mode .st-showcase {
    background:
        linear-gradient(135deg, rgba(8, 12, 20, 0.98), rgba(17, 24, 39, 0.96)),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.07) 0 1px, transparent 1px 80px);
}

body.dark-mode .st-showcase-card,
body.dark-mode .st-showcase-metric {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.14);
}

@media (max-width: 900px) {
    .st-showcase-inner {
        grid-template-columns: 1fr;
    }

    .st-showcase-copy {
        max-width: 720px;
    }
}

@media (max-width: 640px) {
    .st-showcase-inner {
        padding: 28px 20px 34px;
    }

    .st-showcase h1 {
        font-size: 28px;
        line-height: 1.18;
    }

    .st-showcase-grid {
        grid-template-columns: 1fr;
    }

    .st-showcase-card {
        min-height: auto;
    }

    #main-menu > li > a::after {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .trending-ticker-label,
    .trending-ticker-track {
        animation: none !important;
    }

    .lpt-card,
    .sph-hero,
    #featured-boxes .featured-box img,
    .blog .post-image-col .site-images,
    .archive .post-image-col .site-images,
    .st-mv-post-thumb,
    .st-showcase-card {
        transition: none !important;
        transform: none !important;
    }
}

/* ShadowTelemetry design-fix 2026-07-02
 * Keep the homepage blog-first: remove the previous topic-card showcase from the
 * template and tighten the space between the latest-post carousel and articles.
 */
.blog .main-content {
    padding-top: 28px;
}

.blog .st_parent-latest {
    margin-bottom: 22px;
}

.blog .st_parent-latest-articles {
    margin-top: 28px;
}

@media screen and (max-width: 768px) {
    .blog .main-content {
        padding-top: 22px;
    }

    .blog .st_parent-latest {
        margin-bottom: 18px;
    }

    .blog .st_parent-latest-articles {
        margin-top: 22px;
    }
}

/* Ensure homepage article cards are visible even if the optional motion script fails
 * to reveal off-screen elements during full-page/mobile rendering.
 */
.blog .content-column > li,
.blog .content-column article {
    visibility: visible !important;
    opacity: 1 !important;
}


/* ShadowTelemetry approved redesign implementation 2026-07-07
 * Header option B, simplified nav, light Threat Intel Wire sidebar,
 * and latest post heading polish.
 */
:root {
    --st-ink: #111827;
    --st-muted: #667085;
    --st-panel: #ffffff;
    --st-panel-soft: #f8fafc;
    --st-line: #e5eaf0;
    --st-line-strong: #d5dde7;
    --st-accent: #e8400c;
    --st-cyan: #0ea5b7;
    --st-dark: #08111f;
}

.entry-header.st-brand-banner {
    height: 178px;
    min-height: 178px;
    border-bottom: none;
    background:
        linear-gradient(90deg, rgba(5, 10, 20, .74), rgba(5, 10, 20, .12) 42%, rgba(5, 10, 20, .64)),
        linear-gradient(135deg, #08111f, #142238);
    background-position: center;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

.entry-header.st-brand-banner::after {
    content: '';
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--st-accent), var(--st-cyan), #18a058);
}

.st-brand-banner-tools {
    position: absolute;
    top: 18px;
    right: 24px;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 10px;
}

.st-brand-status {
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(114, 229, 241, .28);
    border-radius: 999px;
    background: rgba(8, 17, 31, .68);
    color: #dffcff;
    font: 700 12px/1 Montserrat, sans-serif;
    letter-spacing: .08em;
    padding: 9px 12px;
    text-transform: uppercase;
    backdrop-filter: blur(10px);
}

.st-theme-toggle,
#wp-theme-toggle.st-theme-toggle {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border: 1px solid rgba(255, 255, 255, .24) !important;
    border-radius: 50%;
    background: rgba(8, 17, 31, .58) !important;
    color: #ffffff !important;
    cursor: pointer;
    font-size: 17px !important;
    line-height: 1;
    transition: transform .25s ease, background .25s ease;
    backdrop-filter: blur(10px);
}

#main-navigation {
    background: rgba(255,255,255,.96);
    border-bottom: 1px solid var(--st-line);
}

#main-navigation > div {
    display: flex;
    align-items: center;
    gap: 18px;
    min-height: 56px;
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 26px;
    position: relative;
}

.st-nav-brand {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 10px;
    color: var(--st-ink) !important;
    font: 800 15px/1 Montserrat, sans-serif;
    letter-spacing: -.01em;
    text-decoration: none !important;
}

.st-nav-brand-mark {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--st-accent), var(--st-cyan));
    box-shadow: 0 10px 22px rgba(14, 165, 183, .22);
}

#main-navigation .site-menu-wrapper {
    flex: 1 1 auto;
    margin: 0;
    text-align: center;
}

#site-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 4px;
}

#site-menu > li > a {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .065em;
    padding-top: 18px;
    padding-bottom: 17px;
}

.main-navigation-search {
    position: static !important;
    flex: 0 0 auto;
}

.blog .st_parent-latest-articles {
    margin-top: 28px;
    margin-bottom: 24px;
    font-size: 18px;
}

.st-designed-sidebar {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.st-designed-sidebar .st_parent-widget,
.st-sidebar-card {
    border: 1px solid var(--st-line);
    border-radius: 16px;
    background: rgba(255,255,255,.92);
    padding: 18px;
    box-shadow: 0 12px 34px rgba(17, 24, 39, .06);
}

.st-designed-sidebar .widget-title {
    margin-bottom: 14px;
}

.st-intel-wire {
    color: var(--st-ink);
}

.st-intel-wire-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.st-intel-wire-head .widget-title {
    margin-bottom: 0;
}

.st-intel-wire-head p,
.st-subscribe-card p {
    color: var(--st-muted);
    font-size: 13px;
    line-height: 1.45;
    margin: 8px 0 0;
}

.st-live-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid rgba(24,160,88,.32);
    border-radius: 999px;
    background: rgba(24,160,88,.12);
    color: #15803d;
    flex: 0 0 auto;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .08em;
    padding: 5px 8px;
    text-transform: uppercase;
}

.st-live-badge::before {
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 0 4px rgba(34,197,94,.16);
}

.st-intel-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    margin: 14px 0;
}

.st-intel-tabs button {
    border: 1px solid var(--st-line-strong);
    border-radius: 999px;
    background: var(--st-panel-soft);
    color: #526070 !important;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .05em;
    padding: 6px 4px;
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
}

.st-intel-tabs button.is-active {
    border-color: rgba(232,64,12,.32);
    background: #fff7f4;
    color: var(--st-accent) !important;
}

.st-intel-item[hidden] {
    display: none !important;
}

.st-intel-empty {
    border: 1px dashed var(--st-line-strong);
    border-radius: 12px;
    background: var(--st-panel-soft);
    color: var(--st-muted);
    font-size: 12px;
    line-height: 1.4;
    margin: 0;
    padding: 12px;
}

.st-intel-list {
    display: grid;
    gap: 10px;
}

.st-intel-item {
    display: block;
    border: 1px solid var(--st-line);
    border-radius: 14px;
    background: var(--st-panel-soft);
    padding: 12px;
    text-decoration: none !important;
    transition: background .2s ease, border-color .2s ease, transform .2s ease;
}

.st-intel-item:hover {
    border-color: rgba(14,165,183,.28);
    background: #ffffff;
    transform: translateY(-2px);
}

.st-intel-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}

.st-sev {
    border-radius: 999px;
    font-size: 10px;
    font-weight: 950;
    letter-spacing: .08em;
    padding: 4px 7px;
    text-transform: uppercase;
}

.st-sev-high { background: #fff1ed; border: 1px solid rgba(232,64,12,.30); color: #bf3410; }
.st-sev-med { background: #fffbeb; border: 1px solid rgba(245,158,11,.32); color: #a16207; }
.st-sev-info { background: #ecfeff; border: 1px solid rgba(14,165,183,.30); color: #08798a; }

.st-intel-time {
    color: var(--st-muted);
    font-size: 11px;
    font-weight: 750;
    white-space: nowrap;
}

.st-intel-item strong {
    display: block;
    color: var(--st-ink);
    font-size: 13px;
    line-height: 1.28;
    margin-bottom: 6px;
}

.st-intel-item small {
    color: var(--st-muted);
    display: block;
    font-size: 11px;
    line-height: 1.35;
}

.st-intel-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-top: 1px solid var(--st-line);
    margin-top: 13px;
    padding-top: 12px;
}

.st-intel-footer a {
    color: var(--st-accent) !important;
    font-size: 12px;
    font-weight: 850;
}

.st-intel-footer span {
    color: var(--st-muted);
    font-size: 11px;
}

.st-subscribe-form {
    display: grid;
    gap: 10px;
    margin-top: 12px;
}

.st-subscribe-form input {
    width: 100%;
    border: 1px solid var(--st-line-strong);
    border-radius: 12px;
    background: #ffffff;
    color: var(--st-ink);
    font: inherit;
    font-size: 13px;
    padding: 11px 12px;
}

.st-subscribe-form input:focus {
    border-color: var(--st-cyan);
    box-shadow: 0 0 0 4px rgba(14,165,183,.10);
    outline: none;
}

.st-subscribe-actions {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
}

.st-subscribe-actions button,
.st-rss-chip {
    border-radius: 12px;
    font: inherit;
    font-size: 12px;
    font-weight: 900;
    padding: 10px 12px;
    text-align: center;
}

.st-subscribe-actions button {
    border: 0;
    background: linear-gradient(90deg, var(--st-accent), #ff6a33);
    color: #ffffff;
    cursor: pointer;
}

.st-rss-chip {
    border: 1px solid var(--st-line-strong);
    background: #fff7f4;
    color: var(--st-accent) !important;
}

body.dark-mode #main-navigation,
body.dark-mode .st-designed-sidebar .st_parent-widget,
body.dark-mode .st-sidebar-card,
body.dark-mode .st-intel-wire,
body.dark-mode .st-intel-item,
body.dark-mode .st-subscribe-form input {
    background-color: #1e1e1e !important;
    border-color: #333333 !important;
    color: #e0e0e0 !important;
}

body.dark-mode .st-nav-brand,
body.dark-mode .st-intel-item strong {
    color: #ffffff !important;
}

body.dark-mode .st-intel-wire-head p,
body.dark-mode .st-subscribe-card p,
body.dark-mode .st-intel-item small,
body.dark-mode .st-intel-time,
body.dark-mode .st-intel-footer span {
    color: #aeb7c2 !important;
}

body.dark-mode .st-intel-tabs button {
    background: #242424;
    border-color: #383838;
    color: #d6d6d6 !important;
}

body.dark-mode .st-intel-tabs button.is-active {
    background: #2b1f1b;
    border-color: rgba(255, 106, 51, .45);
    color: #ff9b70 !important;
}

body.dark-mode .st-intel-empty {
    background: #242424;
    border-color: #383838;
    color: #aeb7c2;
}

@media screen and (max-width: 900px) {
    #main-navigation > div {
        padding-right: 20px;
        padding-left: 20px;
    }

    .st-nav-brand span:last-child {
        display: none;
    }
}

@media screen and (max-width: 640px) {
    .entry-header.st-brand-banner {
        height: 132px;
        min-height: 132px;
    }

    .st-brand-status {
        display: none;
    }

    .st-designed-sidebar .st_parent-widget,
    .st-sidebar-card {
        padding: 16px;
    }
}

/* Main menu dropdown fixes: visible menu uses #site-menu (not #top-menu). */
#site-menu > li.menu-item-has-children > a::after {
    content: none !important;
    display: none !important;
}

body.dark-mode #site-menu .sub-menu {
    background-color: #1e1e1e !important;
    border-color: #333333 !important;
}

body.dark-mode #site-menu .sub-menu > li > a {
    background-color: #1e1e1e !important;
    color: #ffffff !important;
    border-bottom-color: #333333 !important;
}

body.dark-mode #site-menu .sub-menu > li > a:hover,
body.dark-mode #site-menu .sub-menu > li > a:focus {
    background-color: #242424 !important;
    color: #ff9b70 !important;
}


/* ShadowTelemetry threat-intel-feed compact layout only
 * Scope: category archive pages for threat-intel-feed and article cards whose
 * post_class includes category-threat-intel-feed. This intentionally avoids the
 * homepage carousel, manually authored articles, and other categories.
 */
body.category-threat-intel-feed .content-column li,
.content-column article.category-threat-intel-feed {
    margin-bottom: 16px !important;
    padding-bottom: 16px !important;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08) !important;
}

body.category-threat-intel-feed .content-column article,
.content-column article.category-threat-intel-feed {
    display: block !important;
    background: #ffffff !important;
    border: 1px solid rgba(15, 23, 42, 0.08) !important;
    border-left: 4px solid #e8400c !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.05) !important;
    padding: 16px 18px !important;
}

body.category-threat-intel-feed .post-image-col,
.content-column article.category-threat-intel-feed .post-image-col {
    display: none !important;
}

body.category-threat-intel-feed .post-content-col,
.content-column article.category-threat-intel-feed .post-content-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    padding: 0 !important;
    width: 100% !important;
}

body.category-threat-intel-feed .post-title,
.content-column article.category-threat-intel-feed .post-title {
    font-size: 20px !important;
    line-height: 1.25 !important;
    margin: 0 !important;
}

body.category-threat-intel-feed .post-page-content,
.content-column article.category-threat-intel-feed .post-page-content,
body.category-threat-intel-feed .post-page-content p,
.content-column article.category-threat-intel-feed .post-page-content p {
    font-size: 14px !important;
    line-height: 1.55 !important;
}

body.category-threat-intel-feed .bl-read-more,
.content-column article.category-threat-intel-feed .bl-read-more {
    margin-top: 6px !important;
}

body.dark-mode.category-threat-intel-feed .content-column article,
body.dark-mode .content-column article.category-threat-intel-feed {
    background: #111827 !important;
    border-color: rgba(255, 255, 255, 0.10) !important;
    border-left-color: #ff6a3d !important;
    box-shadow: none !important;
}

@media (max-width: 768px) {
    body.category-threat-intel-feed .content-column article,
    .content-column article.category-threat-intel-feed {
        padding: 14px 16px !important;
    }

    body.category-threat-intel-feed .post-title,
    .content-column article.category-threat-intel-feed .post-title {
        font-size: 18px !important;
    }
}

@media (max-width: 480px) {
    body.category-threat-intel-feed .content-column li,
    .content-column article.category-threat-intel-feed {
        margin-bottom: 12px !important;
        padding-bottom: 12px !important;
    }

    body.category-threat-intel-feed .content-column article,
    .content-column article.category-threat-intel-feed {
        padding: 12px 14px !important;
    }

    body.category-threat-intel-feed .post-title,
    .content-column article.category-threat-intel-feed .post-title {
        font-size: 16px !important;
    }
}

/* Dark-mode contrast for the automated Threat Intel Feed only.
 * The general dark-mode rule gives .post-page-content a separate near-black
 * background; on blue feed cards that creates a low-contrast text well.
 * color-scheme prevents mobile Chromium's automatic darkening from inverting
 * the intentionally light text back into low-contrast charcoal.
 */
body.dark-mode.category-threat-intel-feed {
    color-scheme: dark;
}

body.dark-mode.category-threat-intel-feed .content-column article .post-page-content,
body.dark-mode .content-column article.category-threat-intel-feed .post-page-content {
    background: transparent !important;
    color: #d6e1ee !important;
}

body.dark-mode.category-threat-intel-feed .content-column article .post-page-content *,
body.dark-mode .content-column article.category-threat-intel-feed .post-page-content * {
    color: inherit !important;
}

body.dark-mode.category-threat-intel-feed .content-column article .bl-meta,
body.dark-mode.category-threat-intel-feed .content-column article .bl-meta a,
body.dark-mode .content-column article.category-threat-intel-feed .bl-meta,
body.dark-mode .content-column article.category-threat-intel-feed .bl-meta a {
    color: #b8c5d3 !important;
}

body.dark-mode.category-threat-intel-feed .content-column article .bl-category-badge a,
body.dark-mode .content-column article.category-threat-intel-feed .bl-category-badge a {
    color: #c9d7e5 !important;
}

body.dark-mode.category-threat-intel-feed .content-column article .bl-read-more a,
body.dark-mode .content-column article.category-threat-intel-feed .bl-read-more a {
    color: #ffd0c1 !important;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* The intelligence wire stacks below the feed on mobile. Preserve readable
 * secondary text without affecting the sidebar elsewhere on the site. */
body.dark-mode.category-threat-intel-feed .st-intel-item,
body.dark-mode.category-threat-intel-feed .st-intel-wire,
body.dark-mode .category-threat-intel-feed ~ .sidebar-right .st-intel-item,
body.dark-mode .category-threat-intel-feed ~ .sidebar-right .st-intel-wire {
    background-color: #162235 !important;
    border-color: #31445a !important;
}

body.dark-mode.category-threat-intel-feed .st-intel-item small,
body.dark-mode .category-threat-intel-feed ~ .sidebar-right .st-intel-item small {
    color: #c1cfdd !important;
    font-size: 12px;
    line-height: 1.45;
}

body.dark-mode.category-threat-intel-feed .st-intel-time,
body.dark-mode .category-threat-intel-feed ~ .sidebar-right .st-intel-time {
    color: #b8c5d3 !important;
}

/*--------------------------------------------------------------
Professional Work Profile — About Me Portfolio (page ID 30)
--------------------------------------------------------------*/
body.page-id-30 .main-content {
    max-width: 1320px !important;
    padding-top: 42px;
    padding-bottom: 64px;
}

body.page-id-30 article.st-work-profile {
    background: transparent !important;
    color: #172033;
}

.st-work-profile {
    --profile-ink: #172033;
    --profile-muted: #5d6878;
    --profile-panel: #ffffff;
    --profile-soft: #f4f7fa;
    --profile-line: #dce3eb;
    --profile-accent: #e8400c;
    --profile-accent-soft: #fff0ea;
    --profile-cyan: #0b8294;
}

.st-work-profile-hero {
    overflow: hidden;
    position: relative;
    margin-bottom: 32px;
    padding: clamp(28px, 5vw, 60px);
    border: 1px solid var(--profile-line);
    border-radius: 22px;
    background:
        linear-gradient(135deg, rgba(232, 64, 12, .08), transparent 42%),
        linear-gradient(315deg, rgba(11, 130, 148, .08), transparent 38%),
        var(--profile-panel);
    box-shadow: 0 18px 50px rgba(23, 32, 51, .08);
}

.st-work-profile-hero::after {
    content: '';
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: linear-gradient(90deg, var(--profile-accent), var(--profile-cyan));
}

.st-work-profile-kicker,
.st-work-profile-brief-label,
.st-work-profile-rail-label {
    margin: 0 0 12px !important;
    color: var(--profile-accent) !important;
    font-family: Montserrat, sans-serif;
    font-size: 11px !important;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.st-work-profile-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(260px, .65fr);
    gap: clamp(28px, 5vw, 64px);
    align-items: end;
}

.st-work-profile-intro h1 {
    max-width: 800px;
    margin: 0 0 10px;
    color: var(--profile-ink) !important;
    font-size: clamp(38px, 6vw, 72px);
    line-height: 1.02;
    letter-spacing: -.035em;
}

.st-work-profile-role {
    margin: 0 0 18px !important;
    color: var(--profile-cyan) !important;
    font-family: Montserrat, sans-serif;
    font-size: clamp(16px, 2.2vw, 22px) !important;
    font-weight: 700;
    line-height: 1.4;
}

.st-work-profile-summary {
    max-width: 760px;
    margin: 0 !important;
    color: var(--profile-muted) !important;
    font-size: 17px !important;
    line-height: 1.75;
}

.st-work-profile-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 20px;
    margin-top: 26px;
}

.st-work-profile-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 18px;
    border-radius: 999px;
    background: var(--profile-accent);
    color: #ffffff !important;
    font-family: Montserrat, sans-serif;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none !important;
}

.st-work-profile-primary:hover,
.st-work-profile-primary:focus {
    background: #ba3109;
    color: #ffffff !important;
}

.st-work-profile-location {
    color: var(--profile-muted);
    font-size: 14px;
    font-weight: 650;
}

.st-work-profile-brief {
    padding: 24px;
    border: 1px solid var(--profile-line);
    border-radius: 16px;
    background: rgba(255, 255, 255, .74);
}

.st-work-profile-brief ul {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.st-work-profile-brief li {
    position: relative;
    margin: 0;
    padding-left: 18px;
    color: var(--profile-ink);
    font-size: 14px;
    line-height: 1.55;
}

.st-work-profile-brief li::before {
    content: '';
    position: absolute;
    top: .62em;
    left: 0;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--profile-cyan);
}

.st-work-profile-layout {
    display: grid;
    grid-template-columns: 270px minmax(0, 1fr);
    gap: 34px;
    align-items: start;
}

.st-work-profile-rail {
    display: grid;
    gap: 14px;
    position: sticky;
    top: 28px;
}

.st-work-profile-rail section {
    padding: 20px;
    border: 1px solid var(--profile-line);
    border-radius: 14px;
    background: var(--profile-panel);
}

.st-work-profile-rail section p:last-child {
    margin: 0 !important;
    color: var(--profile-muted) !important;
    font-size: 13px !important;
    line-height: 1.65;
}

.st-work-profile-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.st-work-profile-tags span {
    padding: 6px 9px;
    border: 1px solid #b9dce1;
    border-radius: 999px;
    background: #ecf8fa;
    color: #075f6c;
    font-family: Montserrat, sans-serif;
    font-size: 10px;
    font-weight: 800;
}

.st-work-profile-body {
    min-width: 0;
    text-align: left;
}

.st-work-profile-body .resume-portfolio > div:first-child,
.st-work-profile-body .resume-portfolio > hr:first-of-type {
    display: none !important;
}

.st-work-profile-body .resume-portfolio > h2,
.st-work-profile-body .resume-portfolio > div[style*="display: flex"] h2 {
    margin: 2px 0 20px;
    color: var(--profile-ink) !important;
    font-size: clamp(27px, 3vw, 38px);
    line-height: 1.2;
}

.st-work-profile-body .resume-portfolio > hr {
    margin: 38px 0 !important;
    border: 0;
    border-top: 1px solid var(--profile-line);
}

.st-work-profile-body .resume-portfolio div[style*="background: #f9f9f9"] {
    position: relative;
    margin-bottom: 18px !important;
    padding: clamp(22px, 3.5vw, 34px) !important;
    border: 1px solid var(--profile-line) !important;
    border-left: 4px solid var(--profile-accent) !important;
    border-radius: 15px !important;
    background: var(--profile-panel) !important;
    box-shadow: 0 12px 30px rgba(23, 32, 51, .06);
}

.st-work-profile-body .resume-portfolio > div[style*="background: #f9f9f9"]::before {
    content: '';
    position: absolute;
    top: 30px;
    left: -8px;
    width: 12px;
    height: 12px;
    border: 2px solid var(--profile-panel);
    border-radius: 50%;
    background: var(--profile-accent);
}

.st-work-profile-body .resume-portfolio h3 {
    margin: 0 0 7px !important;
    color: var(--profile-ink) !important;
    font-size: clamp(20px, 2.4vw, 27px);
    line-height: 1.3;
}

.st-work-profile-body .resume-portfolio h4 {
    margin: 0 0 8px !important;
    color: var(--profile-cyan) !important;
    font-family: Montserrat, sans-serif;
    font-size: 15px;
    font-weight: 750;
    line-height: 1.45;
}

.st-work-profile-body .resume-portfolio p,
.st-work-profile-body .resume-portfolio li {
    color: #4c5869 !important;
    font-size: 15px !important;
    line-height: 1.72;
}

.st-work-profile-body .resume-portfolio p[style*="color: #777"] {
    color: #667386 !important;
}

.st-work-profile-body .resume-portfolio p em {
    color: #667386;
    font-weight: 650;
}

.st-work-profile-body .resume-portfolio ul {
    margin: 18px 0;
    padding-left: 22px;
}

.st-work-profile-body .resume-portfolio li {
    margin-bottom: 8px;
    padding-left: 4px;
}

.st-work-profile-body .resume-portfolio li::marker {
    color: var(--profile-accent);
}

.st-work-profile-body .resume-portfolio strong {
    color: #263247;
    font-weight: 800;
}

.st-work-profile-body .resume-portfolio > div[style*="display: flex"] {
    gap: 20px !important;
}

body.dark-mode.page-id-30 {
    color-scheme: dark;
}

body.dark-mode.page-id-30 article.st-work-profile {
    --profile-ink: #f5f8fc;
    --profile-muted: #bdc9d7;
    --profile-panel: #111b2a;
    --profile-soft: #162235;
    --profile-line: #304159;
    --profile-accent: #ff7a4d;
    --profile-accent-soft: #34231f;
    --profile-cyan: #75d4df;
    background: transparent !important;
    color: var(--profile-ink) !important;
}

body.dark-mode.page-id-30 .st-work-profile-hero {
    background:
        linear-gradient(135deg, rgba(255, 122, 77, .11), transparent 42%),
        linear-gradient(315deg, rgba(117, 212, 223, .09), transparent 38%),
        #101a29;
    box-shadow: none;
}

body.dark-mode.page-id-30 .st-work-profile-brief {
    background: rgba(17, 27, 42, .82);
}

body.dark-mode.page-id-30 .st-work-profile-brief li,
body.dark-mode.page-id-30 .st-work-profile-body .resume-portfolio h3,
body.dark-mode.page-id-30 .st-work-profile-body .resume-portfolio strong {
    color: #eef4fb !important;
}

body.dark-mode.page-id-30 .st-work-profile-body .resume-portfolio div[style*="background: #f9f9f9"] {
    background: #162235 !important;
    border-color: #304159 !important;
    border-left-color: #ff7a4d !important;
    box-shadow: none;
}

body.dark-mode.page-id-30 .st-work-profile-body .resume-portfolio > div[style*="background: #f9f9f9"]::before {
    border-color: #162235;
}

body.dark-mode.page-id-30 .st-work-profile-body .resume-portfolio p,
body.dark-mode.page-id-30 .st-work-profile-body .resume-portfolio li,
body.dark-mode.page-id-30 .st-work-profile-body .resume-portfolio p[style*="color"] {
    color: #c8d4e2 !important;
}

body.dark-mode.page-id-30 .st-work-profile-body .resume-portfolio p em {
    color: #b9c6d5 !important;
}

body.dark-mode.page-id-30 .st-work-profile-tags span {
    border-color: #315d67;
    background: #142d34;
    color: #a9edf4;
}

@media (max-width: 960px) {
    .st-work-profile-hero-grid,
    .st-work-profile-layout {
        grid-template-columns: 1fr;
    }

    .st-work-profile-rail {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        position: static;
    }
}

@media (max-width: 680px) {
    body.page-id-30 .main-content {
        padding: 22px 14px 44px !important;
    }

    .st-work-profile-hero {
        margin-bottom: 20px;
        padding: 26px 20px;
        border-radius: 16px;
    }

    .st-work-profile-hero-grid {
        gap: 24px;
    }

    .st-work-profile-intro h1 {
        font-size: 40px;
    }

    .st-work-profile-summary {
        font-size: 15px !important;
    }

    .st-work-profile-rail {
        grid-template-columns: 1fr;
    }

    .st-work-profile-body .resume-portfolio > div[style*="display: flex"] {
        display: grid !important;
        grid-template-columns: 1fr;
    }

    .st-work-profile-body .resume-portfolio [style*="min-width: 300px"] {
        min-width: 0 !important;
        width: 100% !important;
    }

    .st-work-profile-body .resume-portfolio div[style*="background: #f9f9f9"] {
        padding: 20px 18px !important;
    }

    .st-work-profile-body .resume-portfolio p,
    .st-work-profile-body .resume-portfolio li {
        font-size: 14px !important;
        line-height: 1.65;
    }
}