/* theme-level additions (not in original build) */
[data-wr-menu][hidden]{display:none!important}
.wr-lang a{line-height:1}
video{object-fit:cover}
.wr-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* QA 2026-11-04 */
@media (min-width:1024px){.lg\:mb-4{margin-bottom:1rem}}
:lang(es) .text-\[50px\].whitespace-nowrap{white-space:normal}
.text-\[\#027EEA\]{color:#027eea}

/* WateRecoup – text-over-image fixes (2026-11-04). Scoped to ES (html[lang^="es"]) so EN stays 1:1 with the original site. */

/* 1. Home "Grandes pérdidas de agua / ¡una enorme oportunidad!" (#every-drop-counts).
   The heading column is max-w-[450px]. EN fits in 2 lines; ES wraps to 4 lines and runs onto the glass photo
   (absolute img, lg:top-16). Widen the column on desktop so ES also sets in 2 lines, the same height as EN.
   No collision is possible: the heading sits above the 58/42 grid, and the glass starts below 2 lines. */
@media (min-width: 1024px) {
  html[lang^="es"] #every-drop-counts .max-w-\[450px\] { max-width: 680px; }
}

/* 2. Home stats "Más de 1 millón" (lg: 4 columns of 182px, 50px font). It now wraps to 3 lines: "Más de / 1 / millón".
   Keep the 50px size, but avoid the lone "1". Balanced wrapping gives "Más de / 1 millón" only if it fits,
   so step the size down slightly for ES on lg screens. */
@media (min-width: 1024px) {
  html[lang^="es"] .text-\[50px\].whitespace-nowrap { white-space: normal; text-wrap: balance; font-size: 44px; }
}

/* 3. Home hero H1 on mobile: "abastecimiento" (48px) is wider than a 328px column at 360px and is clipped at the right edge.
   Use a fluid size only below lg. EN does not reach this size, so it is unchanged at 390 and 360. */
@media (max-width: 1023px) {
  html[lang^="es"] h1.text-5xl { font-size: clamp(2.25rem, 11vw, 3rem); overflow-wrap: anywhere; hyphens: auto; }
}

/* ===== Language switcher — variant B "Droplet Ripple" (Dana) ===== */
/* Desktop: absolutely positioned left of the CTA, so it takes no flow width and nav x-positions match the original. */
.wr-ls-slot{position:absolute;right:100%;top:50%;margin-top:-20px;margin-right:16px;width:96px;height:40px}
@media (min-width:1280px){.wr-ls-slot{margin-right:24px}}
.wr-ls{--ls-fg:rgba(255,255,255,.85);--ls-drop:#e3f3ff;--ls-ink:#04284d;--ls-rip:#7cc8ff;--ls-x:52px;position:relative;width:96px;height:40px;display:flex;align-items:center;justify-content:space-between;font:600 14px/1 Montserrat,sans-serif;letter-spacing:.06em}
[data-wr-header][data-light="1"] .wr-ls-slot .wr-ls{--ls-fg:#002951;--ls-drop:#0157AA;--ls-ink:#fff;--ls-rip:#0157AA}
.wr-ls a{position:relative;z-index:2;width:44px;height:40px;display:grid;place-items:center;padding-top:6px;border-radius:20px;color:var(--ls-fg);text-decoration:none;transition:opacity .15s,color .3s}
.wr-ls a:not([aria-current]):hover{opacity:.7}
.wr-ls a[aria-current]{color:var(--ls-ink)}
.wr-ls a:focus-visible{outline:2px solid var(--ls-rip);outline-offset:2px}
.wr-ls__drop{position:absolute;z-index:1;top:-2px;left:2px;width:40px;height:44px;transition:transform .55s cubic-bezier(.5,0,.2,1);pointer-events:none}
.wr-ls__drop svg{width:100%;height:100%;display:block;transform-origin:50% 100%}
.wr-ls__drop path{fill:var(--ls-drop)}.wr-ls__drop ellipse{fill:#fff}
[data-wr-header][data-light="1"] .wr-ls-slot .wr-ls__drop ellipse{opacity:.35}
.wr-ls[data-l=es] .wr-ls__drop{transform:translateX(var(--ls-x))}
.wr-ls.go .wr-ls__drop svg{animation:wr-squash .55s ease}
@keyframes wr-squash{0%{transform:scale(1)}35%{transform:translateY(-6px) scale(.8,1.15)}70%{transform:scale(1.18,.82)}100%{transform:scale(1)}}
.wr-ls__rip{position:absolute;left:0;top:50%;width:44px;height:44px;margin-top:-22px;border-radius:50%;border:1.5px solid var(--ls-rip);opacity:0;pointer-events:none}
.wr-ls__rip.on{animation:wr-rip .9s ease-out .38s}.wr-ls__rip.on.wr-ls__rip--2{animation-delay:.52s}
@keyframes wr-rip{0%{opacity:.9;transform:scale(.5)}100%{opacity:0;transform:scale(1.9)}}
/* Mobile menu: larger targets, matches text-2xl menu rhythm */
.wr-ls--m{--ls-x:68px;width:120px;height:48px;font-size:18px}
.wr-ls--m a{width:52px;height:48px}
.wr-ls--m .wr-ls__drop{width:48px;height:52px;top:-3px;left:2px}
.wr-ls--m .wr-ls__rip{width:52px;height:52px;margin-top:-26px}
@media (prefers-reduced-motion:reduce){.wr-ls *{animation:none!important;transition-duration:.01s!important;transition-delay:0s!important}}
/* lg..xl (1024–1279): the gap between nav and CTA is only ~96px, so the switcher is scaled down to stay clear of the nav. */
@media (min-width:1024px) and (max-width:1279.98px){.wr-ls-slot{margin-right:6px;transform:scale(.82);transform-origin:100% 50%}}