/**
 * Saved Elementor exports — responsive fixes (theme loads after export CSS).
 *
 * @package Teknnovation
 */

/* Elementor HFB chrome: single bar in flow (export omitted full sticky JS). */
body.ehf-header #masthead .elementor-element-4b9e0f9.elementor-sticky {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* Tighten masthead: remove extra gaps above/below the black nav bar */
body.ehf-header {
  padding-top: 0 !important;
  line-height: 0 !important;
}

body.ehf-header #page {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.ehf-header #masthead {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 0 !important;
}

body.ehf-header #masthead .elementor.elementor-12 {
  margin: 0 !important;
  padding: 0 !important;
}

body.ehf-header #masthead .elementor-element-4b9e0f9 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

body.ehf-header #masthead .elementor-element-ab9c73f .elementor-container {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.ehf-header #masthead .elementor-element-f1270bf > .elementor-widget-container {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/*
 * Elementor kit (post-10.css) sets global widget spacing:
 * .elementor-widget:not(:last-child){ margin-block-end: 20px }
 * .elementor-element { --widgets-spacing: 20px }
 * That adds visible gaps above/below the nav strip unless scoped here.
 */
#page #masthead .elementor-element {
  --widgets-spacing: 0px !important;
  --widgets-spacing-row: 0 !important;
  --widgets-spacing-column: 0 !important;
}

#page #masthead .elementor-widget:not(:last-child) {
  margin-block-end: 0 !important;
  margin-bottom: 0 !important;
}

#page #masthead .elementor-12 .elementor-element.elementor-element-f1270bf > .elementor-widget-container {
  padding: 0 !important;
}

#page #masthead .elementor-element.elementor-element-220f28d > .elementor-widget-container {
  padding: 0 !important;
  margin: 0 !important;
}

#page #masthead .elementor-inner-section.elementor-element-ab9c73f {
  margin: 0 !important;
  padding: 0 !important;
}

#page #masthead .elementor-inner-section.elementor-element-ab9c73f > .elementor-container {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

#page #masthead .elementor-top-section.elementor-element-4b9e0f9 > .elementor-container {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

#page #masthead .elementor-column > .elementor-widget-wrap.elementor-element-populated {
  padding-block: 0 !important;
}

#page #masthead .elementor-container {
  gap: 0 !important;
  row-gap: 0 !important;
  column-gap: 0 !important;
}

/* Vertically center logo column + nav column in the masthead row */
#page #masthead .elementor-top-section.elementor-element-4b9e0f9 > .elementor-container {
  display: flex !important;
  align-items: center !important;
}

#page #masthead .elementor-inner-section.elementor-element-ab9c73f > .elementor-container {
  display: flex !important;
  align-items: center !important;
}

#page #masthead .elementor-inner-section.elementor-element-ab9c73f .elementor-column .elementor-widget-wrap.elementor-element-populated {
  display: flex !important;
  align-items: center !important;
}

#page #masthead .elementor-widget-nav-menu .elementor-widget-container {
  display: flex !important;
  align-items: center !important;
}

body.ehf-header #page #masthead {
  line-height: normal !important;
}

#page #masthead img {
  display: block;
}

/* Reset readable line-height for nav controls after masthead line-height collapse */
#page #masthead .elementor-nav-menu .elementor-item,
#page #masthead .elementor-menu-toggle,
#page #masthead .elementor-menu-toggle i {
  line-height: 1.2 !important;
}

/* Mobile dropdown visibility is controlled by JS class toggles */
@media (max-width: 991px) {
  #page #masthead .elementor-widget-nav-menu .elementor-nav-menu--dropdown {
    display: none !important;
  }

  #page #masthead .elementor-widget-nav-menu .elementor-menu-toggle[aria-expanded="true"] + .elementor-nav-menu--dropdown {
    display: block !important;
  }

  #page #masthead .elementor-widget-nav-menu.tekn-mobile-open .elementor-nav-menu--dropdown {
    display: block !important;
  }

  /* Elementor export pins --menu-height: 0 on the dropdown; allow the panel to grow when open */
  #page #masthead .elementor-widget-nav-menu,
  #page #masthead .elementor-widget-nav-menu .elementor-widget-container {
    overflow: visible !important;
  }

  #page #masthead .elementor-widget-nav-menu.tekn-mobile-open .elementor-nav-menu--dropdown,
  #page #masthead .elementor-widget-nav-menu .elementor-menu-toggle[aria-expanded="true"] + .elementor-nav-menu--dropdown {
    max-height: none !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    opacity: 1 !important;
    visibility: visible !important;
    --menu-height: 9999px !important;
    transform: none !important;
    clip: auto !important;
    -webkit-clip-path: none !important;
    clip-path: none !important;
  }
}

/* Gap between masthead and page body (first Elementor section often has top margin/padding) */
body.ehf-header #main-content,
body.ehf-header #main-content.tekn-page--saved-elementor {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.ehf-header #main-content .entry-content > .elementor:first-child .elementor-top-section:first-child {
  margin-top: 0 !important;
}

body.ehf-header #main-content .entry-content > .elementor:first-child .elementor-top-section:first-child > .elementor-container {
  padding-top: 0 !important;
}

/* Keep readable typography for all site content while body line-height is collapsed */
body.ehf-header #main-content,
body.ehf-header #colophon {
  line-height: 1.6 !important;
}

body.ehf-header #main-content p,
body.ehf-header #main-content li,
body.ehf-header #main-content a,
body.ehf-header #main-content span,
body.ehf-header #main-content em,
body.ehf-header #main-content strong,
body.ehf-header #main-content small,
body.ehf-header #colophon p,
body.ehf-header #colophon li,
body.ehf-header #colophon a,
body.ehf-header #colophon span,
body.ehf-header #colophon em,
body.ehf-header #colophon strong,
body.ehf-header #colophon small {
  line-height: inherit;
}

/* Motion fallback (backup if class strip misses): Elementor motion placeholders */
.tekn-page--saved-elementor .elementor-invisible {
  opacity: 1 !important;
  visibility: visible !important;
}

/* Elements Kit tabs — hide inactive panes without Bootstrap JS */
.tekn-page--saved-elementor .elementkit-tab-content .tab-pane:not(.active):not(.show) {
  display: none !important;
}

.tekn-page--saved-elementor .elementkit-tab-content .tab-pane.active.show {
  display: block !important;
}

/* Mobile nav fallback (no Elementor frontend runtime) */
@media (max-width: 991px) {
  #page #masthead .elementor-widget-nav-menu {
    position: relative !important;
  }

  #page #masthead .elementor-widget-nav-menu .elementor-nav-menu--main {
    display: none !important;
  }

  #page #masthead .elementor-widget-nav-menu .elementor-menu-toggle {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    margin: 0 auto !important;
    border: 1px solid rgba(255, 255, 255, 0.7) !important;
    border-radius: 2px !important;
    background: transparent !important;
    color: #fff !important;
    line-height: 1 !important;
    cursor: pointer !important;
  }

  #page #masthead .elementor-widget-nav-menu .elementor-menu-toggle i {
    display: none !important;
  }

  #page #masthead .elementor-widget-nav-menu .elementor-menu-toggle::before {
    content: "\2630";
    display: block;
    font-size: 22px;
    font-weight: 600;
    line-height: 1;
    color: #fff;
  }

  #page #masthead .elementor-widget-nav-menu .elementor-menu-toggle[aria-expanded="true"]::before {
    content: "\00d7";
    font-size: 26px;
  }

  #page #masthead .elementor-widget-nav-menu .elementor-nav-menu--dropdown {
    position: absolute !important;
    left: 0 !important;
    top: 100% !important;
    width: 100% !important;
    margin-top: 0 !important;
    z-index: 9999 !important;
    background: #000 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.2) !important;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.45) !important;
  }

  #page #masthead .elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-nav-menu {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #page #masthead .elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item {
    display: block !important;
    width: 100% !important;
    color: #fff !important;
    padding: 12px 16px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
    line-height: 1.35 !important;
  }

  #page #masthead .elementor-widget-nav-menu .elementor-nav-menu--dropdown li:last-child .elementor-item {
    border-bottom: 0 !important;
  }
}

@media (min-width: 992px) {
  #page #masthead .elementor-widget-nav-menu .elementor-menu-toggle,
  #masthead .elementor-widget-nav-menu .elementor-menu-toggle {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
  }

  #page #masthead .elementor-widget-nav-menu .elementor-nav-menu--main {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    row-gap: 6px !important;
    column-gap: clamp(0.25rem, 1vw, 0.5rem) !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #page #masthead .elementor-widget-nav-menu .elementor-nav-menu--dropdown {
    display: none !important;
  }
}

.tekn-page--saved-elementor .entry-content {
  width: 100%;
  max-width: none;
  overflow: visible;
}

.elementor-page .elementor-section.elementor-section-stretched {
  width: 100% !important;
  max-width: none !important;
  left: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.elementor-page .elementor-section[style*="width"] {
  width: 100% !important;
  max-width: none !important;
  left: 0 !important;
}

.elementor-page .elementor-container {
  max-width: 100%;
}

@media (max-width: 767px) {
  .elementor-page .elementor-column {
    width: 100% !important;
  }

  .elementor-page .elementor-inner-section .elementor-column {
    width: 100% !important;
  }

  .elementor-page .elementor-hidden-mobile {
    display: none !important;
  }
}

@media (max-width: 1024px) {
  .elementor-page .elementor-hidden-tablet {
    display: none !important;
  }
}

.elementor-page img,
.elementor-page iframe,
.elementor-page video {
  max-width: 100%;
  height: auto;
}

.elementor-page .elementor-background-video-embed {
  max-width: none;
}

.elementor-page .elementor-widget-testimonial-carousel .elementor-main-swiper,
.elementor-page .elementor-widget-media-carousel .elementor-main-swiper,
.elementor-page .elementor-widget-image-carousel .swiper {
  width: 100%;
  overflow: hidden;
}

.elementor-page .elementor-widget-testimonial-carousel .swiper-slide {
  box-sizing: border-box;
}

@media (min-width: 768px) {
  .elementor-page .elementor-widget-testimonial-carousel .elementor-main-swiper .swiper-slide {
    width: calc(50% - 5px) !important;
    max-width: calc(50% - 5px) !important;
  }
}

@media (max-width: 767px) {
  .elementor-page .elementor-widget-testimonial-carousel .elementor-main-swiper .swiper-slide {
    width: 100% !important;
    max-width: 100% !important;
  }
}

@media (max-width: 480px) {
  .elementor-page .elementor-price-table,
  .elementor-page .elementkit-tab-wraper {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* Animation page — saved media carousels: HTML5 video + poster + square play overlay */
.elementor-page .tekn-video-carousel-slide {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #0c0c0c;
  border-radius: 4px;
  overflow: hidden;
}

.elementor-page .tekn-video-carousel-slide__media {
  display: block;
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
}

/* Snapshot Customizer: portfolio slide swapped to YouTube embed */
.elementor-page .tekn-video-carousel-slide__media--youtube-embed {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.elementor-page .tekn-video-carousel-slide__media--youtube-embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
}

.elementor-page .tekn-video-carousel-slide:has(.tekn-video-carousel-slide__media--youtube-embed) .tekn-video-carousel-slide__play {
  display: none;
}

.elementor-page .tekn-video-carousel-slide__play {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: rgba(0, 0, 0, 0.18);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s ease;
}

.elementor-page .tekn-video-carousel-slide__play:hover,
.elementor-page .tekn-video-carousel-slide__play:focus-visible {
  background: rgba(0, 0, 0, 0.32);
}

.elementor-page .tekn-video-carousel-slide.is-playing .tekn-video-carousel-slide__play {
  display: none;
}

.elementor-page .tekn-video-carousel-slide__play:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

.elementor-page .tekn-video-carousel-slide__play-inner {
  width: 56px;
  height: 56px;
  border: 3px solid #fff;
  border-radius: 4px;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.45);
}

/*
 * Theme masthead + colophon: Hello Elementor bundle (theme.css in export chain) applies
 * max-width constraints to .site-header:not(.dynamic-header) and .site-footer:not(.dynamic-footer).
 * Header/footer templates add dynamic-header / dynamic-footer; these rules catch any drift.
 */
body.elementor-page #masthead.site-header.dynamic-header,
body.elementor-page #colophon.site-footer.dynamic-footer {
  max-width: none !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

body.elementor-page #colophon.site-footer .tekn-footer-menu {
  column-count: 1 !important;
  columns: auto !important;
}

body.elementor-page #colophon.site-footer .tekn-footer-menu li {
  float: none !important;
  display: block !important;
  width: 100% !important;
}

body.elementor-page #colophon.site-footer .tekn-footer-menu a {
  font-style: normal !important;
  font-family: var(--font-heading), "Albert Sans", system-ui, sans-serif !important;
}

/* Footer Quick Links: Elementor Nav Menu — single vertical column (overrides horizontal/wrap). */
#colophon.site-footer .elementor-widget-nav-menu .elementor-nav-menu--main,
#colophon.site-footer .elementor-widget-nav-menu .elementor-nav-menu {
  flex-direction: column !important;
  align-items: flex-start !important;
  flex-wrap: nowrap !important;
}

#colophon.site-footer .elementor-widget-nav-menu .elementor-nav-menu--main > li,
#colophon.site-footer .elementor-widget-nav-menu .elementor-nav-menu > li {
  width: 100% !important;
  max-width: 100% !important;
}

/* Packaged inner-page hero slideshows (no Elementor frontend runtime). */
.tekn-page--saved-elementor .elementor-background-slideshow {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 0 !important;
}

.tekn-page--saved-elementor .elementor-top-section.elementor-section-height-min-height,
.tekn-page--saved-elementor .elementor-top-section.elementor-section-height-full {
  position: relative !important;
  overflow: hidden !important;
}

.tekn-page--saved-elementor .elementor-background-slideshow .swiper-wrapper,
.tekn-page--saved-elementor .elementor-background-slideshow .swiper-slide,
.tekn-page--saved-elementor .elementor-background-slideshow__slide {
  height: 100% !important;
}

.tekn-page--saved-elementor .elementor-background-slideshow__slide__image {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

.tekn-page--saved-elementor .elementor-top-section > .elementor-container {
  position: relative !important;
  z-index: 1 !important;
}

.tekn-page--saved-elementor .elementor-widget-image img {
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
}
