/* Update 40. Load from the staging header only.
   Specific roots prevent the display changes reaching legacy templates.
   Existing theme and provider CSS loads later, so precedence here is deliberate. */

#so-header-mobile-announcement { display: none; }

/* Requested on both desktop and mobile: white, unboxed review chevrons. */
html body #so-home-2026 .soh-review-feed > .soh-review-control {
  background: transparent !important;
  border: 0 !important;
  color: #fff !important;
  box-shadow: none !important;
}
html body #so-home-2026 .soh-review-feed > .soh-review-control i {
  border-top-color: #fff !important;
  border-right-color: #fff !important;
}
html body #so-footer-v39 .sof-plus,
html body #so-footer-v39 .sof-plus::before { color: #fff !important; }

/* Footer revision: Neto now supplies three top-level link groups.
   Keep two-group footers supported, and leave the mobile accordions intact. */
@media (min-width: 1101px) {
  html body #so-footer-v39 .sof-columns:has(> .sof-menu:nth-of-type(3)) {
    grid-template-columns: repeat(3,minmax(0,1fr)) minmax(260px,1.4fr);
    gap: 32px;
    align-items: start;
  }
}
@media (min-width: 768px) and (max-width: 1100px) {
  html body #so-footer-v39 .sof-columns:has(> .sof-menu:nth-of-type(3)) {
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 28px 24px;
    align-items: start;
  }
  html body #so-footer-v39 .sof-columns:has(> .sof-menu:nth-of-type(3)) > .sof-newsletter {
    grid-column: 1 / -1;
    width: 100%;
    max-width: 520px;
  }
}

/* The mobile header switches at the theme's existing 992px breakpoint. */
@media (max-width: 991px) {
  html body #so-header-announcement { position: relative; z-index: 103; overflow: visible; padding: 0; }
  html body #so-header-announcement > .custom-container { width: 100%; padding: 0 12px; }
  html body #so-header-announcement .new-top-shipping { display: none !important; }
  html body #so-header-mobile-announcement {
    display: grid; grid-template-columns: 54px minmax(0,1fr) 54px;
    align-items: center; min-height: 38px; width: 100%;
    color: #fff; background: #62665e;
  }
  html body #so-header-mobile-announcement .so-mobile-shipping {
    grid-column: 2; margin: 0; padding: 8px 0;
    color: #fff; font: 400 11px/1.4 halyard-text, Arial, sans-serif;
    letter-spacing: 0; text-transform: none; text-align: center;
    white-space: nowrap; text-decoration: none;
  }
  html body #so-header-mobile-announcement .curreny-dropdown { grid-column: 3; margin: 0; padding: 0; float: none; }
  html body #so-header-mobile-announcement .left-top-links { display: block; margin: 0; padding: 0; list-style: none; }
  html body #so-header-mobile-announcement .top-dc { position: relative; display: block; margin: 0; padding: 0; }
  html body #so-header-mobile-announcement .dropdown-toggle {
    display: flex; align-items: center; justify-content: flex-end; gap: 6px;
    min-height: 38px; padding: 0; color: #fff;
    font: 400 11px/1.4 halyard-text, Arial, sans-serif; text-decoration: none;
  }
  html body #so-header-mobile-announcement .dropdown-toggle > [id="wrap-curr-flag"],
  html body #so-header-mobile-announcement .dropdown-toggle > img { display: none; }
  html body #so-header-mobile-announcement .dropdown-toggle::after {
    content: ''; display: block; width: 6px; height: 6px; margin: -3px 2px 0 0;
    border: 0; border-bottom: 1px solid #fff; border-right: 1px solid #fff; transform: rotate(45deg);
  }
  html body #so-header-mobile-announcement .currselect { color: #fff; }
  html body #so-header-mobile-announcement .currencydrop {
    position: absolute; top: 100%; right: 0; left: auto; bottom: auto;
    width: 250px; max-width: calc(100vw - 24px); max-height: 65vh;
    overflow-y: auto; overscroll-behavior: contain; margin: 0; padding: 6px 0;
    background: #fff; color: #3d403b; border: 1px solid #d5d1c9;
    border-radius: 0; text-align: left; z-index: 10040;
  }
  html body #so-header-mobile-announcement .currencydrop a {
    display: flex; align-items: center; gap: 8px; min-height: 40px; margin: 0; padding: 9px 12px;
    color: #3d403b; background: #fff; font: 400 13px/1.4 halyard-text, Arial, sans-serif;
    letter-spacing: 0; text-transform: none; white-space: nowrap;
  }
  html body #so-header-mobile-announcement .currencydrop a:is(:hover,:focus) { background: #e5e0d7; }
  html body #so-header-mobile-announcement a:focus-visible { outline: 2px solid currentColor; outline-offset: -2px; }
}

@media (max-width: 760px) {
  /* Image first on home and category banners, without changing desktop ordering. */
  html body #so-home-2026 .soh-hero-image,
  html body #so-category-2026 .so-cat-hero__image { order: -1; }
  html body #so-home-2026 .soh-hero-copy,
  html body #so-category-2026 .so-cat-hero__text { order: 0; }

  html body #so-home-2026 .soh-benefit-reviews { display: none !important; }
  html body #so-home-2026 .soh-benefits { grid-template-columns: repeat(2,minmax(0,1fr)); }
  html body #so-home-2026 .soh-benefit:last-child { grid-column: auto; border-left: 1px solid #d5d1c9; }

  /* One centred title row, with its action row above at the right edge. */
  html body #so-home-2026 .soh-heading {
    display: flex; flex-direction: column; align-items: stretch;
    gap: 16px; margin-bottom: 24px;
  }
  html body #so-home-2026 .soh-heading > h2 {
    order: 1; width: 100%; margin: 0; text-align: center;
    font-size: clamp(30px,8vw,36px); text-wrap: balance;
  }
  html body #so-home-2026 .soh-heading > .soh-link,
  html body #so-home-2026 .soh-heading > .soh-actions,
  html body #so-home-2026 .soh-heading > .soh-award-controls {
    order: 0; align-self: flex-end; max-width: none; margin: 0;
    text-align: right; white-space: nowrap;
  }
  html body #so-home-2026 .soh-heading > .soh-actions { justify-content: flex-end; gap: 12px; }
  html body #so-home-2026 .soh-heading > .soh-link { font-size: 12px; }
  html body #so-home-2026 .soh-offer-controls { gap: 6px; }
  html body #so-home-2026 .soh-offer-controls button { width: 36px; height: 36px; background: #fff; }

  /* A smaller card and a visible next-card edge invite a native horizontal swipe. */
  html body #so-home-2026 .soh-offer-scroll { --soh-offer-width: min(280px,76vw); }
  html body #so-home-2026 .soh-offer-track,
  html body #so-home-2026 .soh-offer-group { gap: var(--soh-offer-gap,16px); }
  html body #so-home-2026 .soov-copy,
  html body #so-home-2026 .offer-content { min-height: 0; padding: 16px; }
  html body #so-home-2026 .soov-copy h2,
  html body #so-home-2026 .offer-content h3 { font-size: 25px; min-height: 0; margin-bottom: 12px; }
  html body #so-home-2026 .soov-copy p,
  html body #so-home-2026 .offer-content p { font-size: 13px; line-height: 1.45; margin-bottom: 14px; }
  html body #so-home-2026 .soov-kicker { margin-bottom: 10px; gap: 7px; }
  html body #so-home-2026 .soov-brand { font-size: 13px; }
  html body #so-home-2026 .soov-button { min-height: 40px; padding: 10px 16px; }

  /* Compact product flow. No empty fixed award/review rows on a phone.
     Override the category equaliser's inline min-heights on small screens. */
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product { min-height: 0 !important; }
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product .so-cat-product__main {
    min-height: 0 !important; display: flex; flex-direction: column;
  }
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product .so-cat-product__meta { min-height: 0 !important; margin-bottom: 10px; }
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product .so-cat-product__name {
    min-height: 0 !important; margin: 0 !important;
    font-size: 16px; line-height: 1.35;
  }
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product .so-cat-product__details {
    display: flex; flex-direction: column; gap: 6px;
    grid-template-rows: none; margin-top: auto; padding-top: 12px;
  }
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product__details > [data-so-award-label] {
    align-self: flex-start; font-size: 11px; line-height: 1.4;
  }
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product .so-cat-product__reviews {
    min-height: 0 !important; margin: 0 !important;
  }
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product__reviews:has(> .trustspot-inline-category:empty) { display: none; }
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product__reviews .ts-reviews-rating {
    display: flex !important; flex-direction: column; align-items: flex-start; gap: 2px;
    width: 100%; margin: 0 !important; padding: 0 !important;
  }
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product__reviews .stars-container {
    --star-size: 17 !important; font-size: 17px !important; flex: 0 0 auto;
    margin: 0 !important; float: none !important; line-height: 1.2 !important;
  }
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product__reviews .ts-reviews-rating-options {
    display: block !important; float: none !important; margin: 0 !important; padding: 0 !important;
    line-height: 1.3 !important; width: auto;
  }
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product__reviews .ts-reviews-count {
    display: block !important; margin: 0 !important; padding: 0 !important;
    font-size: 12px !important; line-height: 1.3 !important; white-space: nowrap;
  }
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product .so-cat-product__price {
    min-height: 0 !important; font-size: 17px; line-height: 1.35; margin: 2px 0 0 !important;
  }
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product .so-cat-product__actions {
    min-height: 0 !important; padding-top: 8px !important; padding-bottom: 20px !important;
  }
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product[data-has-variants="1"] .so-cat-product__actions {
    padding-top: 26px !important;
  }
  /* Keep the confirmation outside layout flow and retain the existing 46px control. */
  html body :is(#so-home-2026,#so-category-2026) .so-cat-product .so-cat-cart-status { font-size: 11px; }

  html body #so-home-2026 .soh-standard .soh-actions { display: grid; grid-template-columns: 1fr; gap: 12px; }
  html body #so-home-2026 .soh-standard .soh-actions .soh-button { width: 100%; padding-left: 12px; padding-right: 12px; }
  html body #so-home-2026 .soh-award-grid a { min-height: 200px; padding: 16px 10px; }
  html body #so-home-2026 .soh-award-grid .soh-logo { height: 70px; margin-bottom: 12px; }
  html body #so-home-2026 .soh-award-grid .soh-logo img { max-height: 70px; }
  html body #so-home-2026 .soh-award-grid strong { font-size: 15px; margin-bottom: 7px; }
  html body #so-home-2026 .soh-brand { padding: 14px 12px 18px; }
  html body #so-home-2026 .soh-brand-logo { height: 46px; margin-bottom: 12px; }
  html body #so-home-2026 .soh-brand-shop { margin-top: 14px; font-size: 12px; }

  html body #so-home-2026 .soh-review-summary { text-align: center; }
  html body #so-home-2026 .soh-review-summary h2 { text-align: center; margin: 0 auto 20px; }
  html body #so-home-2026 .soh-review-summary h2 > span { white-space: normal; }
  html body #so-home-2026 .soh-review-summary .soh-review-stars { margin-left: auto; margin-right: auto; }
  html body #so-home-2026 .soh-review-feed { padding: 0 28px; }
  html body #so-home-2026 .soh-review-feed > .soh-review-control { width: 28px !important; height: 44px !important; }
  html body #so-home-2026 .soh-reviews .trustspot-review-col { padding-left: 0 !important; padding-right: 0 !important; }
  html body #so-home-2026 .soh-reviews .product-review-wrapper.soh-review-card { min-height: 0 !important; padding: 18px !important; }
  html body #so-home-2026 .soh-reviews .soh-review-card .ts-review-title,
  html body #so-home-2026 .soh-reviews .soh-review-card .ts-review-title span { font-size: 24px !important; margin-bottom: 12px !important; }
  html body #so-home-2026 .soh-reviews .soh-review-card .trustspot-review-text { font-size: 17px !important; line-height: 1.4 !important; margin-bottom: 16px !important; }
  html body #so-home-2026 .soh-reviews .soh-review-footer { padding-top: 16px; }
  html body #so-home-2026 .soh-social .soh-heading { align-items: center; text-align: center; }
  html body #so-home-2026 .soh-social .soh-heading > div { width: 100%; }
  html body #so-home-2026 .soh-social .soh-heading h2 { text-align: center; }
  html body #so-home-2026 .soh-social .soh-heading > .soh-button { align-self: center; }
}