/*
Theme Name: Hello Elementor Child 28
Template: hello-elementor
Version: 0.1.0
Description: Site 28 reconstruction (pharma-reliance.com -> 28.feihuaweiye.com).
Text Domain: hello-elementor-child28
*/

/* Reference hides the top header on tablet/mobile and uses the fixed bottom bar. */
@media (max-width: 1024px) {
  .elementor-location-header { display: none !important; }
  .nbb2b-mobile-menu { display: flex !important; }
  .nbb2b-back-to-top { bottom: 66px !important; }
}

/* Native WP menu used by the header shortcode (keeps the Pro nav-menu JS out). */
.s28-nav-wrap { display: inline-block; }
.s28-nav, .s28-nav ul { list-style: none; margin: 0; padding: 0; }
.s28-nav { display: flex; align-items: center; gap: 26px; }
.s28-nav > li { position: relative; }
.s28-nav a { display: block; padding: 8px 0; color: #1f2a44; text-decoration: none; font-size: 15px; font-weight: 500; white-space: nowrap; }
.s28-nav > li:hover > a { color: #2b3f8c; }
.s28-nav li.menu-item-has-children > a::after { content: " ▾"; font-size: 11px; }
.s28-nav ul.sub-menu, .s28-nav ul.children {
  display: none; position: absolute; left: 0; top: 100%; z-index: 9999;
  min-width: 230px; margin: 0; padding: 10px 0; background: #fff;
  border: 1px solid #e6e9f0; box-shadow: 0 12px 30px rgba(20,30,60,.14);
}
.s28-nav li:hover > ul.sub-menu, .s28-nav li:hover > ul.children { display: block; }
.s28-nav ul.sub-menu a, .s28-nav ul.children a { padding: 8px 18px; font-size: 14px; font-weight: 400; }
.s28-nav ul.sub-menu a:hover, .s28-nav ul.children a:hover { background: #f3f5fb; color: #2b3f8c; }
.s28-nav .sub-menu .sub-menu { left: 100%; top: 0; }

/* Atomic step-flow rows (reference uses five steps per row). */
[data-id="6c5023e9"] > .e-con,
[data-id="4f907e8d"] > .e-con,
[data-id="107ec6c1"] > .e-con,
[data-id="6adc1e7d"] > .e-con { width: 20% !important; min-width: 0; }
@media (max-width: 1024px) {
  [data-id="6c5023e9"] > .e-con,
  [data-id="4f907e8d"] > .e-con,
  [data-id="107ec6c1"] > .e-con,
  [data-id="6adc1e7d"] > .e-con { width: 50% !important; }
}
@media (max-width: 600px) {
  [data-id="6c5023e9"] > .e-con,
  [data-id="4f907e8d"] > .e-con,
  [data-id="107ec6c1"] > .e-con,
  [data-id="6adc1e7d"] > .e-con { width: 100% !important; }
}

/* Native inquiry modal used by the popup CTA. */
.s28-modal { position: fixed; inset: 0; z-index: 100000; display: none; align-items: center; justify-content: center; }
.s28-modal.is-open { display: flex; }
.s28-modal-backdrop { position: absolute; inset: 0; background: rgba(15,23,42,.62); }
.s28-modal-dialog { position: relative; width: min(520px, calc(100vw - 32px)); background: #fff; border-radius: 8px; padding: 32px; box-shadow: 0 25px 70px rgba(0,0,0,.35); text-align: left; }
.s28-modal-dialog h2 { margin: 0 0 12px; font-size: 28px; color: #222; }
.s28-modal-dialog p { color: #555; line-height: 1.7; margin: 0 0 22px; }
.s28-modal-close { position: absolute; right: 12px; top: 8px; border: 0; background: transparent; font-size: 30px; line-height: 1; color: #999; cursor: pointer; }
.s28-modal-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.s28-modal-actions a { display: inline-block; padding: 12px 20px; border-radius: 4px; color: #fff; text-decoration: none; font-weight: 600; }
.s28-modal-primary { background: #1f2a44; }
.s28-modal-secondary { background: #2b3f8c; }
html.s28-modal-open, html.s28-modal-open body { overflow: hidden; }

/* Header language switcher (uses TranslatePress URL prefixes). */
.s28-lang { position: relative; display: inline-block; }
.s28-lang-current { border: 1px solid #dcdcde; background: #fff; border-radius: 3px; padding: 10px 14px; font-size: 14px; color: #1f2a44; cursor: pointer; white-space: nowrap; }
.s28-lang-list { display: none; position: absolute; right: 0; top: calc(100% + 4px); z-index: 9999; min-width: 190px; margin: 0; padding: 8px 0; list-style: none; background: #fff; border: 1px solid #e6e9f0; box-shadow: 0 12px 30px rgba(20,30,60,.15); max-height: 360px; overflow: auto; }
.s28-lang:hover .s28-lang-list, .s28-lang:focus-within .s28-lang-list { display: block; }
.s28-lang-list a { display: block; padding: 8px 16px; color: #333; text-decoration: none; font-size: 14px; }
.s28-lang-list a:hover, .s28-lang-list a.current { background: #f3f5fb; color: #2b3f8c; }

/* Keep the header on ONE 81px row; the native search form otherwise adds a second row. */
.elementor-location-header form[role="search"] { display: flex !important; align-items: center; height: 40px !important; margin: 0 !important; padding: 0 !important; }
.elementor-location-header form[role="search"] label { display: flex !important; align-items: center; margin: 0 !important; padding: 0 !important; }
.elementor-location-header form[role="search"] .search-field,
.elementor-location-header form[role="search"] input[type="search"] { height: 40px !important; margin: 0 !important; box-sizing: border-box; }
.elementor-location-header form[role="search"] .search-submit { height: 40px !important; margin: 0 !important; }
.elementor-location-header .elementor-search-form,
.elementor-location-header .cxb-b2b-product-search { height: 40px !important; }

@media (min-width: 1025px) {
  .elementor-location-header,
  .elementor-location-header .e-con-inner,
  .elementor-location-header .elementor-element-643e4ab8 { height: 81px !important; min-height: 81px !important; max-height: 81px !important; padding-top: 0 !important; padding-bottom: 0 !important; }
  .elementor-location-header .e-con-inner { align-items: center !important; }
}

/* Reference single-post template is a 72/26 two-column layout. */
@media (min-width: 1025px) {
  .single-post [data-id="cb62028"] > .e-con-inner { flex-wrap: nowrap !important; align-items: flex-start !important; }
  .single-post [data-id="cb62028"] > .e-con-inner > .e-con:first-child { width: 72% !important; min-width: 0 !important; }
  .single-post [data-id="cb62028"] > .e-con-inner > .e-con:nth-child(2) { width: 26% !important; min-width: 0 !important; }
}
@media (max-width: 1024px) {
  .single-post [data-id="cb62028"] > .e-con-inner { flex-wrap: wrap !important; }
  .single-post [data-id="cb62028"] > .e-con-inner > .e-con { width: 100% !important; }
}

/* Reference post template hides comments and caps the hero image at 400px. */
.single-post #comments,
.single-post .comment-respond,
.single-post .comments-area { display: none !important; }
.single-post [data-id="323076a"] img { height: 400px !important; width: 100% !important; object-fit: cover; }