.elementor-kit-8{--e-global-color-primary:#1F1D18;--e-global-color-secondary:#002626;--e-global-color-text:#1F1D18;--e-global-color-accent:#04BFAD;--e-global-color-1ad03be:#D95D4C;--e-global-color-c47fc28:#7E7B77;--e-global-color-1d794df:#F4F2EE;--e-global-color-38ce4aa:#FFFCF2;--e-global-typography-primary-font-family:"Roboto Flex";--e-global-typography-primary-font-size:2.5rem;--e-global-typography-primary-font-weight:600;--e-global-typography-primary-line-height:3rem;--e-global-typography-secondary-font-family:"Roboto Flex";--e-global-typography-secondary-font-size:2rem;--e-global-typography-secondary-font-weight:600;--e-global-typography-secondary-line-height:2.5rem;--e-global-typography-text-font-family:"Roboto Flex";--e-global-typography-text-font-size:1.5rem;--e-global-typography-text-font-weight:500;--e-global-typography-text-line-height:1.4rem;--e-global-typography-accent-font-family:"Roboto Flex";--e-global-typography-accent-font-size:1.25rem;--e-global-typography-accent-font-weight:500;--e-global-typography-accent-line-height:1.4rem;--e-global-typography-e2bced3-font-family:"Roboto Flex";--e-global-typography-e2bced3-font-size:1.125rem;--e-global-typography-e2bced3-line-height:1.4rem;--e-global-typography-943b019-font-family:"Darker Grotesque";--e-global-typography-943b019-font-size:1.125rem;--e-global-typography-943b019-font-weight:400;--e-global-typography-943b019-line-height:1.7rem;--e-global-typography-1876bcc-font-family:"Darker Grotesque";--e-global-typography-1876bcc-font-size:1rem;--e-global-typography-1876bcc-font-weight:400;--e-global-typography-1876bcc-line-height:1.6rem;--e-global-typography-1ae2f48-font-family:"Darker Grotesque";--e-global-typography-1ae2f48-font-size:0.875rem;--e-global-typography-1ae2f48-font-weight:400;--e-global-typography-1ae2f48-line-height:1.5rem;--e-global-typography-2853b02-font-family:"Darker Grotesque";--e-global-typography-2853b02-font-size:0.75rem;--e-global-typography-2853b02-line-height:1.4rem;--e-global-typography-5fbd8a7-font-family:"Darker Grotesque";--e-global-typography-5fbd8a7-font-size:1.5rem;--e-global-typography-5fbd8a7-line-height:1.7rem;--e-global-typography-1633e5c-font-family:"Darker Grotesque";--e-global-typography-1633e5c-font-size:24px;--e-global-typography-1633e5c-font-weight:400;--e-global-typography-1633e5c-line-height:30px;--e-global-typography-9f18731-font-family:"Roboto Flex";--e-global-typography-9f18731-font-size:50px;--e-global-typography-9f18731-font-weight:500;--e-global-typography-9f18731-line-height:55px;background-color:var( --e-global-color-1d794df );}.elementor-kit-8 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1920px;}.e-con{--container-max-width:1920px;--container-default-padding-top:0px;--container-default-padding-right:100px;--container-default-padding-bottom:0px;--container-default-padding-left:100px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* =========================================================
   TECKNUOVO – GLOBAL LAYOUT + MOBILE RESPONSIVENESS
   Consolidated and cleaned – No header rules. Safe for all pages.
   Last updated: November 2025
========================================================= */


/* ===================== 0. BASE SAFETY ===================== */

/* Stop horizontal scroll without shrinking the page */
html,
body {
  overflow-x: hidden;
  width: 100%;
  max-width: 100vw;
}

/* Core content wrappers */
main,
#content,
.site-main,
.page-content {
  overflow-x: hidden;
  max-width: 100vw;
  box-sizing: border-box;
}

/* Generic Elementor containers should not overflow */
.elementor-motion-effects-container,
.e-con,
.elementor-section,
.elementor-container {
  max-width: 100%;
}

/* Cookie / third party dialogs stay inside viewport */
#CybotCookiebotDialog,
#CookiebotWidget,
[id*="Cookiebot"] {
  max-width: 100vw !important;
}

/* Media scale responsively */
main img,
main video,
main iframe,
#content img,
#content video,
#content iframe,
.page-content img,
.page-content video,
.page-content iframe {
  max-width: 100%;
  height: auto;
}

/* Body copy should not cause sideways scrolling */
main p,
#content p,
.page-content p {
  word-wrap: break-word;
  overflow-wrap: break-word;
}

/* Forms keep within viewport */
main input,
main textarea,
main select,
main button,
#content input,
#content textarea,
#content select,
#content button,
.page-content input,
.page-content textarea,
.page-content select,
.page-content button {
  max-width: 100%;
  box-sizing: border-box;
}

/* Prevent iOS overscroll bounce */
html {
  overscroll-behavior: none;
}

body {
  overscroll-behavior-y: none;
}


/* ===================== 1. LOGO MARQUEE ===================== */

/* Layout only – JS handles motion */
.tgtm-lm {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.tgtm-lm__mask {
  display: flex;
  align-items: center;
  width: 100%;
  overflow: hidden;
}

.tgtm-lm__track {
  display: flex;
  align-items: center;
  gap: var(--tgtm-gap, 80px);
  will-change: transform;
  animation-play-state: running !important;
}

.tgtm-lm__item img {
  display: block;
  height: 60px;
  width: auto;
  max-height: 100%;
}


/* ===================== 2. VIDEO WIDGETS AND BACKGROUNDS ===================== */

/* Regular video widgets – 16:9 wrapper */
.elementor-widget-video .elementor-wrapper {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}

.elementor-widget-video .elementor-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

/* Background videos – FULLSCREEN COVER */
.elementor-background-video-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

/* Strong override so Elementor cannot force 16:9 on background video */
.elementor-background-video-container iframe,
.elementor-background-video-container video,
.elementor-background-video-embed {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  min-width: 100% !important;
  min-height: 100% !important;
  width: auto !important;
  height: auto !important;
  object-fit: cover !important;
}


/* ===================== 3. BLOG HERO DECORATION ===================== */

.blog-hero .elementor-container:before {
  content: '';
  position: absolute;
  top: 8%;
  right: 12%;
  width: 180px;
  height: 180px;
  border-radius: 20px;
  background: linear-gradient(
    135deg,
    rgba(4, 191, 173, 0.1) 0%,
    rgba(0, 38, 38, 0.06) 100%
  );
  transform: rotate(12deg);
  pointer-events: none;
  z-index: 1;
}


/* ===================== 4. TABLET BREAKPOINT (≤1365px) ===================== */

@media (max-width: 1365px) {

  /* 4.1 Core wrappers */
  html,
  body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }

  main,
  #content,
  .site-main,
  .page-content {
    overflow-x: hidden !important;
    max-width: 100vw !important;
    box-sizing: border-box !important;
  }

  /* 4.2 Containers and grids – full width */
  main .e-con,
  main .e-con-inner,
  main .e-con-full,
  main .e-con-boxed,
  main .elementor-section,
  main .elementor-container,
  main .elementor-column,
  #content .e-con,
  #content .e-con-inner,
  #content .e-con-full,
  #content .e-con-boxed,
  #content .elementor-section,
  #content .elementor-container,
  #content .elementor-column,
  .page-content .e-con,
  .page-content .e-con-inner,
  .page-content .e-con-full,
  .page-content .e-con-boxed,
  .page-content .elementor-section,
  .page-content .elementor-container,
  .page-content .elementor-column {
    width: 100%;
    max-width: 100%;
  }

  /* 4.3 Boxed layouts – side padding */
  main .e-con-boxed > .e-con-inner,
  #content .e-con-boxed > .e-con-inner,
  .page-content .e-con-boxed > .e-con-inner {
    padding-left: 15px;
    padding-right: 15px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    max-width: 100%;
  }

  /* 4.4 Swiper / carousels */
  main .swiper,
  main .swiper-container,
  main .e-n-carousel,
  #content .swiper,
  #content .swiper-container,
  #content .e-n-carousel,
  .page-content .swiper,
  .page-content .swiper-container,
  .page-content .e-n-carousel {
    overflow: hidden;
    width: 100%;
    max-width: 100%;
  }

  /* 4.5 Logo marquee containment */
  main .tgtm-lm,
  main .tgtm-lm__mask,
  main .tgtm-lm__track,
  #content .tgtm-lm,
  #content .tgtm-lm__mask,
  #content .tgtm-lm__track,
  .page-content .tgtm-lm,
  .page-content .tgtm-lm__mask,
  .page-content .tgtm-lm__track {
    max-width: 100%;
    overflow: hidden;
  }

  .tgtm-lm__track {
    display: flex !important;
    animation-play-state: running !important;
    will-change: transform;
  }

  .tgtm-lm__item {
    flex-shrink: 0;
  }

  .tgtm-lm__mask {
    overflow: hidden !important;
    width: 100%;
  }

  /* 4.7 TN hero – tablet adjustments */
  .tn-hero .e-con-inner {
    max-width: 100%;
  }

  .tn-hero .elementor-widget-heading {
    width: 100% !important;
  }

  .tn-hero .elementor-heading-title {
    display: block;
    max-width: 90vw;
    margin: 0 0 12px;
    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: break-word !important;
    font-size: clamp(28px, 7vw, 44px);
    line-height: 1.15;
  }

  .tn-hero .elementor-widget-text-editor {
    max-width: 90vw;
    font-size: 16px;
    line-height: 1.4;
  }
}


/* ===================== 5. MOBILE BREAKPOINT (≤767px) ===================== */

@media (max-width: 767px) {

  /* 5.1 Heading container rules */
  .elementor-widget-heading,
  .elementor-widget-heading .elementor-heading-title {
    width: 100%;
    max-width: 100%;
    display: block;
  }

  /* 5.3 TN Hero headings – mobile override */
  .tn-hero .elementor-heading-title,
  .tn-hero .elementor-widget-heading .elementor-heading-title,
  .tn-hero h1.elementor-heading-title,
  .tn-hero h2.elementor-heading-title {
    font-size: clamp(26px, 8vw, 40px) !important;
    line-height: 1.15 !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
  }

  /* 5.4 Proportional scaling for all heading levels */
  h1.elementor-heading-title,
  .elementor-widget-heading h1 {
    font-size: clamp(28px, 8vw, 48px) !important;
    line-height: 1.15 !important;
  }

  h2.elementor-heading-title,
  .elementor-widget-heading h2 {
    font-size: clamp(24px, 7vw, 40px) !important;
    line-height: 1.2 !important;
  }

  h3.elementor-heading-title,
  .elementor-widget-heading h3 {
    font-size: clamp(20px, 6vw, 32px) !important;
    line-height: 1.25 !important;
  }

  h4.elementor-heading-title,
  .elementor-widget-heading h4 {
    font-size: clamp(18px, 5vw, 26px) !important;
    line-height: 1.3 !important;
  }

  h5.elementor-heading-title,
  .elementor-widget-heading h5 {
    font-size: clamp(16px, 4.5vw, 22px) !important;
    line-height: 1.35 !important;
  }

  h6.elementor-heading-title,
  .elementor-widget-heading h6 {
    font-size: clamp(14px, 4vw, 18px) !important;
    line-height: 1.4 !important;
  }

  /* 5.5 Inline spans inherit heading sizing */
  .elementor-heading-title span,
  .tn-hero .elementor-heading-title span {
    font-size: inherit !important;
    line-height: inherit !important;
  }

  /* 5.6 Text editor widgets – consistent body copy */
  .elementor-widget-text-editor {
    font-size: 15px;
    line-height: 1.5;
  }

  .elementor-widget-text-editor p {
    font-size: inherit;
    line-height: inherit;
  }
}

/* 5.7 Force 100vh sections to show content without scrolling */
@media (max-width: 1365px) {
  
  /* Any container set to 100vh in Elementor */
  .e-con[data-settings*="100vh"],
  .e-con[style*="100vh"],
  [style*="min-height: 100vh"],
  [style*="min-height:100vh"] {
    height: 100vh !important;
    min-height: 100vh !important;
    max-height: 100vh !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    padding-bottom: 60px !important;
    box-sizing: border-box !important;
  }

  /* Inner container should also flex to bottom */
  .e-con[data-settings*="100vh"] > .e-con-inner,
  .e-con[style*="100vh"] > .e-con-inner {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    height: 100% !important;
  }

  /* If using tn-hero class */
  .tn-hero {
    height: 100vh !important;
    min-height: 100vh !important;
    max-height: 100vh !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    padding-bottom: 60px !important;
    box-sizing: border-box !important;
  }

  .tn-hero > .e-con-inner {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    height: 100% !important;
  }
}


/* ===================== 6. SPECIFIC ELEMENT OVERRIDES ===================== */

/* Keep this one known container full width on mobile */
@media (max-width: 767px) {
  .e-con[data-id="e5c3462"] {
    width: 100% !important;
    max-width: 100% !important;
  }

  .e-con[data-id="e5c3462"] .elementor-widget {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }
}

/* Extra: make sure tn-hero background video covers viewport on mobile/tablet */
@media (max-width: 1024px) {

  .tn-hero,
  .tn-hero.e-con {
    position: relative !important;
  }

  .tn-hero > .elementor-background-video-container {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
  }

  .tn-hero > .elementor-background-video-container iframe,
  .tn-hero > .elementor-background-video-container video,
  .tn-hero > .elementor-background-video-embed {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    min-width: 100% !important;
    min-height: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: cover !important;
  }
}/* End custom CSS */