/*
 * TEKY Weideng v3 layout compatibility fixes.
 * These rules intentionally load after site.css / gutenberg.css so the
 * front-end is not narrowed by WordPress' generated constrained-layout CSS.
 */

/* --------------------------------------------------------------
   Header visibility / desktop structure
-------------------------------------------------------------- */
.site-header .wp-block-navigation-item__content,
.site-header .wp-block-navigation-item__label,
.site-header .header-blog a,
.site-header .language-switcher,
.site-header .language-switcher summary {
  color:#fff !important;
}
.site-header .wordmark a {
  color:#596168 !important;
}
.site-header .wp-block-navigation .mobile-blog-link {
  display:none !important;
}
.site-header .wp-block-navigation__submenu-icon {
  color:var(--cyan) !important;
}
.site-header .header-inner {
  max-width:1360px !important;
}
.site-header .wp-block-navigation .has-child .wp-block-navigation__submenu-container .wp-block-navigation-item__content,
.site-header .wp-block-navigation .has-child .wp-block-navigation__submenu-container .wp-block-navigation-item__label {
  color:#fff !important;
}
.site-header .wp-block-navigation .has-child .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
  color:var(--cyan) !important;
}

/* --------------------------------------------------------------
   Home hero: truly full viewport width and height
-------------------------------------------------------------- */
.wp-block-post-content > .teky-home-hero.alignfull,
.teky-home-hero.alignfull {
  width:100vw !important;
  max-width:none !important;
  min-height:760px !important;
  height:100svh !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  padding-left:max(7vw,40px) !important;
  padding-right:max(7vw,40px) !important;
  background:#071010 !important;
  color:#fff !important;
}
.teky-home-hero > .hero-frame,
.teky-home-hero > figure.hero-frame {
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  max-width:none !important;
  height:100% !important;
  margin:0 !important;
}
.teky-home-hero > .hero-frame img,
.teky-home-hero > figure.hero-frame img {
  width:100% !important;
  max-width:none !important;
  height:100% !important;
  object-fit:cover !important;
}
.teky-home-hero > .hero-copy {
  width:min(730px,52vw) !important;
  max-width:730px !important;
  margin-left:0 !important;
  margin-right:0 !important;
}
.teky-home-hero .hero-copy h1,
.teky-home-hero .hero-copy .wp-block-heading {
  color:#fff !important;
}
.teky-home-hero .hero-copy > p:not(.hero-kicker) {
  color:rgba(255,255,255,.76) !important;
}
.teky-home-hero .hero-kicker {
  color:var(--cyan) !important;
}

/* --------------------------------------------------------------
   Restore intended 1280px home section width.
   WordPress constrained blocks otherwise cap these at contentSize=860px.
-------------------------------------------------------------- */
.teky-section.page-width,
.teky-about-feature.page-width,
.teky-home-news.page-width,
.teky-advantages > .page-width {
  width:min(1280px,calc(100% - 64px)) !important;
  max-width:1280px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.teky-section > .teky-section-heading,
.teky-section > .teky-category-list,
.teky-section > .wp-block-query,
.teky-home-news > .teky-section-heading,
.teky-home-news > .wp-block-query,
.teky-advantages > .page-width > .teky-section-heading,
.teky-advantages > .page-width > .teky-advantage-grid {
  margin-left:0 !important;
  margin-right:0 !important;
}
.teky-section > .teky-category-list,
.teky-section > .wp-block-query,
.teky-home-news > .wp-block-query,
.teky-advantages > .page-width > .teky-advantage-grid {
  width:100% !important;
  max-width:none !important;
}
.teky-section > .teky-section-heading,
.teky-home-news > .teky-section-heading,
.teky-advantages > .page-width > .teky-section-heading {
  width:100% !important;
  max-width:880px !important;
}

/* About block should use the same page width rather than the global 860px cap. */
.teky-about-feature > .wp-block-image,
.teky-about-feature > .teky-about-copy {
  max-width:none !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* --------------------------------------------------------------
   Query Loop / product cards
   The old .featured-grid rule was also applied to the Query wrapper, which
   made the post-template only one quarter of the available width. Keep the
   Query wrapper block-level and grid only the actual post-template.
-------------------------------------------------------------- */
.wp-block-query.product-grid {
  display:block !important;
  grid-template-columns:none !important;
  width:100% !important;
  max-width:none !important;
}
.wp-block-query.product-grid > .wp-block-post-template {
  width:100% !important;
  max-width:none !important;
  margin-left:0 !important;
  margin-right:0 !important;
  padding-left:0 !important;
  padding-right:0 !important;
  display:grid !important;
}
.teky-section > .wp-block-query.featured-grid > .wp-block-post-template {
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:28px !important;
}
.related-products .wp-block-query.featured-grid > .wp-block-post-template,
.wp-block-query.catalog-grid > .wp-block-post-template {
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:28px !important;
}
.product-card.wp-block-group {
  min-width:0 !important;
  width:auto !important;
  max-width:none !important;
  margin:0 !important;
}
.product-card .product-card-copy,
.product-card .product-card-copy > * {
  max-width:none !important;
}

/* News query also needs to escape the generated 860px content cap. */
.teky-home-news .wp-block-post-template {
  width:100% !important;
  max-width:none !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* --------------------------------------------------------------
   Palette / contrast consistency with the generated TEKY preview
-------------------------------------------------------------- */
body {
  background:#edf7ff !important;
  color:#050708 !important;
}
.teky-section,
.teky-about-feature,
.teky-home-news {
  color:#050708 !important;
}
.teky-section h1,.teky-section h2,.teky-section h3,
.teky-about-feature h1,.teky-about-feature h2,.teky-about-feature h3,
.teky-home-news h1,.teky-home-news h2,.teky-home-news h3 {
  color:#050708 !important;
}
.teky-advantages {
  width:100% !important;
  max-width:none !important;
  background:#071012 !important;
  color:#fff !important;
}
.teky-advantages h1,
.teky-advantages h2,
.teky-advantages h3,
.teky-advantages .wp-block-heading {
  color:#fff !important;
}
.teky-advantages .teky-section-heading > p,
.teky-advantages .teky-advantage-card p {
  color:rgba(255,255,255,.68) !important;
}
.teky-advantages .teky-advantage-card {
  background:rgba(255,255,255,.035) !important;
  border-color:rgba(255,255,255,.13) !important;
}
.product-card.wp-block-group,
.teky-news-card {
  background:#fff !important;
  color:#050708 !important;
}
.product-card.wp-block-group:hover {
  background:#101416 !important;
  color:#fff !important;
}
.product-card.wp-block-group:hover h3,
.product-card.wp-block-group:hover a {
  color:#fff !important;
}

/* --------------------------------------------------------------
   Responsive layout
-------------------------------------------------------------- */
@media (max-width:1180px) {
  .teky-section > .wp-block-query.featured-grid > .wp-block-post-template {
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

@media (max-width:1024px) {
  .teky-section.page-width,
  .teky-about-feature.page-width,
  .teky-home-news.page-width,
  .teky-advantages > .page-width {
    width:min(100% - 40px,1280px) !important;
  }
  .teky-section > .wp-block-query.featured-grid > .wp-block-post-template,
  .related-products .wp-block-query.featured-grid > .wp-block-post-template,
  .wp-block-query.catalog-grid > .wp-block-post-template {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width:782px) {
  .site-header .wp-block-navigation .mobile-blog-link {
    display:flex !important;
  }
  .site-header .header-actions .header-blog {
    display:none !important;
  }
  .site-header .wp-block-navigation__responsive-container-open,
  .site-header .wp-block-navigation__responsive-container-open svg {
    color:#fff !important;
    fill:currentColor !important;
  }
  .teky-home-hero.alignfull {
    height:820px !important;
    min-height:820px !important;
    padding:120px 20px 70px !important;
  }
  .teky-home-hero > .hero-copy {
    width:100% !important;
    max-width:690px !important;
    padding-top:30px !important;
  }
  .teky-section.page-width,
  .teky-about-feature.page-width,
  .teky-home-news.page-width,
  .teky-advantages > .page-width {
    width:min(100% - 30px,1280px) !important;
  }
  .teky-section > .wp-block-query.featured-grid > .wp-block-post-template,
  .related-products .wp-block-query.featured-grid > .wp-block-post-template,
  .wp-block-query.catalog-grid > .wp-block-post-template {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:12px !important;
  }
}

@media (max-width:520px) {
  .teky-section.page-width,
  .teky-about-feature.page-width,
  .teky-home-news.page-width,
  .teky-advantages > .page-width {
    width:calc(100% - 24px) !important;
  }
}
