/* ST Workwear 2.1 — tidy frontend-only refinement layer.
   Gutenberg intentionally has NONE of these styles. */

/* Official ST palette taken directly from the brand guide.
   All orange accents inherit --accent from style.css. */
:root {
  --st-navy:#1B405F;
  --st-ocean:#367198;
  --st-powder:#659CB7;
  --navy:var(--st-navy);
  --blue:var(--st-ocean);
  --blue-light:var(--st-powder);
}

/* No colored backing plates on products, including related-product grids. */
body ul.products,
body .woocommerce ul.products,
body ul.products li.product,
body.woocommerce ul.products,
body.woocommerce ul.products li.product,
body.woocommerce ul.products li.product .st-product-card__main,
body.woocommerce ul.products li.product .st-product-card__details,
body.woocommerce ul.products li.product .st-product-card__media,
body.woocommerce ul.products li.product img,
body .woocommerce ul.products li.product img,
body .st-premium-shop .st-shop-results,
body .st-premium-shop .st-shop-results ul.products,
body .st-premium-shop .st-shop-results ul.products li.product.st-product-card,
body .st-premium-shop .st-shop-results ul.products li.product .st-product-card__media,
body .st-premium-product .related ul.products,
body .st-premium-product .related li.product,
body .st-premium-product .related li.product img {
  background:transparent!important;
  box-shadow:none!important;
}
body.woocommerce ul.products li.product .st-product-card__media:after{background:none!important}
body .st-premium-shop .st-product-card__details{background:transparent!important}

/* Hero scroll label and heading must use EXACTLY the same horizontal origin.
   Older versions mixed a full-width slide and a centered .container footer. */
.st-premium-hero{--st-hero-inline:clamp(120px,12.2vw,230px)}
body .st-premium-slide__inner.container,
body .st-premium-hero__foot.container{
  width:100%!important;max-width:none!important;
  margin-left:0!important;margin-right:0!important;
  padding-left:var(--st-hero-inline)!important;
  padding-right:clamp(24px,3vw,50px)!important;
  box-sizing:border-box;
}
body .st-premium-hero__scroll{padding-left:0!important;margin-left:0!important}
@media(max-width:1000px){.st-premium-hero{--st-hero-inline:clamp(38px,5vw,68px)}}
@media(max-width:700px){.st-premium-hero{--st-hero-inline:24px}}

/* Crisp header: no blurred glass, and no faded navigation labels on hover. */
body .site-header,
body .site-header:not(.is-scrolled),
body .site-header.is-scrolled{
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  filter:none!important;
}
body .site-header .st-menu-list>li>a,
body .site-header .st-menu-list>li>a:hover,
body .site-header .st-menu-list>li>a:focus-visible{
  opacity:1!important;filter:none!important;text-shadow:none!important;
}
body .site-header .st-menu-list>li>a::after{
  content:"";position:absolute;left:0;right:100%;bottom:11px;height:2px;
  background:var(--accent);transition:right .35s cubic-bezier(.22,1,.36,1);
}
body .site-header .st-menu-list>li>a:hover::after,
body .site-header .st-menu-list>li>a:focus-visible::after{right:0}
body .st-premium-front .site-header:not(.is-scrolled) .st-menu-list>li>a:hover{color:#fff!important}

/* Default kicker text + dash use orange. But on any white-on-dark or photo section,
   BOTH are white so they keep the same contrast as its text. */
body .st-premium-home p.st-gb-kicker.wp-block-paragraph,
body .st-editorial-page p.st-gb-kicker.wp-block-paragraph{color:var(--accent)!important}
body .st-premium-home p.st-gb-kicker.wp-block-paragraph:before,
body .st-editorial-page p.st-gb-kicker.wp-block-paragraph:before{background:currentColor!important}
body :is(.st-premium-home,.st-editorial-page) :is(.st-gb-banner,.st-gb-photo,.st-gb-contact,.st-gb-editorial-copy,.st-gb-inner-hero,.wp-block-cover:not(.is-light),.has-white-color,.has-light-color) p.st-gb-kicker.wp-block-paragraph,
body .st-editorial-page .has-white-color p.st-gb-kicker.wp-block-paragraph,
body .st-premium-home .has-white-color p.st-gb-kicker.wp-block-paragraph,
body .st-premium-home .st-gb-banner p.st-gb-kicker,
body .st-premium-home .st-gb-photo p.st-gb-kicker {
  color:#fff!important;
}
body :is(.st-premium-home,.st-editorial-page) :is(.st-gb-banner,.st-gb-photo,.st-gb-contact,.st-gb-editorial-copy,.st-gb-inner-hero,.wp-block-cover:not(.is-light),.has-white-color,.has-light-color) p.st-gb-kicker.wp-block-paragraph:before,
body .st-premium-home .st-gb-banner p.st-gb-kicker:before,
body .st-premium-home .st-gb-photo p.st-gb-kicker:before{background:#fff!important}

/* One shared editorial-link component is defined in design-system.css. */
/* Movement with NO dependency on JS for visibility or access. */
@media(prefers-reduced-motion:no-preference){
  .st-premium-home .st-gb-intro .wp-block-column:hover h2{letter-spacing:-.042em;transition:letter-spacing .6s cubic-bezier(.22,1,.36,1)}
  .st-premium-home .st-gb-banner .wp-block-cover__image-background,
  .st-premium-home .st-gb-photo .wp-block-cover__image-background{
    transition:transform 1.15s cubic-bezier(.22,1,.36,1);
  }
  .st-premium-home .st-gb-banner:hover .wp-block-cover__image-background,
  .st-premium-home .st-gb-photo:hover .wp-block-cover__image-background{transform:scale(1.055)}
  .st-premium-home .st-shop-preview__tile:hover .st-shop-preview__image img{transform:scale(1.075)!important}
  .st-premium-home .st-gb-value{transition:transform .55s cubic-bezier(.22,1,.36,1),border-color .4s!important}
  .st-premium-home .st-gb-value:hover{transform:translateY(-7px)}
  .st-v21-reveal.st-v21-visible{animation:st-v21-enter .78s both cubic-bezier(.22,1,.36,1)}
  @keyframes st-v21-enter{from{opacity:.82;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
}
@media(prefers-reduced-motion:reduce){
  .st-premium-home .st-gb-value,.st-premium-home .st-gb-intro .wp-block-button__link::after,
  .site-header .st-menu-list>li>a::after{transition:none!important;animation:none!important}
}

/* Ninja Forms: keep the ACTUAL plugin form and its own validation/processing.
   Never use or add a competing theme form. */
body.page .nf-form-cont{max-width:min(100%,860px);margin:0 auto clamp(45px,7vw,110px);padding:clamp(24px,4vw,58px);background:#fff;border-top:3px solid var(--accent);box-shadow:0 20px 65px rgba(27,64,95,.08);border-radius:4px;color:var(--navy)}
body.page .nf-form-cont .nf-form-title h3{font:500 clamp(27px,3vw,42px)/1.2 var(--serif);color:var(--navy);margin:0 0 18px}
body.page .nf-form-cont .nf-form-fields-required{font-size:12px;color:#657784;margin:0 0 25px}
body.page .nf-form-cont .nf-field-container{margin-bottom:24px}
body.page .nf-form-cont .nf-field-label label,
body.page .nf-form-cont .nf-field-label{font:600 12px/1.5 var(--sans);color:var(--navy)}
body.page .nf-form-cont .nf-field-label{margin-bottom:9px}
body.page .nf-form-cont .nf-field-element :is(input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),textarea,select){
  box-sizing:border-box;width:100%;max-width:100%;min-height:52px;
  background:var(--offwhite)!important;border:1px solid #c9d5dd!important;
  color:var(--navy)!important;border-radius:2px!important;
  padding:13px 16px!important;font:400 15px/1.55 var(--sans)!important;
  box-shadow:none!important;transition:border-color .22s ease,background-color .22s ease!important;
}
body.page .nf-form-cont .nf-field-element textarea{min-height:160px!important;resize:vertical}
body.page .nf-form-cont .nf-field-element :is(input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),textarea,select):focus{background:#fff!important;border-color:var(--blue)!important;outline:2px solid var(--blue-light)!important;outline-offset:1px!important;box-shadow:none!important}
body.page .nf-form-cont .nf-field-element :is(input,textarea)::placeholder{color:#748b98;opacity:1}
body.page .nf-form-cont .nf-error-msg,
body.page .nf-form-cont .nf-error .nf-error-msg{font:500 12px/1.6 var(--sans)!important;color:#a13c2a!important}
body.page .nf-form-cont .nf-error .nf-field-element :is(input,textarea,select){border-color:#a13c2a!important}
body.page .nf-form-cont .nf-pass .nf-field-element:after{color:var(--blue)!important}
body.page .nf-form-cont input[type=checkbox],body.page .nf-form-cont input[type=radio]{accent-color:var(--accent)}
body.page .nf-form-cont .nf-form-content .submit-wrap :is(input.nf-element,button.nf-element),
body.page .nf-form-cont .nf-form-content :is(input[type=submit],button[type=submit]){
  display:inline-flex;align-items:center;justify-content:center;min-height:54px;
  background:var(--accent)!important;border:1px solid var(--accent)!important;
  color:#fff!important;border-radius:2px!important;padding:13px 32px!important;
  font:600 13px/1.4 var(--sans)!important;letter-spacing:.02em;
  cursor:pointer;box-shadow:none!important;transition:transform .25s ease,filter .25s ease!important;
}
body.page .nf-form-cont .nf-form-content .submit-wrap :is(input.nf-element,button.nf-element):hover,
body.page .nf-form-cont .nf-form-content :is(input[type=submit],button[type=submit]):hover{background:var(--accent)!important;filter:brightness(.9);transform:translateY(-2px)}
body.page .nf-form-cont .nf-response-msg{padding:20px;background:var(--offwhite);border-left:3px solid var(--accent);color:var(--navy)}
@media(max-width:700px){body.page .nf-form-cont{padding:24px 20px;margin-bottom:65px}}