/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jun 02 2026 | 16:48:17 */
/* ============================================================
   TRUCREATIVES — BLOG PAGE RESTYLE  Blog-Light
   Light cards, dark text, dark page background
   ============================================================ */

/* ----------------------------------------------------------
   1. PAGE CANVAS — dark background
   ---------------------------------------------------------- */

.elementor-8470 {
  background-color: #0d0f1a !important;
  font-family: "Inter", ui-sans-serif, system-ui, sans-serif;
}

.elementor-8470 .elementor-element-1cad690,
.elementor-8470 .elementor-element-b865288,
.elementor-8470 .elementor-element-a91ab39,
.elementor-8470 .elementor-element-7960f97,
.elementor-8470 .elementor-element-356489df,
.elementor-8470 .elementor-element-f4f0bdb,
.elementor-8470 .elementor-element-6c3508c {
  background-color: #0d0f1a !important;
  background-image: none !important;
}

.elementor-8470 .elementor-column,
.elementor-8470 .elementor-widget-wrap,
.elementor-8470 .elementor-widget-container,
.elementor-8470 .uc_overlay_image_carousel,
.elementor-8470 .uc-items-wrapper,
.elementor-8470 .owl-stage-outer,
.elementor-8470 .owl-stage,
.elementor-8470 .tf-tabcontent,
.elementor-8470 .tf-tabcontent-inner,
.elementor-8470 .tf-tabs {
  background: transparent !important;
}

/* ----------------------------------------------------------
   2. HERO BANNER
   ---------------------------------------------------------- */

.elementor-8470 .elementor-element-fd10188 {
  min-height: 420px !important;
}

.elementor-8470 .elementor-element-fd10188 .elementor-background-overlay {
  background: linear-gradient(
    160deg,
    rgba(13,15,26,0.35) 0%,
    rgba(13,15,26,0.82) 55%,
    rgba(13,15,26,1) 100%
  ) !important;
  opacity: 1 !important;
}

.elementor-8470 .elementor-element-fd10188 .elementor-heading-title {
  font-family: "Satoshi", "Inter", ui-sans-serif, system-ui, sans-serif !important;
  font-size: clamp(1.5rem, 3.2vw, 2.2rem) !important;
  font-weight: 700 !important;
  line-height: 1.18 !important;
  color: #f5f6fa !important;
}

.elementor-8470 .elementor-element-fd10188 .elementor-heading-title a {
  color: inherit !important;
  text-decoration: none !important;
}

.elementor-8470 .elementor-element-2ad2353 .elementor-button {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 2.75rem !important;
  padding: 0.6rem 1.5rem !important;
  border-radius: 62.5rem !important;
  font-size: 0.875rem !important;
  font-weight: 700 !important;
  color: #f5f6fa !important;
  background: transparent !important;
  border: 1.5px solid rgba(255,255,255,0.28) !important;
  text-decoration: none !important;
  transition: border-color 0.2s, background 0.2s !important;
}

.elementor-8470 .elementor-element-2ad2353 .elementor-button:hover {
  border-color: #6c8eff !important;
  background: rgba(108,142,255,0.12) !important;
}

/* ----------------------------------------------------------
   3. SECTION HEADINGS
   ---------------------------------------------------------- */

.elementor-8470 .elementor-element-b865288,
.elementor-8470 .elementor-element-7960f97 {
  padding-top: 3.5rem !important;
  padding-bottom: 0.5rem !important;
}

.elementor-8470 .elementor-element-b865288 .elementor-heading-title,
.elementor-8470 .elementor-element-7960f97 .elementor-heading-title {
  font-family: "Satoshi", "Inter", ui-sans-serif, system-ui, sans-serif !important;
  font-size: clamp(1.75rem, 3.5vw, 2.25rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  text-align: center !important;
  background: linear-gradient(90deg, #6c8eff, #7dd3fc) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

.elementor-8470 .elementor-element-b865288 .elementor-heading-title a,
.elementor-8470 .elementor-element-7960f97 .elementor-heading-title a {
  background: inherit !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  text-decoration: none !important;
}

/* ----------------------------------------------------------
   4. CAROUSEL SECTION PADDING
   ---------------------------------------------------------- */

.elementor-8470 .elementor-element-a91ab39,
.elementor-8470 .elementor-element-f4f0bdb {
  padding: 1.5rem 0 2.5rem !important;
}

.elementor-8470 .elementor-element-356489df,
.elementor-8470 .elementor-element-6c3508c {
  padding: 1.5rem 0 3rem !important;
}

/* ----------------------------------------------------------
   5. CARDS — light bg, dark readable text
   ---------------------------------------------------------- */

.elementor-8470 .uc_image_carousel_container_holder {
  border-radius: 0.875rem !important;
  overflow: hidden !important;
  transition: transform 0.22s ease, box-shadow 0.22s ease !important;
}

.elementor-8470 .uc_image_carousel_container_holder:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.18) !important;
}

.elementor-8470 .uc_image_carousel_placeholder img {
  width: 100% !important;
  display: block !important;
  transition: transform 0.38s ease !important;
}

.elementor-8470 .uc_image_carousel_container_holder:hover .uc_image_carousel_placeholder img {
  transform: scale(1.04) !important;
}

/* ----------------------------------------------------------
   6. CARD TEXT — big, dark, readable on light bg
   ---------------------------------------------------------- */

.elementor-8470 .uc_post_title,
.elementor-8470 .uc_image_carousel_content .uc_post_title,
.elementor-8470 .uc_image_carousel_content_holder .uc_post_title {
  font-family: "Satoshi", "Inter", ui-sans-serif, system-ui, sans-serif !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  color: #0d0f1a !important;
  margin: 0 0 0.6rem !important;
}

.elementor-8470 .uc_image_carousel_content a,
.elementor-8470 .uc_image_carousel_content_holder a {
  text-decoration: none !important;
  color: inherit !important;
}

.elementor-8470 .uc_image_carousel_content a:hover .uc_post_title {
  color: #6c8eff !important;
}

/* Meta row */
.elementor-8470 .ue-meta-data {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.6rem !important;
  margin-top: 0.4rem !important;
}

.elementor-8470 .ue-grid-item-meta-data,
.elementor-8470 .uc_image_carousel_content .ue-grid-item-meta-data {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.3rem !important;
  font-size: 0.82rem !important;
  font-weight: 500 !important;
  color: #555972 !important;
  font-family: "Inter", ui-sans-serif, system-ui, sans-serif !important;
}

.elementor-8470 .ue-grid-item-meta-data a {
  color: #555972 !important;
  text-decoration: none !important;
  font-size: 0.82rem !important;
}

.elementor-8470 .ue-grid-item-meta-data a:hover {
  color: #6c8eff !important;
}

.elementor-8470 .ue-grid-item-meta-data-icon i {
  color: #6c8eff !important;
  font-size: 0.7rem !important;
}

/* ----------------------------------------------------------
   7. OWL ARROWS
   ---------------------------------------------------------- */

.elementor-8470 .owl-nav .owl-prev,
.elementor-8470 .owl-nav .owl-next {
  width: 2.2rem !important;
  height: 2.2rem !important;
  border-radius: 50% !important;
  background: #1e2338 !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  color: #f5f6fa !important;
  transition: background 0.2s !important;
}

.elementor-8470 .owl-nav .owl-prev:hover,
.elementor-8470 .owl-nav .owl-next:hover {
  background: #6c8eff !important;
  border-color: transparent !important;
}

/* ----------------------------------------------------------
   8. VIEW ALL BUTTONS
   ---------------------------------------------------------- */

.elementor-8470 .elementor-element-d0fb39a .elementor-button,
.elementor-8470 .elementor-element-31b14add .elementor-button,
.elementor-8470 .elementor-element-42ec8b26 .elementor-button,
.elementor-8470 .elementor-element-aaa5490 .elementor-button,
.elementor-8470 .elementor-element-df5699f .elementor-button,
.elementor-8470 .elementor-element-f03ddf9 .elementor-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 2.9rem !important;
  padding: 0.7rem 1.9rem !important;
  border-radius: 62.5rem !important;
  font-family: "Inter", ui-sans-serif, system-ui, sans-serif !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  background: transparent !important;
  color: #f5f6fa !important;
  border: 1.5px solid rgba(108,142,255,0.45) !important;
  text-decoration: none !important;
  transition: background 0.2s, border-color 0.2s, box-shadow 0.2s !important;
}

.elementor-8470 .elementor-element-d0fb39a .elementor-button:hover,
.elementor-8470 .elementor-element-31b14add .elementor-button:hover,
.elementor-8470 .elementor-element-42ec8b26 .elementor-button:hover,
.elementor-8470 .elementor-element-aaa5490 .elementor-button:hover,
.elementor-8470 .elementor-element-df5699f .elementor-button:hover,
.elementor-8470 .elementor-element-f03ddf9 .elementor-button:hover {
  background: rgba(108,142,255,0.12) !important;
  border-color: #6c8eff !important;
  box-shadow: 0 0 18px rgba(108,142,255,0.18) !important;
}

/* ----------------------------------------------------------
   9. MOBILE TAB SWITCHER
   ---------------------------------------------------------- */

.elementor-8470 .tf-tabnav ul {
  display: flex !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  padding: 0 1.25rem !important;
  list-style: none !important;
  margin: 0 !important;
}

.elementor-8470 .tf-tabnav .tablinks {
  padding: 0.8rem 1.4rem !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  color: #5a607a !important;
  border-bottom: 2px solid transparent !important;
  background: transparent !important;
  cursor: pointer !important;
  transition: color 0.18s, border-color 0.18s !important;
}

.elementor-8470 .tf-tabnav .tablinks.active {
  color: #6c8eff !important;
  border-bottom-color: #6c8eff !important;
}

/* ----------------------------------------------------------
   10. MOBILE
   ---------------------------------------------------------- */

@media (max-width: 767px) {
  .elementor-8470 .elementor-element-fd10188 {
    min-height: 260px !important;
  }
  .elementor-8470 .elementor-element-b865288,
  .elementor-8470 .elementor-element-7960f97 {
    padding-top: 2.5rem !important;
  }
}

/* ============================================================
   END Blog-Light
   ============================================================ */

/* ============================================================
   Blog-Mobile PATCH
   ============================================================ */

@media (max-width: 767px) {

  /* Remove all excess padding/margin on carousel sections */
  .elementor-8470 .elementor-element-a91ab39,
  .elementor-8470 .elementor-element-f4f0bdb,
  .elementor-8470 .elementor-element-356489df,
  .elementor-8470 .elementor-element-6c3508c {
    padding: 0 0 2rem !important;
  }

  /* Remove top padding on the carousel widget wrappers */
  .elementor-8470 .elementor-element-30f7a3b7,
  .elementor-8470 .elementor-element-65031037,
  .elementor-8470 .elementor-element-5f8cefa,
  .elementor-8470 .elementor-element-b082c6a {
    padding: 0 !important;
    margin-top: 0 !important;
  }

  /* Kill the top gap above the thumbnail */
  .elementor-8470 .uc_image_carousel_container_holder {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .elementor-8470 .uc_image_carousel_placeholder {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* Tighten section heading padding */
  .elementor-8470 .elementor-element-b865288,
  .elementor-8470 .elementor-element-7960f97 {
    padding-top: 2.25rem !important;
    padding-bottom: 0.25rem !important;
  }

  /* Section headings font size */
  .elementor-8470 .elementor-element-b865288 .elementor-heading-title,
  .elementor-8470 .elementor-element-7960f97 .elementor-heading-title {
    font-size: 1.6rem !important;
  }

  /* Card title — slightly smaller on mobile but still bold */
  .elementor-8470 .uc_post_title,
  .elementor-8470 .uc_image_carousel_content .uc_post_title,
  .elementor-8470 .uc_image_carousel_content_holder .uc_post_title {
    font-size: 1rem !important;
    font-weight: 700 !important;
    line-height: 1.38 !important;
    color: #0d0f1a !important;
  }

  /* Meta text */
  .elementor-8470 .ue-grid-item-meta-data,
  .elementor-8470 .uc_image_carousel_content .ue-grid-item-meta-data {
    font-size: 0.76rem !important;
  }

  /* Card content padding */
  .elementor-8470 .uc_image_carousel_content_holder {
    padding: 0.85rem 1rem 1.1rem !important;
  }

  /* View All button — centered, full readable size */
  .elementor-8470 .elementor-element-d0fb39a,
  .elementor-8470 .elementor-element-31b14add,
  .elementor-8470 .elementor-element-42ec8b26,
  .elementor-8470 .elementor-element-aaa5490,
  .elementor-8470 .elementor-element-df5699f,
  .elementor-8470 .elementor-element-f03ddf9 {
    text-align: center !important;
    padding-top: 1rem !important;
    padding-bottom: 0.5rem !important;
  }

  /* Hero */
  .elementor-8470 .elementor-element-fd10188 {
    min-height: 280px !important;
  }

  .elementor-8470 .elementor-element-fd10188 .elementor-heading-title {
    font-size: 1.3rem !important;
  }

  /* Reduce dead space between hero and first section */
  .elementor-8470 .elementor-element-b865288 {
    margin-top: 0 !important;
  }
}

/* ============================================================
   END Blog-Mobile
   ============================================================ */