/* Water Hygiene Services: small additions to the original theme (static site) */

/* Skip link: shown when it receives keyboard focus */
.skip-link:not(:focus) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.skip-link:focus { position: fixed; top: 10px; left: 10px; z-index: 100000; padding: 10px 16px; background: #002e5b; color: #fff; font-weight: 600; text-decoration: none; outline: 2px solid #cc428f; }
main:focus { outline: none; }

/* Cookie notice: hidden once the visitor has accepted (see whs-consent.js) */
.whs-consented #stm_gdpr_popup-main { display: none !important; }

/* Homepage hero: static replacement for the Revolution Slider (same text, link and images).
   Sizes scale exactly as the slider did: by width/1170 on desktop, width/750 up to 768px. */
.whs-hero { --u: min(1px, calc(100vw / 1170)); position: relative; overflow: hidden; width: 100vw; margin-left: calc(50% - 50vw); height: calc(574 * var(--u)); background: #102a8c; }
.whs-hero__bg img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.whs-hero__inner { position: relative; width: calc(1170 * var(--u)); height: 100%; margin: 0 auto; }
.whs-hero__text { position: absolute; left: calc(32 * var(--u)); top: calc(113 * var(--u)); margin: 0; padding: 0; color: #fff; font-family: "Open Sans", sans-serif; font-weight: 600; font-size: calc(35 * var(--u)); line-height: calc(55 * var(--u)); white-space: nowrap; }
.whs-hl { color: #cc428f; }
.whs-br-m { display: none; }
.whs-hero__btn { position: absolute; left: calc(35 * var(--u)); top: calc(314 * var(--u)); display: block; padding: calc(13 * var(--u)) calc(30 * var(--u)); background: #dc3092; color: #fff; font-family: "Open Sans", sans-serif; font-size: calc(20 * var(--u)); line-height: calc(25 * var(--u)); white-space: nowrap; text-decoration: none; transition: background-color .3s; }
.whs-hero__btn:hover, .whs-hero__btn:focus { background: #000; color: #fff; text-decoration: none; }
@media only screen and (max-width: 768px) {
  .whs-hero { --u: calc(100vw / 750); height: calc(700 * var(--u)); }
  .whs-hero__inner { width: 100%; }
  .whs-hero__text { left: calc(36 * var(--u)); top: calc(166 * var(--u)); line-height: calc(45 * var(--u)); }
  .whs-hl { color: inherit; }
  .whs-br-m { display: inline; }
  .whs-br-d { display: none; }
  .whs-hero__btn { left: calc(67 * var(--u)); top: calc(540 * var(--u)); font-size: calc(19 * var(--u)); font-weight: 600; }
}

/* Heading levels fixed (h6/h5/h4 to h2/h3, no skipped levels) without changing their look.
   Values are the computed styles of the original tags. */
.whs-hfix-service { font-size: 16px !important; font-weight: 700 !important; line-height: 20px !important; color: #fff !important; margin-bottom: 0 !important; padding-top: 0 !important; letter-spacing: -0.32px !important; vertical-align: middle !important; }
.whs-hfix-service::after { margin-top: 17px !important; }
.whs-hfix-name { font-size: 20px !important; line-height: 22px !important; color: #002e5b !important; margin-bottom: 6px !important; padding-top: 0 !important; letter-spacing: -0.8px !important; }
.whs-hfix-name::after { margin-top: 13px !important; }
.whs-hfix-news { font-size: 18px !important; line-height: 22px !important; color: #002e5b !important; margin-bottom: 20px !important; padding-top: 0 !important; letter-spacing: -0.72px !important; }
.whs-hfix-news::after { width: 47px !important; height: 5px !important; margin-top: 14px !important; }
.whs-hfix-footer { line-height: 28px !important; padding-top: 23px !important; letter-spacing: -0.8px !important; }
.whs-hfix-footer::after { margin-top: 13px !important; }

/* Homepage answer sections (key points, questions, steps, facts) */
.whs-content { max-width: 900px; margin: 0 auto 40px; padding: 0 15px; font-size: 16px; line-height: 26px; color: #555; }
.whs-content h2 { margin: 30px 0 10px; padding: 0; font-size: 24px; line-height: 32px; color: #002e5b; text-transform: none; letter-spacing: -0.5px; }
.whs-content h2::after { display: none; }
.whs-content p { margin: 0 0 12px; }
.whs-content ul, .whs-content ol { margin: 0 0 16px 20px; padding: 0; }
.whs-content li { margin-bottom: 6px; }
.whs-content a { color: #cc428f; }
.whs-keypoints { background: #f2f2f2; border-left: 5px solid #cc428f; padding: 10px 25px 5px; }
.whs-keypoints h2 { margin-top: 10px; }
.whs-quote { margin: 20px 0 0; padding: 15px 25px; border-left: 5px solid #002e5b; background: #f2f2f2; font-style: italic; }
.whs-quote footer { margin-top: 8px; font-style: normal; font-size: 14px; color: #002e5b; }