/* Runtime compatibility only. Page design comes from the recovered WordPress CSS. */
html { scroll-behavior: smooth; }
body { margin: 0; }
img { max-width: 100%; height: auto; }

/* The recovered homepage header is shared by the server-rendered subpages too. */
@media (min-width: 1025px) {
  .pix-header-placeholder { min-height: 73px; }
  .pix-header-placeholder #masthead.is-scroll {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 99999 !important;
  }
}

/* Pixfort's transparent header has separate desktop and mobile templates. */
.source-header { position: relative; z-index: 1000; }
.source-header .original-topbar { position: relative; z-index: 2; }
.source-header .original-topbar > .container { min-height: 34px; gap: 18px; }
.source-header [data-area="header"] { position: absolute; inset: 34px 0 auto; z-index: 3; width: 100%; background: transparent; }
.source-header [data-area="header"] > .container { width: 100%; }
.source-header [data-col="header_1"] { width: 100%; align-items: center; }
.source-header .pix-menu-element { flex: 1 1 auto; }
.source-header .navbar-nav { flex-direction: row; }
.source-header .source-header-actions { display: flex; align-items: center; gap: 18px; }
.source-header .dropdown-menu { display: none; position: absolute; z-index: 20; }
.source-header .dropdown:hover > .dropdown-menu,
.source-header .dropdown:focus-within > .dropdown-menu,
.source-header .dropdown[open] > .dropdown-menu { display: block; }
.source-header .nav-item { position: relative; }
.source-header .nav-item > .dropdown-menu { top: 100%; left: 0; }
.source-header .pix-header-mobile { display: none; }
.source-header .source-mobile-menu { margin-left: auto; }
.source-header .source-mobile-menu > summary { list-style: none; cursor: pointer; }
.source-header .source-mobile-menu > summary::-webkit-details-marker { display: none; }
.source-header .hamburger-box { display: block; position: relative; width: 24px; height: 16px; }
.source-header .hamburger-inner,
.source-header .hamburger-inner::before,
.source-header .hamburger-inner::after { position: absolute; display: block; width: 24px; height: 2px; background: currentColor; content: ""; }
.source-header .hamburger-inner { top: 7px; }
.source-header .hamburger-inner::before { top: -7px; }
.source-header .hamburger-inner::after { top: 7px; }
.source-header .source-mobile-panel { display: none; }
.source-header .source-mobile-menu[open] .source-mobile-panel { display: block; position: absolute; inset: 100% 0 auto; z-index: 10; max-height: 80vh; overflow: auto; background: #fff; color: var(--pix-body-default, #3f3f46); box-shadow: var(--pix-shadow-md, 0 8px 24px #0002); }
.source-header .source-mobile-panel ul { display: block; padding: 0; list-style: none; }

/* Restore Elementor's expected video layer and overlay stacking. */
.e-con { position: relative; }
.elementor-background-video-container { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.elementor-background-video-container iframe { position: absolute; top: 50%; left: 50%; width: max(100%, 177.78vh); height: max(100%, 56.25vw); min-width: 100%; min-height: 100%; transform: translate(-50%, -50%); border: 0; }
.e-con > .elementor-background-video-container { z-index: 0; }
.e-con > .e-con-inner,
.e-con > .elementor-widget { position: relative; z-index: 1; }

/* State and transport affordances, with colors and typography inherited from Pixfort. */
.pix_tabs_content .tab-pane[hidden] { display: none; }
.contact-honey { position: absolute !important; left: -10000px !important; }
.contact-direct-links { display: grid; gap: 12px; }
.popup-shell { position: fixed; inset: 50% auto auto 50%; transform: translate(-50%, -50%); z-index: 99999; width: min(720px, calc(100vw - 32px)); max-height: 90vh; overflow: auto; background: #fff; padding: 24px; box-shadow: 0 10px 40px #0003; }
.popup-close { position: absolute; top: 8px; right: 8px; border: 0; background: transparent; font: inherit; font-size: 28px; cursor: pointer; }
.pix-small-search { display: flex; }
.pix-small-search input { min-width: 0; flex: 1; }
.search-results article { margin-block: 1.5rem; }
.comments-unavailable { font-style: italic; }

/* Related articles use the recovered image and title assets in a simple card grid. */
.blog-list-related { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.blog-card-related { height: 100%; overflow: hidden; border: 1px solid rgba(16, 42, 67, .12); border-radius: 12px; background: #fff; box-shadow: 0 8px 24px rgba(16, 42, 67, .08); transition: transform .2s ease, box-shadow .2s ease; }
.blog-card-related:hover { transform: translateY(-3px); box-shadow: 0 14px 32px rgba(16, 42, 67, .14); }
.blog-card-link { display: flex; height: 100%; flex-direction: column; color: inherit; text-decoration: none; }
.blog-card-link:hover { color: inherit; text-decoration: none; }
.blog-card-image { aspect-ratio: 16 / 9; overflow: hidden; background: #f1f4f6; }
.blog-card-image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.blog-card-related:hover .blog-card-image img { transform: scale(1.035); }
.blog-card-body { display: flex; flex: 1; flex-direction: column; align-items: flex-start; padding: 22px; }
.blog-card-body h2 { margin: 0 0 12px; font-size: 20px; line-height: 1.35; }
.blog-card-body p { margin: 0 0 18px; color: #536273; font-size: 15px; line-height: 1.65; }
.blog-card-read-more { display: inline-flex; gap: 8px; align-items: center; margin-top: auto; color: #0a2c58; font-weight: 700; }
@media (max-width: 900px) { .blog-list-related { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .blog-list-related { grid-template-columns: 1fr; gap: 18px; } .blog-card-body { padding: 18px; } }

@media (max-width: 1024px) {
  .source-header [data-area="header"] { display: none; }
  .source-header .pix-header-mobile { display: block; }
  .source-header .pix-header-mobile .container-fluid { width: 100%; }
  .source-header [data-col="m_header_1"] { display: flex; align-items: center; width: 100%; }
  .source-header .pix-header-mobile .navbar-brand { margin: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
