mp-design-system 1.2.62 → 1.2.63

package/dist/build/js/app.js

@@ -1,2 +1,22 @@
-(()=>{function e(e){e.addEventListener("click",(e=>{e.currentTarget.parentElement.classList.toggle("c-accordion__item--open")}))}var t=function(){Array.from(document.querySelectorAll(".c-accordion__title")).forEach(e)};var o=function(){let e=0;const t=document.querySelectorAll(".c-hero__image-bg"),o=document.querySelectorAll(".c-hero__image-fg");o.length>0&&setInterval((()=>{for(var n of t)n.style.opacity=0;for(var c of(e=e!=t.length-1?e+1:0,t[e].style.opacity=1,o))c.style.opacity=0;o[e].style.opacity=1}),5e3)};var n=function(){const e=document.getElementById("clearForm");e&&e.addEventListener("click",(function(){this.closest("form").elements.forEach((e=>{if(""!=e.value){if("text"==e.type.toLowerCase()||"email"==e.type.toLowerCase()||"tel"==e.type.toLowerCase()||"select-one"==e.type.toLowerCase()||"textarea"==e.type.toLowerCase())return void(e.value="");if("checkbox"==e.type.toLowerCase())return void(e.checked=!1)}}))}))};function c(e){const t=e.parentNode.parentNode,o=t.querySelector(".c-comparison-table tbody"),n=t.querySelector(".c-comparison-table thead"),c=t.parentElement.querySelector(".c-comparison-table__mobile");if(!o||!n||!c)return;const r=Array.from(n.children[0].children).filter(((e,t)=>t)).map((e=>({info:e.innerHTML}))),a=Array.from(n.children[1].children).filter(((e,t)=>t)).map((e=>({buttons:e.innerHTML}))),i=r.map(((e,t)=>({...e,...a[t],table:[]})));Array.from(o.children).forEach((e=>{if(e.classList.contains("c-comparison-table__title"))i.forEach((t=>{t.table.push({type:"title",title:e.children[0].textContent})}));else{const t=Array.from(e.children),o=t.shift();t.forEach(((e,t)=>{i[t].table.push({type:"row",key:o.textContent,value:e.innerHTML})}))}})),i.forEach((e=>{const t=function(e){const t=document.createElement("article");return t.innerHTML=`${e.info}${e.buttons}\n  <table class="c-comparison-table">\n    ${e.table.map((e=>"title"===e.type?`<tr class="c-comparison-table__title"><th><span>${e.title}</span></th><th></th></tr>`:`<tr>\n          <td>${e.key}</td>\n          <td>${e.value}</td>\n        </tr>`)).join("")}\n  </table>`,t}(e);c.appendChild(t)}))}var r=function(){document.querySelectorAll(".c-comparison-table").forEach(c)};function a(e){e.addEventListener("click",(e=>{e.preventDefault();var t=e.currentTarget,o=t.parentElement;o.classList.toggle("c-facet--open");const n=o.classList.contains("c-facet--open")?"true":"false";t.setAttribute("aria-expanded",n)}))}var i=function(){Array.from(document.querySelectorAll(".c-facet__toggle")).forEach(a)};var s=function(){const e=document.querySelectorAll(".c-gallery__main .c-gallery__slide"),t=document.querySelectorAll(".c-gallery__thumbnails .c-gallery__slide");function o(){const e=document.querySelector(".c-gallery__main").cloneNode(!0);e.classList.remove("c-gallery__main"),e.classList.add("c-lightbox"),e.querySelectorAll(".c-gallery__slide").forEach((function(e){if(e.classList.contains("c-gallery__video")&&e.remove(),!e.classList.contains("c-gallery__video")){var t=e.querySelector("img");""!=t.srcset&&t.removeAttribute("srcset");var o=t.getAttribute("src");o?-1!==o.indexOf("?")?t.setAttribute("src",o.split("?")[0]+"?quality=90&width=2176"):t.setAttribute("src",o+"?quality=90&width=2176"):(console.log(t),console.log("has no src defined..."))}e.classList.add("c-lightbox__slide"),e.classList.remove("c-gallery__slide")})),document.body.appendChild(e),e.insertAdjacentHTML("beforeend",'<a class="c-lightbox__prev"></a><a class="c-lightbox__next"></a>'),e.querySelector(".c-lightbox__prev").addEventListener("click",(function(){const t=e.querySelector(".active"),o=e.querySelector('[data-slide="'+(parseInt(t.dataset.slide)-1)+'"]');null!=o&&(t.classList.remove("active"),o.classList.add("active"))})),e.querySelector(".c-lightbox__next").addEventListener("click",(function(){const t=e.querySelector(".active"),o=e.querySelector('[data-slide="'+(parseInt(t.dataset.slide)+1)+'"]');null!=o&&(t.classList.remove("active"),o.classList.add("active"))})),e.addEventListener("click",(function(t){t.target===t.currentTarget&&e.remove()}))}t.forEach((o=>o.addEventListener("click",(function(n){t.forEach((function(e){e!=n.target.parentNode&&e.classList.remove("active")})),n.target.parentNode.classList.add("active"),e.forEach((function(e){e.dataset.slide==o.dataset.slide?e.classList.add("active"):e.classList.remove("active")}))})))),e.forEach((function(e){e.classList.contains("c-gallery__video")||e.addEventListener("click",o)}))};const l=(e,t,o)=>((e,t=0,o=1)=>Math.min(o,Math.max(t,e)))((o-e)/(t-e));var d=function(){let e=0;const t=document.querySelector(".c-hero__canvas");if(!t)return;const o=t.getContext("2d"),n=!window.matchMedia("(prefers-reduced-motion: no-preference)").matches,c=147,r=.25;let a,i,s,d,u,f=[];function h(){a=t.scrollWidth,i=t.scrollHeight,o.canvas.width=a,o.canvas.height=i,s=Math.ceil(a/c),d=Math.ceil(i/c),u=(s+1)*(d+1);const e=function(e){const t=[...e];for(let e=t.length-1;e>0;e--){let o=Math.floor(Math.random()*(e+1));[t[e],t[o]]=[t[o],t[e]]}return t}(Array.from({length:u},((e,t)=>t)));f=[];for(let t=0;t<=s;t++)for(let o=0;o<=d;o++)f.push({counter:e.shift(),direction:Math.random()>.5?r:-.25,x:c*(t+1)-147,y:c*(o+1)-73.5})}window.addEventListener("resize",h),h(),function c(){e+=.005,o.clearRect(0,0,t.width,t.height),o.beginPath();for(let n=t.width;n>0;n--)o.lineTo(n,.5*t.height-Math.cos(e+n/5*.03)*(.3*i));o.lineWidth=.5,o.strokeStyle="rgb(19,170,19)",o.stroke(),f.forEach((e=>{var t,n,c,a,i,s,d,u;t=e.x,n=e.y,a=0,i=f.length,s=0,d=.5,u=e.counter,c=((e,t,o)=>e*(1-o)+t*o)(s,d,l(a,i,u)),o.beginPath(),o.moveTo(t-14,n),o.lineTo(t+14,n),o.strokeStyle=`rgba(255, 255, 255, ${c}`,o.moveTo(t,n-14),o.lineTo(t,n+14),o.stroke(),e.counter+=e.direction,e.counter>=f.length&&(e.direction=-.25),e.counter<0&&(e.direction=r)})),n||window.requestAnimationFrame(c)}()};var u=function(){document.addEventListener("DOMContentLoaded",(()=>{const e=document.getElementById("videoBackground");if(void 0!==e&&null!=e){const o=window.matchMedia("(prefers-reduced-motion: reduce)");o&&!o.matches||e.pause();const n=document.getElementById("playVideo"),c=document.getElementById("lightboxVideo"),r=c.querySelector(".c-lightbox__video");function t(){c.classList.contains("u-hidden")?(e.paused&&e.play(),r.paused||r.pause()):e.paused||e.pause()}n.addEventListener("click",(o=>{e.pause(),c.classList.remove("u-hidden"),t()})),c.addEventListener("click",(o=>{o.target.classList.contains("c-lightbox__video")||(e.setAttribute("autoplay",""),c.classList.add("u-hidden"),t())})),window.addEventListener("keydown",(function(o){"Escape"==o.key&&(e.setAttribute("autoplay",""),c.classList.add("u-hidden"),t())}))}}))};function f(e){e.preventDefault();const t=e.currentTarget,o=t.getAttribute("aria-controls"),n=document.getElementById(o);n.classList.contains("c-hotspot-image__tooltip--open")?h(t,n):function(e,t){t.classList.add("c-hotspot-image__tooltip--open"),t.setAttribute("aria-hidden","false"),e.setAttribute("aria-expanded","true"),document.addEventListener("click",m)}(t,n)}function h(e,t){t.classList.remove("c-hotspot-image__tooltip--open"),t.setAttribute("aria-hidden","true"),e.setAttribute("aria-expanded","false"),document.removeEventListener("click",m)}function v(e){if("Escape"===e.key){const e=document.querySelector(".c-hotspot-image__tooltip--open");if(e){h(document.querySelector(`[aria-controls="${e.id}"]`),e)}}}function m(e){const t=document.querySelector(".c-hotspot-image__tooltip--open");if(t&&!t.contains(e.target)&&!e.target.closest(".c-hotspot-image__button")){h(document.querySelector(`[aria-controls="${t.id}"]`),t)}}var y=function(){setTimeout((function(){document.querySelectorAll(".c-hotspot-image__button").forEach((e=>{e.addEventListener("click",f)})),document.addEventListener("keydown",v),document.addEventListener("click",m)}),2e3)};var p=function(){const e=document.querySelector(".c-internal-nav--sticky");if(!e)return;new IntersectionObserver(((t,o)=>{const n=t[0].isIntersecting;e.classList.toggle("c-internal-nav--stuck",!n)}),{root:null,rootMargin:"0px",threshold:1}).observe(e);let t=e.offsetHeight;const o=()=>{t=e.offsetHeight;Array.from(e.querySelectorAll("a")).forEach((e=>{const o=e.getAttribute("href").replace("#",""),n=document.getElementById(o);n&&(n.style.scrollMarginTop=`${t}px`)}))};window.addEventListener("resize",o),o()};function g(e){const t=window.getComputedStyle(e);return"none"!==t.display&&"hidden"!==t.visibility}function b(e,t){const o=document.getElementById(e.getAttribute("data-target"));!0===t?function(e){e.classList.add("c-off-canvas"),e.setAttribute("tabindex","-1"),e.setAttribute("aria-hidden","true");const t=e.querySelector('[data-off-canvas="header"]'),o=e.querySelector('[data-off-canvas="main"]'),n=e.querySelector('[data-off-canvas="footer"]'),c=null!==t?t.outerHTML:"",r=null!==o?o.outerHTML:"",a=null!==n?n.outerHTML:"";e.innerHTML=`\n    <div class="c-off-canvas__backdrop" role="presentation"></div>\n    <div class="c-off-canvas__content" role="dialog" aria-modal="true" aria-labelledby="offCanvasHeader">\n      <header id="offCanvasHeader" class="c-off-canvas__header">${c}</header>\n      <main class="c-off-canvas__main">${r}</main>\n      <footer class="c-off-canvas__footer">\n        ${a}\n        <button class="mp c-twi c-twi--left c-off-canvas__close" data-off-canvas-close="true" onclick="return false">\n          <span>Cancel</span>\n          <svg role="img" aria-hidden="true" focusable="false" class="mp c-icon c-icon--cross">\n            <use xlink:href="/static/svg/sprite.svg#cross"></use>\n          </svg>\n        </button>\n      </footer>\n    </div>\n  `}(o):function(e){e.classList.remove("c-off-canvas","c-off-canvas--active"),e.removeAttribute("tabindex"),e.removeAttribute("aria-hidden");const t=e.querySelector(".c-off-canvas__backdrop");t&&t.remove();const o=e.querySelector(".c-off-canvas__content");if(o){for(;o.firstChild;)e.insertBefore(o.firstChild,o);e.removeChild(o)}const n=e.querySelector(".c-off-canvas__header");if(n){for(;n.firstChild;)e.insertBefore(n.firstChild,n);e.removeChild(n)}const c=e.querySelector(".c-off-canvas__main");if(c){for(;c.firstChild;)e.insertBefore(c.firstChild,c);e.removeChild(c)}const r=e.querySelector(".c-off-canvas__footer");if(r){for(;r.firstChild;)e.insertBefore(r.firstChild,r);e.removeChild(r)}const a=e.querySelector(".c-off-canvas__close");a&&a.remove()}(o)}function _(e){document.querySelector('[data-target="'+e.id+'"').setAttribute("aria-expanded","false"),e.classList.remove("c-off-canvas--active"),e.setAttribute("aria-hidden","true"),document.body.style.overflowY=""}function L(){_(this.closest(".c-off-canvas"))}function E(e){if("Escape"===e.key){const e=document.querySelector(".c-off-canvas--active");e&&_(e)}}function A(){_(this.closest(".c-off-canvas"))}var S=function(){const e=document.querySelectorAll(".c-off-canvas__toggle");e.length&&(e.forEach((e=>{b(e,g(e)),e.addEventListener("click",(()=>function(e){const t=document.getElementById(e.getAttribute("data-target"));t.classList.contains("c-off-canvas--active")?t.classList.contains("c-off-canvas--active")&&_(t):function(e,t){e.setAttribute("aria-expanded","true"),t.classList.add("c-off-canvas--active"),t.setAttribute("aria-hidden","false");const o=t.querySelector(".c-off-canvas__backdrop");o&&o.addEventListener("click",L);const n=t.querySelectorAll('[data-off-canvas-close="true"]');n.length>0&&n.forEach((e=>{e.addEventListener("click",A)}));document.addEventListener("keydown",E,{once:!0}),document.body.style.overflowY="hidden";const c=Array.from(document.querySelectorAll(".c-off-canvas")).filter((e=>e!==t));c.length>0&&c.forEach((e=>{_(e)}))}(e,t)}(e)))})),window.addEventListener("resize",(()=>{e.forEach((e=>{b(e,g(e))}))})))};var q=()=>{Array.from(document.querySelectorAll(".c-table--responsive")).forEach((function(e){const t=e.querySelectorAll("thead > :first-child th"),o=Number(e.getAttribute("data-columns"))||2;if(t.length<o)return void e.classList.remove("c-table--responsive");Array.from(e.querySelectorAll("tbody tr")).forEach((e=>{Array.from(t).map((e=>e.textContent)).forEach(((t,o)=>{e.children[o]&&e.children[o].setAttribute("data-responsive-title",t)}))}))}))};function w(){document.documentElement.style.setProperty("--scrollbarWidth",window.innerWidth-document.body.clientWidth+"px")}var k=function(){w(),window.addEventListener("resize",((e,t)=>{let o=!1;return()=>{o||(e(),o=!0,setTimeout((()=>o=!1),t))}})(w,250))};var x=function(){const e=document.querySelector(".c-internal-nav--sticky"),t=e?e.offsetHeight:0;Array.from(document.querySelectorAll(".c-scroll-spy")).forEach((e=>{!function(e,t){const o=Array.from(e.querySelectorAll("a")),n=new IntersectionObserver(function(e){return t=>{const o=t.find((e=>e.isIntersecting));o&&e.forEach((e=>{e.classList.toggle("c-scroll-spy-active",e.getAttribute("href")==="#"+o.target.id)}))}}(o));o.forEach((e=>{const t=e.getAttribute("href").replace("#",""),o=document.getElementById(t);o&&n.observe(o)}));const c=parseFloat(window.getComputedStyle(e).top);e.style.top=`${c+t}px`}(e,t)}))};function C(e){const t=Array.from(e.querySelectorAll(".c-tabs__control")),o=Array.from(e.querySelectorAll(".c-tab")),n=e.classList.contains("c-tabs--persist");if(t.length&&o.length&&(t.forEach((e=>{e.addEventListener("click",function(e,t,o){return n=>{const c=n.currentTarget,r=t.find((e=>e.id===c.getAttribute("href").replace("#","")));if(!r)return!0;n.preventDefault(),o&&history.pushState(null,null,c.getAttribute("href")),e.forEach((e=>e.classList.toggle("c-tabs__control--active",e===c))),t.forEach((e=>{const t=e===r;if(e.classList.toggle("c-tab--active",t),!o)if(t){e.setAttribute("tabIndex",-1);const t=window.scrollY;e.focus(),window.scrollTo({behavior:"auto",top:t})}else e.removeAttribute("tabIndex")}))}}(t,o,n))})),n&&window.location.hash)){const t=e.querySelector('[href="'+window.location.hash+'"]');t&&t.dispatchEvent(new Event("click"))}}var T=function(){Array.from(document.querySelectorAll(".c-tabs--anchor")).forEach(C)};window.NodeList&&!NodeList.prototype.forEach&&(NodeList.prototype.forEach=Array.prototype.forEach),window.HTMLCollection&&!HTMLCollection.prototype.forEach&&(HTMLCollection.prototype.forEach=Array.prototype.forEach),t(),o(),n(),r(),i(),s(),d(),u(),y(),p(),S(),q(),k(),x(),T()})();
-//# sourceMappingURL=app.js.map
+function q(){Array.from(document.querySelectorAll(".c-accordion__title")).forEach(k)}function k(e){e.addEventListener("click",x())}function x(){return e=>{var t=e.currentTarget.parentElement;t.classList.toggle("c-accordion__item--open")}}function T(){let e=0;const t=document.querySelectorAll(".c-hero__image-bg"),o=document.querySelectorAll(".c-hero__image-fg");o.length>0&&setInterval(()=>{for(var n of t)n.style.opacity=0;e=e!=t.length-1?e+1:0,t[e].style.opacity=1;for(var c of o)c.style.opacity=0;o[e].style.opacity=1},5e3)}function M(){const e=document.getElementById("clearForm");e&&e.addEventListener("click",function(){this.closest("form").elements.forEach(o=>{if(o.value!=""){if(o.type.toLowerCase()=="text"||o.type.toLowerCase()=="email"||o.type.toLowerCase()=="tel"||o.type.toLowerCase()=="select-one"||o.type.toLowerCase()=="textarea"){o.value="";return}else if(o.type.toLowerCase()=="checkbox"){o.checked=!1;return}}})})}function H(){document.querySelectorAll(".c-comparison-table").forEach(B)}function B(e){const t=e.parentNode.parentNode,o=t.querySelector(".c-comparison-table tbody"),n=t.querySelector(".c-comparison-table thead"),c=t.parentElement.querySelector(".c-comparison-table__mobile");if(!o||!n||!c)return;const r=Array.from(n.children[0].children).filter((i,d)=>d).map(i=>({info:i.innerHTML})),a=Array.from(n.children[1].children).filter((i,d)=>d).map(i=>({buttons:i.innerHTML})),s=r.map((i,d)=>({...i,...a[d],table:[]}));Array.from(o.children).forEach(i=>{if(i.classList.contains("c-comparison-table__title"))s.forEach(d=>{d.table.push({type:"title",title:i.children[0].textContent})});else{const d=Array.from(i.children),h=d.shift();d.forEach((v,p)=>{s[p].table.push({type:"row",key:h.textContent,value:v.innerHTML})})}}),s.forEach(i=>{const d=I(i);c.appendChild(d)})}function I(e){const t=document.createElement("article");return t.innerHTML=`${e.info}${e.buttons}
+  <table class="c-comparison-table">
+    ${e.table.map(o=>o.type==="title"?`<tr class="c-comparison-table__title"><th><span>${o.title}</span></th><th></th></tr>`:`<tr>
+          <td>${o.key}</td>
+          <td>${o.value}</td>
+        </tr>`).join("")}
+  </table>`,t}function O(){Array.from(document.querySelectorAll(".c-facet__toggle")).forEach($)}function $(e){e.addEventListener("click",N())}function N(){return e=>{e.preventDefault();var t=e.currentTarget,o=t.parentElement;o.classList.toggle("c-facet--open");const n=o.classList.contains("c-facet--open")?"true":"false";t.setAttribute("aria-expanded",n)}}function F(){const e=document.querySelectorAll(".c-gallery__main .c-gallery__slide"),t=document.querySelectorAll(".c-gallery__thumbnails .c-gallery__slide");t.forEach(n=>n.addEventListener("click",function(c){t.forEach(function(r){r!=c.target.parentNode&&r.classList.remove("active")}),c.target.parentNode.classList.add("active"),e.forEach(function(r){r.dataset.slide==n.dataset.slide?r.classList.add("active"):r.classList.remove("active")})})),e.forEach(function(n){n.classList.contains("c-gallery__video")||n.addEventListener("click",o)});function o(){const n=document.querySelector(".c-gallery__main").cloneNode(!0);n.classList.remove("c-gallery__main"),n.classList.add("c-lightbox"),n.querySelectorAll(".c-gallery__slide").forEach(function(c){if(c.classList.contains("c-gallery__video")&&c.remove(),!c.classList.contains("c-gallery__video")){var r=c.querySelector("img");r.srcset!=""&&r.removeAttribute("srcset");var a=r.getAttribute("src");a?a.indexOf("?")!==-1?r.setAttribute("src",a.split("?")[0]+"?quality=90&width=2176"):r.setAttribute("src",a+"?quality=90&width=2176"):(console.log(r),console.log("has no src defined..."))}c.classList.add("c-lightbox__slide"),c.classList.remove("c-gallery__slide")}),document.body.appendChild(n),n.insertAdjacentHTML("beforeend",'<a class="c-lightbox__prev"></a><a class="c-lightbox__next"></a>'),n.querySelector(".c-lightbox__prev").addEventListener("click",function(){const c=n.querySelector(".active"),r=n.querySelector('[data-slide="'+(parseInt(c.dataset.slide)-1)+'"]');r!=null&&(c.classList.remove("active"),r.classList.add("active"))}),n.querySelector(".c-lightbox__next").addEventListener("click",function(){const c=n.querySelector(".active"),r=n.querySelector('[data-slide="'+(parseInt(c.dataset.slide)+1)+'"]');r!=null&&(c.classList.remove("active"),r.classList.add("active"))}),n.addEventListener("click",function(c){c.target===c.currentTarget&&n.remove()})}}function P(e){const t=[...e];for(let o=t.length-1;o>0;o--){let n=Math.floor(Math.random()*(o+1));[t[o],t[n]]=[t[n],t[o]]}return t}function R(){const e="(prefers-reduced-motion: no-preference)";return!window.matchMedia(e).matches}const W=(e,t)=>{let o=!1;return()=>{o||(e(),o=!0,setTimeout(()=>o=!1,t))}},D=(e,t,o)=>e*(1-o)+t*o,z=(e,t=0,o=1)=>Math.min(o,Math.max(t,e)),V=(e,t,o)=>z((o-e)/(t-e)),Y=(e,t,o,n,c)=>D(o,n,V(e,t,c));function j(){let e=0;const t=document.querySelector(".c-hero__canvas");if(!t)return;const o=t.getContext("2d"),n="rgb(19,170,19)",c=R(),r=147,a=0,s=.5,i=.25;let d,h,v,p,m=[],_;function L(){e=e+.005,o.clearRect(0,0,t.width,t.height),o.beginPath();for(let l=t.width;l>0;l--)o.lineTo(l,t.height*.5-Math.cos(e+l/5*.03)*(h*.3));o.lineWidth=.5,o.strokeStyle=n,o.stroke(),m.forEach(l=>{S(l.x,l.y,Y(0,m.length,a,s,l.counter)),l.counter+=l.direction,l.counter>=m.length&&(l.direction=-1*i),l.counter<0&&(l.direction=i)}),c||window.requestAnimationFrame(L)}function E(){d=t.scrollWidth,h=t.scrollHeight,o.canvas.width=d,o.canvas.height=h,v=Math.ceil(d/r),p=Math.ceil(h/r),_=(v+1)*(p+1);const l=P(Array.from({length:_},(f,u)=>u));m=[];for(let f=0;f<=v;f++)for(let u=0;u<=p;u++)m.push({counter:l.shift(),direction:Math.random()>.5?i:-1*i,x:r*(f+1)-r/1,y:r*(u+1)-r/2})}function S(l,f,u){o.beginPath(),o.moveTo(l-14,f),o.lineTo(l+14,f),o.strokeStyle=`rgba(255, 255, 255, ${u}`,o.moveTo(l,f-14),o.lineTo(l,f+14),o.stroke()}window.addEventListener("resize",E),E(),L()}function Q(){document.addEventListener("DOMContentLoaded",()=>{const e=document.getElementById("videoBackground");if(typeof e<"u"&&e!=null){let a=function(){c.classList.contains("u-hidden")?(e.paused&&e.play(),r.paused||r.pause()):e.paused||e.pause()};var t=a;const o=window.matchMedia("(prefers-reduced-motion: reduce)");(!o||o.matches)&&e.pause();const n=document.getElementById("playVideo"),c=document.getElementById("lightboxVideo"),r=c.querySelector(".c-lightbox__video");n.addEventListener("click",s=>{e.pause(),c.classList.remove("u-hidden"),a()}),c.addEventListener("click",s=>{s.target.classList.contains("c-lightbox__video")||(e.setAttribute("autoplay",""),c.classList.add("u-hidden"),a())}),window.addEventListener("keydown",function(s){s.key=="Escape"&&(e.setAttribute("autoplay",""),c.classList.add("u-hidden"),a())})}})}function G(){setTimeout(function(){document.querySelectorAll(".c-hotspot-image__button").forEach(t=>{t.addEventListener("click",K)}),document.addEventListener("keydown",J),document.addEventListener("click",g)},2e3)}function K(e){e.preventDefault();const t=e.currentTarget,o=t.getAttribute("aria-controls"),n=document.getElementById(o);n.classList.contains("c-hotspot-image__tooltip--open")?b(t,n):U(t,n)}function U(e,t){t.classList.add("c-hotspot-image__tooltip--open"),t.setAttribute("aria-hidden","false"),e.setAttribute("aria-expanded","true"),document.addEventListener("click",g)}function b(e,t){t.classList.remove("c-hotspot-image__tooltip--open"),t.setAttribute("aria-hidden","true"),e.setAttribute("aria-expanded","false"),document.removeEventListener("click",g)}function J(e){if(e.key==="Escape"){const t=document.querySelector(".c-hotspot-image__tooltip--open");if(t){const o=document.querySelector(`[aria-controls="${t.id}"]`);b(o,t)}}}function g(e){const t=document.querySelector(".c-hotspot-image__tooltip--open");if(t&&!t.contains(e.target)&&!e.target.closest(".c-hotspot-image__button")){const o=document.querySelector(`[aria-controls="${t.id}"]`);b(o,t)}}function X(){const e=document.querySelector(".c-internal-nav--sticky");if(!e)return;const t={root:null,rootMargin:"0px",threshold:1},o=(a,s)=>{const i=a[0].isIntersecting;e.classList.toggle("c-internal-nav--stuck",!i)};new IntersectionObserver(o,t).observe(e);let c=e.offsetHeight;const r=()=>{c=e.offsetHeight,Array.from(e.querySelectorAll("a")).forEach(s=>{const i=s.getAttribute("href").replace("#",""),d=document.getElementById(i);d&&(d.style.scrollMarginTop=`${c}px`)})};window.addEventListener("resize",r),r()}function Z(){const e=document.querySelectorAll(".c-off-canvas__toggle");e.length&&(e.forEach(t=>{C(t,A(t)),t.addEventListener("click",()=>oe(t))}),window.addEventListener("resize",()=>{e.forEach(t=>{C(t,A(t))})}))}function A(e){const t=window.getComputedStyle(e);return t.display!=="none"&&t.visibility!=="hidden"}function C(e,t){const o=document.getElementById(e.getAttribute("data-target"));t===!0?ee(o):te(o)}function ee(e){e.classList.add("c-off-canvas"),e.setAttribute("tabindex","-1"),e.setAttribute("aria-hidden","true");const t=e.querySelector('[data-off-canvas="header"]'),o=e.querySelector('[data-off-canvas="main"]'),n=e.querySelector('[data-off-canvas="footer"]'),c=t!==null?t.outerHTML:"",r=o!==null?o.outerHTML:"",a=n!==null?n.outerHTML:"";e.innerHTML=`
+    <div class="c-off-canvas__backdrop" role="presentation"></div>
+    <div class="c-off-canvas__content" role="dialog" aria-modal="true" aria-labelledby="offCanvasHeader">
+      <header id="offCanvasHeader" class="c-off-canvas__header">${c}</header>
+      <main class="c-off-canvas__main">${r}</main>
+      <footer class="c-off-canvas__footer">
+        ${a}
+        <button class="mp c-twi c-twi--left c-off-canvas__close" data-off-canvas-close="true" onclick="return false">
+          <span>Cancel</span>
+          <svg role="img" aria-hidden="true" focusable="false" class="mp c-icon c-icon--cross">
+            <use xlink:href="/static/svg/sprite.svg#cross"></use>
+          </svg>
+        </button>
+      </footer>
+    </div>
+  `}function te(e){e.classList.remove("c-off-canvas","c-off-canvas--active"),e.removeAttribute("tabindex"),e.removeAttribute("aria-hidden");const t=e.querySelector(".c-off-canvas__backdrop");t&&t.remove();const o=e.querySelector(".c-off-canvas__content");if(o){for(;o.firstChild;)e.insertBefore(o.firstChild,o);e.removeChild(o)}const n=e.querySelector(".c-off-canvas__header");if(n){for(;n.firstChild;)e.insertBefore(n.firstChild,n);e.removeChild(n)}const c=e.querySelector(".c-off-canvas__main");if(c){for(;c.firstChild;)e.insertBefore(c.firstChild,c);e.removeChild(c)}const r=e.querySelector(".c-off-canvas__footer");if(r){for(;r.firstChild;)e.insertBefore(r.firstChild,r);e.removeChild(r)}const a=e.querySelector(".c-off-canvas__close");a&&a.remove()}function oe(e){const t=document.getElementById(e.getAttribute("data-target"));t.classList.contains("c-off-canvas--active")?t.classList.contains("c-off-canvas--active")&&y(t):ne(e,t)}function ne(e,t){e.setAttribute("aria-expanded","true"),t.classList.add("c-off-canvas--active"),t.setAttribute("aria-hidden","false");const o=t.querySelector(".c-off-canvas__backdrop");o&&o.addEventListener("click",ce);const n=t.querySelectorAll('[data-off-canvas-close="true"]');n.length>0&&n.forEach(r=>{r.addEventListener("click",ae)}),document.addEventListener("keydown",re,{once:!0}),document.body.style.overflowY="hidden";const c=Array.from(document.querySelectorAll(".c-off-canvas")).filter(r=>r!==t);c.length>0&&c.forEach(r=>{y(r)})}function y(e){document.querySelector('[data-target="'+e.id+'"').setAttribute("aria-expanded","false"),e.classList.remove("c-off-canvas--active"),e.setAttribute("aria-hidden","true"),document.body.style.overflowY=""}function ce(){const e=this.closest(".c-off-canvas");y(e)}function re(e){if(e.key==="Escape"){const t=document.querySelector(".c-off-canvas--active");t&&y(t)}}function ae(){const e=this.closest(".c-off-canvas");y(e)}const ie=()=>{Array.from(document.querySelectorAll(".c-table--responsive")).forEach(t);function t(o){const n=o.querySelectorAll("thead > :first-child th"),c=Number(o.getAttribute("data-columns"))||2;if(n.length<c){o.classList.remove("c-table--responsive");return}Array.from(o.querySelectorAll("tbody tr")).forEach(r=>{Array.from(n).map(a=>a.textContent).forEach((a,s)=>{r.children[s]&&r.children[s].setAttribute("data-responsive-title",a)})})}};function se(){w(),window.addEventListener("resize",W(w,250))}function w(){document.documentElement.style.setProperty("--scrollbarWidth",window.innerWidth-document.body.clientWidth+"px")}function le(){const e=document.querySelector(".c-internal-nav--sticky"),t=e?e.offsetHeight:0;Array.from(document.querySelectorAll(".c-scroll-spy")).forEach(n=>{de(n,t)})}function de(e,t){const o=Array.from(e.querySelectorAll("a")),n=new IntersectionObserver(fe(o));o.forEach(r=>{const a=r.getAttribute("href").replace("#",""),s=document.getElementById(a);!s||n.observe(s)});const c=parseFloat(window.getComputedStyle(e).top);e.style.top=`${c+t}px`}function fe(e){return t=>{const o=t.find(n=>n.isIntersecting);o&&e.forEach(n=>{n.classList.toggle("c-scroll-spy-active",n.getAttribute("href")==="#"+o.target.id)})}}function ue(){Array.from(document.querySelectorAll(".c-tabs--anchor")).forEach(he)}function he(e){const t=Array.from(e.querySelectorAll(".c-tabs__control")),o=Array.from(e.querySelectorAll(".c-tab")),n=e.classList.contains("c-tabs--persist");if(!(!t.length||!o.length)&&(t.forEach(c=>{c.addEventListener("click",ve(t,o,n))}),n&&window.location.hash)){const c=e.querySelector('[href="'+window.location.hash+'"]');c&&c.dispatchEvent(new Event("click"))}}function ve(e,t,o){return n=>{const c=n.currentTarget,r=t.find(a=>a.id===c.getAttribute("href").replace("#",""));if(!r)return!0;n.preventDefault(),o&&history.pushState(null,null,c.getAttribute("href")),e.forEach(a=>a.classList.toggle("c-tabs__control--active",a===c)),t.forEach(a=>{const s=a===r;if(a.classList.toggle("c-tab--active",s),!o)if(s){a.setAttribute("tabIndex",-1);const i=window.scrollY;a.focus(),window.scrollTo({behavior:"auto",top:i})}else a.removeAttribute("tabIndex")})}}window.NodeList&&!NodeList.prototype.forEach&&(NodeList.prototype.forEach=Array.prototype.forEach),window.HTMLCollection&&!HTMLCollection.prototype.forEach&&(HTMLCollection.prototype.forEach=Array.prototype.forEach),q(),T(),M(),H(),O(),F(),j(),Q(),G(),X(),Z(),ie(),se(),le(),ue();

package/dist/build/scss/library.css

@@ -1,2 +1 @@
-@import "https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap";.u-breakout{left:50%;left:calc(50% + var(--scrollbarWidth)/2.0001);width:100vw;width:calc(100vw - var(--scrollbarWidth));padding-left:safe-space(0);padding-right:safe-space(0);position:relative;transform:translate(-50vw)}.u-cutoff{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--gutter)),calc(100% - var(--gutter))100%,0 100%)}.u-cutoff--top-right{clip-path:polygon(0 0,calc(100% - var(--gutter))0,100% var(--gutter),100% 100%,0 100%)}.u-cutoff--top-left{clip-path:polygon(0 var(--gutter),var(--gutter)0,100% 0,100% 100%,0 100%)}.u-cutoff--bottom-left{clip-path:polygon(0 0,100% 0,100% 100%,var(--gutter)100%,0 calc(100% - var(--gutter)))}.u-cutoff--m{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--space-m)),calc(100% - var(--space-m))100%,0 100%)}.u-cutoff--xl{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--space-xl)),calc(100% - var(--space-xl))100%,0 100%)}:root{--fluid-min-width:320;--fluid-max-width:1332;--fluid-screen:100vw;--fluid-bp:calc( (var(--fluid-screen) - var(--fluid-min-width)/16*1rem)/(var(--fluid-max-width) - var(--fluid-min-width)))}@media screen and (min-width:1332px){:root{--fluid-screen:calc(var(--fluid-max-width)*1px)}}:root{--f--2-min:12.64;--f--2-max:12.5;--step--2:calc( ((var(--f--2-min)/16)*1rem) + (var(--f--2-max) - var(--f--2-min))*var(--fluid-bp));--f--1-min:14.22;--f--1-max:15;--step--1:calc( ((var(--f--1-min)/16)*1rem) + (var(--f--1-max) - var(--f--1-min))*var(--fluid-bp));--f-0-min:16;--f-0-max:18;--step-0:calc( ((var(--f-0-min)/16)*1rem) + (var(--f-0-max) - var(--f-0-min))*var(--fluid-bp));--f-1-min:18;--f-1-max:21.6;--step-1:calc( ((var(--f-1-min)/16)*1rem) + (var(--f-1-max) - var(--f-1-min))*var(--fluid-bp));--f-2-min:20.25;--f-2-max:25.92;--step-2:calc( ((var(--f-2-min)/16)*1rem) + (var(--f-2-max) - var(--f-2-min))*var(--fluid-bp));--f-3-min:22.78;--f-3-max:31.1;--step-3:calc( ((var(--f-3-min)/16)*1rem) + (var(--f-3-max) - var(--f-3-min))*var(--fluid-bp));--f-4-min:25.63;--f-4-max:37.32;--step-4:calc( ((var(--f-4-min)/16)*1rem) + (var(--f-4-max) - var(--f-4-min))*var(--fluid-bp));--f-5-min:28.83;--f-5-max:44.79;--step-5:calc( ((var(--f-5-min)/16)*1rem) + (var(--f-5-max) - var(--f-5-min))*var(--fluid-bp));--f-6-min:32.44;--f-6-max:53.75;--step-6:calc( ((var(--f-6-min)/16)*1rem) + (var(--f-6-max) - var(--f-6-min))*var(--fluid-bp));--f-7-min:36.49;--f-7-max:64.5;--step-7:calc( ((var(--f-7-min)/16)*1rem) + (var(--f-7-max) - var(--f-7-min))*var(--fluid-bp));--f-8-min:41.05;--f-8-max:77.4;--step-8:calc( ((var(--f-8-min)/16)*1rem) + (var(--f-8-max) - var(--f-8-min))*var(--fluid-bp));--f-9-min:46.18;--f-9-max:92.88;--step-9:calc( ((var(--f-9-min)/16)*1rem) + (var(--f-9-max) - var(--f-9-min))*var(--fluid-bp));--f-10-min:51.96;--f-10-max:111.45;--step-10:calc( ((var(--f-10-min)/16)*1rem) + (var(--f-10-max) - var(--f-10-min))*var(--fluid-bp))}@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:../fonts/inter-regular.woff2 format("woff2"),../fonts/inter-regular.woff format("woff")}@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:../fonts/inter-semibold.woff2 format("woff2"),../fonts/inter-semibold.woff format("woff")}@font-face{font-family:Inter;font-style:normal;font-weight:700;font-display:swap;src:../fonts/inter-bold.woff2 format("woff2"),../fonts/inter-bold.woff format("woff")}:root{--max-screen:83.25;--fc-screen:100vw;--fc-bp:calc((var(--fc-screen) - 20em)/(var(--max-screen) - 20));--fc-base:18;--fc-3xs:4.5;--space-3xs:calc(var(--fc-3xs)/16*1rem);--fc-2xs:9;--space-2xs:calc(var(--fc-2xs)/16*1rem);--fc-xs:13.5;--space-xs:calc(var(--fc-xs)/16*1rem);--fc-s:18;--space-s:calc(var(--fc-s)/16*1rem);--fc-m:27;--space-m:calc(var(--fc-m)/16*1rem);--fc-l:36;--space-l:calc(var(--fc-l)/16*1rem);--fc-xl:54;--space-xl:calc(var(--fc-xl)/16*1rem);--fc-2xl:72;--space-2xl:calc(var(--fc-2xl)/16*1rem);--fc-3xl:108;--space-3xl:calc(var(--fc-3xl)/16*1rem);--fc-4xl:144;--space-4xl:calc(var(--fc-4xl)/16*1rem);--space--3xs:calc( ((var(--fc-)/16)*1rem) + (var(--fc-3xs) - var(--fc-))*var(--fluid-bp));--space-3xs-2xs:calc( ((var(--fc-3xs)/16)*1rem) + (var(--fc-2xs) - var(--fc-3xs))*var(--fluid-bp));--space-2xs-xs:calc( ((var(--fc-2xs)/16)*1rem) + (var(--fc-xs) - var(--fc-2xs))*var(--fluid-bp));--space-xs-s:calc( ((var(--fc-xs)/16)*1rem) + (var(--fc-s) - var(--fc-xs))*var(--fluid-bp));--space-s-m:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-m) - var(--fc-s))*var(--fluid-bp));--space-m-l:calc( ((var(--fc-m)/16)*1rem) + (var(--fc-l) - var(--fc-m))*var(--fluid-bp));--space-l-xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-xl) - var(--fc-l))*var(--fluid-bp));--space-xl-2xl:calc( ((var(--fc-xl)/16)*1rem) + (var(--fc-2xl) - var(--fc-xl))*var(--fluid-bp));--space-2xl-3xl:calc( ((var(--fc-2xl)/16)*1rem) + (var(--fc-3xl) - var(--fc-2xl))*var(--fluid-bp));--space-3xl-4xl:calc( ((var(--fc-3xl)/16)*1rem) + (var(--fc-4xl) - var(--fc-3xl))*var(--fluid-bp));--space-s-l:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-l) - var(--fc-s))*var(--fluid-bp));--space-s-m:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-m) - var(--fc-s))*var(--fluid-bp));--space-xs-l:calc( ((var(--fc-xs)/16)*1rem) + (var(--fc-l) - var(--fc-xs))*var(--fluid-bp));--space-m-xl:calc( ((var(--fc-m)/16)*1rem) + (var(--fc-xl) - var(--fc-m))*var(--fluid-bp));--space-l-2xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-2xl) - var(--fc-l))*var(--fluid-bp));--space-s-xl:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-xl) - var(--fc-s))*var(--fluid-bp));--space-l-3xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-3xl) - var(--fc-l))*var(--fluid-bp));--space-xl-3xl:calc( ((var(--fc-xl)/16)*1rem) + (var(--fc-3xl) - var(--fc-xl))*var(--fluid-bp));--space-l-4xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-4xl) - var(--fc-l))*var(--fluid-bp));--space-3xs-m:calc( ((var(--fc-3xs)/16)*1rem) + (var(--fc-m) - var(--fc-3xs))*var(--fluid-bp));--gutter:var(--space-s-l)}@media screen and (min-width:75em){:root{--fc-screen:calc(var(--max-screen)*1rem)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(360deg)}}*,:before,:after{box-sizing:border-box}body{min-height:100vh;flex-direction:column;justify-content:flex-start;align-items:stretch;margin:0;display:flex}html{scroll-behavior:smooth}blockquote,pre,ol,ul,figure{margin:0;padding:0}img{max-width:100%;height:auto;border:0;display:block}article,aside,figure,footer,header,aside,main,nav{display:block}iframe{border:0}body{letter-spacing:-.01em;font:400 18px/1.2 Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:var(--step-0);color:#333}h1,h2,h3,h4,h5,h6,p,ul,ol,dl{margin:0}ul,ol,p{line-height:1.2}a{text-decoration:none}a,a:hover{cursor:pointer;color:inherit}.mp ol,.mp ul{list-style:none}cite,address{font-style:normal}[type=submit],[type=button],button{box-shadow:none;appearance:none;cursor:pointer;color:inherit;font:inherit;background:0 0;border:0;border-radius:0;padding:0}label{cursor:pointer}fieldset{border:0;padding:.01em 0 0}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}code[class*=language-],pre[class*=language-]{text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;color:#3d7b87;tab-size:4;hyphens:none;background:#ebf1f2;font-family:Source Code Pro,monospace;font-size:1rem;line-height:1.5em}.c-alert code[class*=language-],.c-alert pre[class*=language-]{background:0 0}code[class*=language-]::selection,pre[class*=language-]::selection,code[class*=language-] ::selection,pre[class*=language-] ::selection{color:#263238;background:#cceae7}:not(pre)>code[class*=language-]{white-space:normal;border-radius:.2em;padding:.1em}pre[class*=language-]{padding:18px;padding:var(--space-s);position:relative;overflow:auto}.language-css>code,.language-sass>code,.language-scss>code{color:#f2a60d}[class*=language-] .namespace{opacity:.7}.token.atrule{color:#3d7b87}.token.attr-name{color:#00a2c2}.token.attr-value,.token.attribute{color:#13aa13}.token.boolean{color:#ce0058}.token.builtin,.token.cdata,.token.char,.token.class{color:#00a2c2}.token.class-name{color:#6182b8}.token.comment{color:#aabfc9}.token.constant{color:#3d7b87}.token.deleted{color:#ce0058}.token.doctype{color:#aabfc9}.token.entity{color:#ce0058}.token.function{color:#3d7b87}.token.hexcode{color:#f2a60d}.token.id,.token.important{color:#3d7b87;font-weight:700}.token.inserted{color:#00a2c2}.token.keyword{color:#3d7b87}.token.number{color:#f2a60d}.token.operator{color:#00a2c2}.token.prolog{color:#aabfc9}.token.property{color:#00a2c2}.token.pseudo-class,.token.pseudo-element{color:#13aa13}.token.punctuation,.token.regex{color:#00a2c2}.token.selector{color:#ce0058}.token.string{color:#13aa13}.token.symbol{color:#3d7b87}.token.tag{color:#005461}.token.unit{color:#f2a60d}.token.url,.token.variable{color:#ce0058}.u-hr,.c-library hr,.o-prose hr{padding-bottom:27px;padding-bottom:var(--space-m-xl);margin:0 0 27px;margin-bottom:var(--space-m-xl);border:0;border-bottom:1px solid #bfd3d6}.u-border-top{border-top:1px solid #bfd3d6}.u-border-bottom{border-bottom:1px solid #bfd3d6}.u-border{border:1px solid #bfd3d6}.o-grid{margin-bottom:-18px;margin-bottom:calc(-1*var(--gutter));width:100%;flex-wrap:wrap;justify-content:stretch;display:flex}.o-grid--float:after{content:" ";clear:both;display:table}.o-grid--between{justify-content:space-between}.o-grid--no-height-match{align-items:start}.o-grid>*{margin-bottom:18px;margin-bottom:var(--gutter);width:100%}@media (min-width:40em){.o-grid--of-two>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two>:nth-child(2n+1){margin-left:0}.o-grid--of-two.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--space-s)/2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-two.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-two.o-grid--s>:nth-child(2n+1){margin-left:0}}.o-grid--of-two-switch{justify-content:space-between}@media (min-width:40em){.o-grid--of-two-switch>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two-switch>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-switch>:nth-child(2n+1){margin-left:0}.o-grid--of-two-switch.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--space-s)/2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-two-switch.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-two-switch.o-grid--s>:nth-child(2n+1),.o-grid--of-two-switch>:nth-child(2n+2){margin-left:0}}@media (min-width:55em){.o-grid--of-two-late>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-late>:nth-child(2n+1){margin-left:0}.o-grid--of-two-late.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--space-s)/2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-two-late.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-two-late.o-grid--s>:nth-child(2n+1){margin-left:0}}@media (min-width:22.4em){.o-grid--of-two-early>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-early>:nth-child(2n+1){margin-left:0}.o-grid--of-two-early.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--space-s)/2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-two-early.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-two-early.o-grid--s>:nth-child(2n+1){margin-left:0}}@media (min-width:38em) and (max-width:54.9375em){.o-grid--of-three>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-three>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three>:nth-child(2n+1){margin-left:0}.o-grid--of-three.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--space-s)/2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-three.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-three.o-grid--s>:nth-child(2n+1){margin-left:0}}@media (min-width:55em){.o-grid--of-three>*{width:calc(33.3333% - 12.1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-three>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three>:nth-child(3n+1){margin-left:0}.o-grid--of-three.o-grid--s>*{width:calc(33.3333% - 12.1px);width:calc(33.3333% - 2*var(--space-s)/3 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-three.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-three.o-grid--s>:nth-child(3n+1){margin-left:0}}@media (min-width:38em) and (max-width:67.9375em){.o-grid--of-three-late>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-three-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-late>:nth-child(2n+1){margin-left:0}.o-grid--of-three-late.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--space-s)/2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-three-late.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-three-late.o-grid--s>:nth-child(2n+1){margin-left:0}}@media (min-width:68em){.o-grid--of-three-late>*{width:calc(33.3333% - 12.1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-three-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-late>:nth-child(3n+1){margin-left:0}.o-grid--of-three-late.o-grid--s>*{width:calc(33.3333% - 12.1px);width:calc(33.3333% - 2*var(--space-s)/3 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-three-late.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-three-late.o-grid--s>:nth-child(3n+1){margin-left:0}}@media (min-width:22.4em) and (max-width:54.9375em){.o-grid--of-three-early>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-three-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-early>:nth-child(2n+1){margin-left:0}.o-grid--of-three-early.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--space-s)/2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-three-early.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-three-early.o-grid--s>:nth-child(2n+1){margin-left:0}}@media (min-width:55em){.o-grid--of-three-early>*{width:calc(33.3333% - 12.1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-three-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-early>:nth-child(3n+1){margin-left:0}.o-grid--of-three-early.o-grid--s>*{width:calc(33.3333% - 12.1px);width:calc(33.3333% - 2*var(--space-s)/3 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-three-early.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-three-early.o-grid--s>:nth-child(3n+1){margin-left:0}}@media (min-width:38em) and (max-width:59.9375em){.o-grid--of-four>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-four>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four>:nth-child(2n+1){margin-left:0}.o-grid--of-four.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--space-s)/2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-four.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-four.o-grid--s>:nth-child(2n+1){margin-left:0}}@media (min-width:60em){.o-grid--of-four>*{width:calc(25% - 13.6px);width:calc(25% - 3*var(--gutter)/4 - .1px)}.o-grid--of-four>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four>:nth-child(4n+1){margin-left:0}.o-grid--of-four.o-grid--s>*{width:calc(25% - 13.6px);width:calc(25% - 3*var(--space-s)/4 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-four.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-four.o-grid--s>:nth-child(4n+1){margin-left:0}}@media (min-width:22.4em) and (max-width:59.9375em){.o-grid--of-four-early>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-four-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four-early>:nth-child(2n+1){margin-left:0}.o-grid--of-four-early.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--space-s)/2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-four-early.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-four-early.o-grid--s>:nth-child(2n+1){margin-left:0}}@media (min-width:60em){.o-grid--of-four-early>*{width:calc(25% - 13.6px);width:calc(25% - 3*var(--gutter)/4 - .1px)}.o-grid--of-four-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four-early>:nth-child(4n+1){margin-left:0}.o-grid--of-four-early.o-grid--s>*{width:calc(25% - 13.6px);width:calc(25% - 3*var(--space-s)/4 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-four-early.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-four-early.o-grid--s>:nth-child(4n+1){margin-left:0}}@media (min-width:22.4em) and (max-width:64.9375em){.o-grid--of-five>*{width:calc(33.3333% - 12.1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-five>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-five>:nth-child(3n+1){margin-left:0}.o-grid--of-five.o-grid--s>*{width:calc(33.3333% - 12.1px);width:calc(33.3333% - 2*var(--space-s)/3 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-five.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-five.o-grid--s>:nth-child(3n+1){margin-left:0}}@media (min-width:65em){.o-grid--of-five>*{width:calc(20% - 14.5px);width:calc(20% - 4*var(--gutter)/5 - .1px)}.o-grid--of-five>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-five>:nth-child(5n+1){margin-left:0}.o-grid--of-five.o-grid--s>*{width:calc(20% - 14.5px);width:calc(20% - 4*var(--space-s)/5 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-five.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-five.o-grid--s>:nth-child(5n+1){margin-left:0}}@media (max-width:54.9375em){.o-grid--swipeable{left:50%;left:calc(50% + var(--scrollbarWidth)/2.0001);width:100vw;width:calc(100vw - var(--scrollbarWidth));padding-left:var(--gutter);padding-right:var(--gutter);scroll-snap-type:x mandatory;scroll-padding:var(--gutter);-webkit-overflow-scrolling:touch;flex-wrap:nowrap;position:relative;overflow-x:scroll;transform:translate(-50vw)}.o-grid--swipeable>*{max-width:23em;width:calc(85vw - var(--gutter)*2.333);scroll-snap-align:start;scroll-snap-stop:always;flex:none}.o-grid--swipeable>*+*{margin-left:var(--gutter)!important}}@media (max-width:55em){.o-grid--float:not([class*=switch])>:nth-child(2n+1),.o-grid--float[class*=switch]>:nth-child(2n+2),.o-grid--float:not([class*=switch])>:nth-child(2n+2),.o-grid--float[class*=switch]>:nth-child(2n+1){position:static}}@media (min-width:55em){.o-grid--4\/7>:nth-child(2n+2),.o-grid--4\/7-switch>:nth-child(2n+2){width:57.1429%}.o-grid--9\/3>:nth-child(2n+1),.o-grid--8\/3>:nth-child(2n+1),.o-grid--8\/4>:nth-child(2n+1),.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--4\/8>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--8\/4-switch>:nth-child(2n+2),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1),.o-grid--4\/8-switch>:nth-child(2n+1){width:65.7143%}.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--8\/4>:nth-child(2n+2),.o-grid--3\/9>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+1),.o-grid--4\/8>:nth-child(2n+1),.o-grid--4\/7>:nth-child(2n+1),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--8\/4-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+2),.o-grid--4\/8-switch>:nth-child(2n+2),.o-grid--4\/7-switch>:nth-child(2n+1){width:31.4286%}.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--4\/8>:nth-child(2n+2),.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--8\/4>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--8\/4-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1),.o-grid--4\/8-switch>:nth-child(2n+1){margin-left:2.85714%;margin-right:0}.o-grid--8\/3>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+1){max-width:828px}.o-grid[class*=switch]>:nth-child(2n+1){order:1}.o-grid--layout,.o-grid--layout>:nth-last-child(1),.o-grid--layout>:nth-last-child(2){margin-bottom:0}.o-grid--push{justify-content:space-between}.o-grid--pull{justify-content:flex-start}.o-grid--float{display:block}.o-grid--float:not([class*=switch])>:nth-child(2n+1),.o-grid--float[class*=switch]>:nth-child(2n+2){float:left}.o-grid--float:not([class*=switch])>:nth-child(2n+2),.o-grid--float[class*=switch]>:nth-child(2n+1){float:right}}@media (min-width:70em){.o-grid--9\/3>:nth-child(2n+1),.o-grid--8\/3>:nth-child(2n+1),.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1){width:74.2857%}.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--3\/9>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+1),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+2){width:22.8571%}}.c-library{min-height:100vh;grid-template-rows:auto 1fr auto;display:grid}.c-library--components{grid-template-rows:auto 1fr}.c-library__header{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);padding:9px;padding:var(--space-2xs);color:#fff;background:#005461;flex-direction:column;align-items:flex-start;font-weight:700}@media only screen and (min-width:650px){.c-library__header{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2);flex-direction:row;align-items:center}}@media only screen and (min-width:1000px){.c-library__header{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);padding:18px;padding:var(--space-s)var(--space-s-l)}}.c-library__header img{filter:saturate(0)brightness(10)}.c-library__header .c-library-page-active{position:relative}.c-library__header .c-library-page-active:after{content:"";width:100%;border-bottom:1px solid ;position:absolute;bottom:-6px;left:0}.c-library__hero{color:#fff;background:linear-gradient(#005461,#0000),linear-gradient(45deg,#00a2c2,#005461)}.c-library__body{grid-template-rows:auto auto;display:grid}@media only screen and (min-width:600px){.c-library__body{grid-template-columns:10em 1fr}}@media only screen and (min-width:800px){.c-library__body{grid-template-columns:17em 1fr}}@media only screen and (min-width:600px){.c-library--components .c-library__body>*{height:calc(100vh - var(--headerHeight) - 1px);overflow-y:auto}}.c-library__sidebar{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2);scroll-behavior:none;border-right:1px solid #ebf1f2;grid-row:-1}@media only screen and (min-width:600px){.c-library__sidebar{grid-row:auto}}@media only screen and (min-width:800px){.c-library__sidebar{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1)}}.c-library__sidebar>*{padding:18px;padding:var(--space-s-l)var(--space-s)var(--space-s-l)var(--space-s-l)}.c-library__sidebar li{position:relative}.c-library__sidebar li a{color:#006daf}.c-library__sidebar li a:hover{color:#006daf;text-decoration:underline}.c-library__sidebar li+li{margin-top:13.5px;margin-top:var(--space-xs)}.c-library__sidebar ul ul{padding:13.5px;padding:var(--space-xs);padding-bottom:0}.c-library__sidebar ul ul li+li{margin-top:9px;margin-top:var(--space-2xs)}.c-library__skip-link{padding:13.5px;padding:var(--space-xs)}@media only screen and (min-width:600px){.c-library__skip-link{display:none}}.c-library__logo{max-width:15%;min-width:100px;justify-content:center;align-items:center;display:flex}@media only screen and (min-width:650px){.c-library__logo{justify-content:flex-start}}.c-library__logo-name{padding-left:13.5px;padding-left:var(--space-xs-s);margin-left:13.5px;margin-left:var(--space-xs-s);white-space:nowrap;border-left:1px solid #3d7b87}.c-library__logo-name span{display:block}.c-library__logo-name span:nth-last-child(3),.c-library__logo-name span:nth-last-child(1){text-transform:uppercase;letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);letter-spacing:.08em;color:#bfd3d6}.c-library__logo-name span:nth-last-child(2){color:#fff;letter-spacing:-.03em;font-size:37.32px;font-size:var(--step-4)}.has-js .c-library__sidebar ul>li>ul{display:none}.has-js .c-library__sidebar ul>.c-library-accordion-open>ul{display:block}.c-library .c-library-accordion-open>.c-library-accordion__toggle{transform:rotate(180deg)}.c-library .c-library-accordion__toggle{color:#006daf;justify-content:center;align-items:center;padding:.25rem;font-size:1rem;line-height:1;display:flex;position:absolute;top:0;right:0}.c-library-menu-active{font-weight:700;position:relative}.c-library-menu-active:before{content:"▸ ";position:absolute;top:0;left:-17px}.c-library-stretch{flex-direction:column;flex:1;display:flex}.c-library__main{overflow-y:auto}@media only screen and (min-width:600px){.c-library__main{overflow-y:scroll}}.c-library__frame{width:100%;position:relative}.c-library__frame-links{right:0;top:calc(-1*(var(--space-m) + var(--space-s)));z-index:1;position:absolute}.c-library__frame-links a,.c-library__frame-links button{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595;background:#bfd3d6;border-radius:0 0 .25em .25em;padding:.25em .666em}.c-library__frame-background{border-radius:0 0 0 .25em;top:0}.c-library__frame iframe{--negative-padding:calc( var(--space-m)*-1 );height:100%;width:100%;width:calc(100% - var(--negative-padding)*2);left:var(--negative-padding);top:var(--negative-padding);resize:both;transition:padding .3s cubic-bezier(.22,.61,.36,1),background-color .3s cubic-bezier(.22,.61,.36,1)}@media only screen and (min-width:600px){.c-library__frame iframe{position:absolute}}.c-library__frame iframe body{border:2px solid red}.c-library-code{font-family:Source Code Pro}.c-library-pre{padding:18px;padding:var(--space-s);background:#ebf1f2;font-family:Source Code Pro;line-height:1.4;overflow-x:auto}.c-library-pre--bordered{border-bottom:1px solid #bfd3d6}.c-library-version{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595}.c-library-status{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595;background:#bfd3d6;border-radius:.25em;padding:.25em .666em}.c-library-status--ready{color:#fff;background:#13aa13}.c-library-status--in-production,.c-library-status--development,.c-library-status--placeholder{color:#fff;background:#f2a60d}.c-library-status--deprecated{color:#fff;background:#ce0058}.c-library__swatch-grid{margin-bottom:var(--space-m);grid-auto-rows:minmax(4em,auto);gap:0 1em;display:grid}@media only screen and (min-width:680px){.c-library__swatch-grid{grid-template-rows:5em auto;grid-template-columns:repeat(5,auto);gap:0}}.c-library__swatch-grid--has-labels{grid-auto-flow:row}@media only screen and (min-width:40em){.c-library__swatch-grid--has-labels{grid-template-rows:auto;grid-template-columns:minmax(15%,15em) auto}}@media only screen and (min-width:1000px){.c-library__swatch-grid--has-labels{grid-template-rows:5em auto;grid-template-columns:repeat(5,1fr);grid-auto-flow:column}}.c-library__swatches,.c-library__swatch-labels{grid-template-columns:repeat(auto-fit,165px);display:grid}.c-library__swatch{display:flex}.c-library__swatch>*{justify-content:center;margin:auto;font-weight:700}.c-library__swatches>*{height:0;padding-bottom:50%;position:relative}.c-library__swatches>*>*{text-align:center;height:100%;width:100%;justify-content:center;align-items:center;padding:.5rem;font-weight:700;display:flex;position:absolute;top:0;left:0}.c-library__swatch-grid table{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}.c-library__swatch-grid table td,.c-library__swatch-grid table th{padding:9px 0 9px 4.5px;padding:var(--space-2xs)0 var(--space-2xs)var(--space-3xs)}.c-library__swatch-grid table th{width:3em}.c-library__swatch-grid table td{font-family:monospace}.c-library__image-row{max-width:100%;display:flex}.c-library__image-row img{object-fit:contain;width:6%;flex:auto;margin:0 2% 0 0}.c-library__image-row img:last-child{margin-right:0}.c-library__space{display:block}.c-library__space span{height:0;background:linear-gradient(45deg,#fff3 0%,#fff0 100%),#ce005880;padding-bottom:100%;display:block;position:relative}.c-library__space code{margin-left:18px;margin-left:var(--space-s);white-space:nowrap;line-height:1;position:absolute;top:50%;left:100%;transform:translateY(-50%)}.c-library-grid{color:#fff;letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);background:#00758c;justify-content:center;align-items:center;padding:3rem 1rem;display:flex}.c-library-grid--alt{background:#3d7b87;padding:2rem 1rem}.c-library-grid--alt:before{content:" ";display:block}.c-library-grid--first{background:#005461;padding:2rem 1rem}.c-library-grid--first:before{content:"First on mobile"}.c-library-copy{position:relative}.c-library-copy__trigger{letter-spacing:-.01em;font-size:15px;font-weight:700;font-size:var(--step--1);padding:4.5px 9px;padding:var(--space-3xs)var(--space-2xs);letter-spacing:.02em;background:#bfd3d6;position:absolute;bottom:0;right:0}.c-library-copy__trigger:hover{color:#ce0058}.c-library__typo__sidebar{width:14.2857%}.c-library__typo__sidebar span{display:block}.c-library__typo__sidebar .x2{height:2em;border:1px solid #333;border-width:1px 0;margin-top:4.25em;line-height:2em}.c-library__typo__main{width:82.8572%}.c-library__semi{font-weight:600}.c-library__photo-grid{margin-top:54px;margin-top:var(--space-xl);grid-template-columns:1fr;gap:2px;display:grid}@media only screen and (min-width:880px){.c-library__photo-grid{grid-auto-flow:dense;grid-auto-rows:auto}.c-library__photo-grid img{height:100%;width:100%;object-fit:cover}.c-library__photo-grid div{grid-area:1/1/2/3;display:flex}.c-library__photo-grid div h2{margin:auto var(--space-s)}.c-library__photo-grid.grid-1{grid-template-columns:40% 20% 40%;grid-template-rows:var(--space-2xl)400px 400px}.c-library__photo-grid.grid-1 img:nth-child(2){grid-area:2/1/3/3}.c-library__photo-grid.grid-1 img:nth-child(3){grid-area:1/3/3/4}.c-library__photo-grid.grid-1 img:nth-child(5){grid-column:2/4}.c-library__photo-grid.grid-2{grid-template-columns:50% 50%;grid-template-rows:var(--space-2xl)300px 300px}.c-library__photo-grid.grid-2 div{grid-column:1/2}.c-library__photo-grid.grid-2 img:nth-child(2){grid-row:2/4}.c-library__photo-grid.grid-2 img:nth-child(3){grid-row:1/3}}.c-library__illustration-grid{gap:var(--gutter);grid-template-columns:repeat(auto-fill,minmax(260px,1fr));display:grid}.c-library__illustration-grid :nth-child(2n+1):nth-last-child(5){grid-column:1/-1}.c-library .c-alert ul li{margin-left:1em;padding-left:.5rem;list-style:outside url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"8\" height=\"20\" viewBox=\"0 0 10 20\"><circle cx=\"5\" cy=\"14\" r=\"3.5\" fill=\"%2313AA13\" fill-rule=\"evenodd\"/></svg>")}.c-library .c-alert ul li h3,.c-library .c-alert ul li h4{color:#13aa13;font-size:1em;line-height:1.6}@media only screen and (max-width:1050px){.c-library__logo-name span:nth-last-child(3),.c-library__logo-name span:nth-last-child(1){letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}.c-library__logo-name span:nth-last-child(2){letter-spacing:-.02em;font-size:21.6px;font-size:var(--step-1)}.c-library__header nav li:last-child{display:none}}@media only screen and (min-width:650px) and (max-width:700px),screen and (max-width:450px){.c-library__header nav .u-row{gap:9px;gap:var(--space-2xs);letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}}@media only screen and (max-width:650px){.c-library__header nav a{padding:9px 0;padding:var(--space-2xs)0;display:block}.c-library__header .c-library-page-active:after{bottom:4.5px;bottom:var(--space-3xs)}}
-/*# sourceMappingURL=library.css.map */
+@charset "UTF-8";@import"https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap";.u-breakout{left:50%;left:calc(50% + var(--scrollbarWidth) / 2.0001);position:relative;transform:translate(-50vw);width:100vw;width:calc(100vw - var(--scrollbarWidth));padding-left:safe-space(0);padding-right:safe-space(0)}.u-cutoff{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--gutter)),calc(100% - var(--gutter)) 100%,0 100%)}.u-cutoff--top-right{clip-path:polygon(0 0,calc(100% - var(--gutter)) 0,100% var(--gutter),100% 100%,0 100%)}.u-cutoff--top-left{clip-path:polygon(0 var(--gutter),var(--gutter) 0,100% 0,100% 100%,0 100%)}.u-cutoff--bottom-left{clip-path:polygon(0 0,100% 0,100% 100%,var(--gutter) 100%,0 calc(100% - var(--gutter)))}.u-cutoff--m{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--space-m)),calc(100% - var(--space-m)) 100%,0 100%)}.u-cutoff--xl{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--space-xl)),calc(100% - var(--space-xl)) 100%,0 100%)}:root{--fluid-min-width: 320;--fluid-max-width: 1332;--fluid-screen: 100vw;--fluid-bp: calc( (var(--fluid-screen) - var(--fluid-min-width) / 16 * 1rem) / (var(--fluid-max-width) - var(--fluid-min-width)) )}@media screen and (min-width: 1332px){:root{--fluid-screen: calc(var(--fluid-max-width) * 1px)}}:root{--f--2-min: 12.64;--f--2-max: 12.5;--step--2: calc( ((var(--f--2-min) / 16) * 1rem) + (var(--f--2-max) - var(--f--2-min)) * var(--fluid-bp) );--f--1-min: 14.22;--f--1-max: 15;--step--1: calc( ((var(--f--1-min) / 16) * 1rem) + (var(--f--1-max) - var(--f--1-min)) * var(--fluid-bp) );--f-0-min: 16;--f-0-max: 18;--step-0: calc( ((var(--f-0-min) / 16) * 1rem) + (var(--f-0-max) - var(--f-0-min)) * var(--fluid-bp) );--f-1-min: 18;--f-1-max: 21.6;--step-1: calc( ((var(--f-1-min) / 16) * 1rem) + (var(--f-1-max) - var(--f-1-min)) * var(--fluid-bp) );--f-2-min: 20.25;--f-2-max: 25.92;--step-2: calc( ((var(--f-2-min) / 16) * 1rem) + (var(--f-2-max) - var(--f-2-min)) * var(--fluid-bp) );--f-3-min: 22.78;--f-3-max: 31.1;--step-3: calc( ((var(--f-3-min) / 16) * 1rem) + (var(--f-3-max) - var(--f-3-min)) * var(--fluid-bp) );--f-4-min: 25.63;--f-4-max: 37.32;--step-4: calc( ((var(--f-4-min) / 16) * 1rem) + (var(--f-4-max) - var(--f-4-min)) * var(--fluid-bp) );--f-5-min: 28.83;--f-5-max: 44.79;--step-5: calc( ((var(--f-5-min) / 16) * 1rem) + (var(--f-5-max) - var(--f-5-min)) * var(--fluid-bp) );--f-6-min: 32.44;--f-6-max: 53.75;--step-6: calc( ((var(--f-6-min) / 16) * 1rem) + (var(--f-6-max) - var(--f-6-min)) * var(--fluid-bp) );--f-7-min: 36.49;--f-7-max: 64.5;--step-7: calc( ((var(--f-7-min) / 16) * 1rem) + (var(--f-7-max) - var(--f-7-min)) * var(--fluid-bp) );--f-8-min: 41.05;--f-8-max: 77.4;--step-8: calc( ((var(--f-8-min) / 16) * 1rem) + (var(--f-8-max) - var(--f-8-min)) * var(--fluid-bp) );--f-9-min: 46.18;--f-9-max: 92.88;--step-9: calc( ((var(--f-9-min) / 16) * 1rem) + (var(--f-9-max) - var(--f-9-min)) * var(--fluid-bp) );--f-10-min: 51.96;--f-10-max: 111.45;--step-10: calc( ((var(--f-10-min) / 16) * 1rem) + (var(--f-10-max) - var(--f-10-min)) * var(--fluid-bp) )}@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:../fonts/inter-regular.woff2 format("woff2"),../fonts/inter-regular.woff format("woff")}@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:../fonts/inter-semibold.woff2 format("woff2"),../fonts/inter-semibold.woff format("woff")}@font-face{font-family:Inter;font-style:normal;font-weight:700;font-display:swap;src:../fonts/inter-bold.woff2 format("woff2"),../fonts/inter-bold.woff format("woff")}:root{--max-screen: 83.25;--fc-screen: 100vw;--fc-bp: calc((var(--fc-screen) - 20em) / (var(--max-screen) - 20));--fc-base: 18;--fc-3xs: 4.5;--space-3xs: calc(var(--fc-3xs) / 16 * 1rem);--fc-2xs: 9;--space-2xs: calc(var(--fc-2xs) / 16 * 1rem);--fc-xs: 13.5;--space-xs: calc(var(--fc-xs) / 16 * 1rem);--fc-s: 18;--space-s: calc(var(--fc-s) / 16 * 1rem);--fc-m: 27;--space-m: calc(var(--fc-m) / 16 * 1rem);--fc-l: 36;--space-l: calc(var(--fc-l) / 16 * 1rem);--fc-xl: 54;--space-xl: calc(var(--fc-xl) / 16 * 1rem);--fc-2xl: 72;--space-2xl: calc(var(--fc-2xl) / 16 * 1rem);--fc-3xl: 108;--space-3xl: calc(var(--fc-3xl) / 16 * 1rem);--fc-4xl: 144;--space-4xl: calc(var(--fc-4xl) / 16 * 1rem);--space--3xs: calc( ((var(--fc-) / 16) * 1rem) + (var(--fc-3xs) - var(--fc-)) * var(--fluid-bp) );--space-3xs-2xs: calc( ((var(--fc-3xs) / 16) * 1rem) + (var(--fc-2xs) - var(--fc-3xs)) * var(--fluid-bp) );--space-2xs-xs: calc( ((var(--fc-2xs) / 16) * 1rem) + (var(--fc-xs) - var(--fc-2xs)) * var(--fluid-bp) );--space-xs-s: calc( ((var(--fc-xs) / 16) * 1rem) + (var(--fc-s) - var(--fc-xs)) * var(--fluid-bp) );--space-m-l: calc( ((var(--fc-m) / 16) * 1rem) + (var(--fc-l) - var(--fc-m)) * var(--fluid-bp) );--space-l-xl: calc( ((var(--fc-l) / 16) * 1rem) + (var(--fc-xl) - var(--fc-l)) * var(--fluid-bp) );--space-xl-2xl: calc( ((var(--fc-xl) / 16) * 1rem) + (var(--fc-2xl) - var(--fc-xl)) * var(--fluid-bp) );--space-2xl-3xl: calc( ((var(--fc-2xl) / 16) * 1rem) + (var(--fc-3xl) - var(--fc-2xl)) * var(--fluid-bp) );--space-3xl-4xl: calc( ((var(--fc-3xl) / 16) * 1rem) + (var(--fc-4xl) - var(--fc-3xl)) * var(--fluid-bp) );--space-s-l: calc( ((var(--fc-s) / 16) * 1rem) + (var(--fc-l) - var(--fc-s)) * var(--fluid-bp) );--space-s-m: calc( ((var(--fc-s) / 16) * 1rem) + (var(--fc-m) - var(--fc-s)) * var(--fluid-bp) );--space-xs-l: calc( ((var(--fc-xs) / 16) * 1rem) + (var(--fc-l) - var(--fc-xs)) * var(--fluid-bp) );--space-m-xl: calc( ((var(--fc-m) / 16) * 1rem) + (var(--fc-xl) - var(--fc-m)) * var(--fluid-bp) );--space-l-2xl: calc( ((var(--fc-l) / 16) * 1rem) + (var(--fc-2xl) - var(--fc-l)) * var(--fluid-bp) );--space-s-xl: calc( ((var(--fc-s) / 16) * 1rem) + (var(--fc-xl) - var(--fc-s)) * var(--fluid-bp) );--space-l-3xl: calc( ((var(--fc-l) / 16) * 1rem) + (var(--fc-3xl) - var(--fc-l)) * var(--fluid-bp) );--space-xl-3xl: calc( ((var(--fc-xl) / 16) * 1rem) + (var(--fc-3xl) - var(--fc-xl)) * var(--fluid-bp) );--space-l-4xl: calc( ((var(--fc-l) / 16) * 1rem) + (var(--fc-4xl) - var(--fc-l)) * var(--fluid-bp) );--space-3xs-m: calc( ((var(--fc-3xs) / 16) * 1rem) + (var(--fc-m) - var(--fc-3xs)) * var(--fluid-bp) );--gutter: var(--space-s-l)}@media screen and (min-width: 75em){:root{--fc-screen: calc(var(--max-screen) * 1rem)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}*,*:before,*:after{box-sizing:border-box}body{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;min-height:100vh;margin:0}html{scroll-behavior:smooth}blockquote,pre,ol,ul,figure{padding:0;margin:0}img{max-width:100%;display:block;height:auto;border:none}article,aside,figure,footer,header,aside,main,nav{display:block}iframe{border:none}body{font:400 1.125rem/1.2 Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;letter-spacing:-.01em;font-size:18px;font-size:var(--step-0);color:#333}h1,h2,h3,h4,h5,h6,p,ul,ol,dl{margin:0}ul,ol,p{line-height:1.2}a{text-decoration:none}a,a:hover{cursor:pointer;color:inherit}.mp ol,.mp ul{list-style:none}cite,address{font-style:normal}[type=submit],[type=button],button{border-radius:0;background:transparent;box-shadow:none;appearance:none;padding:0;cursor:pointer;border:none;color:inherit;font:inherit}label{cursor:pointer}fieldset{border:0;padding:.01em 0 0}@media (prefers-reduced-motion: reduce){*{-webkit-animation:none!important;animation:none!important;transition:none!important;scroll-behavior:auto!important}}code[class*=language-],pre[class*=language-]{text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;color:#3d7b87;background:#EBF1F2;font-family:Source Code Pro,monospace;font-size:1rem;line-height:1.5em;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}.c-alert code[class*=language-],.c-alert pre[class*=language-]{background:transparent}code[class*=language-]::-moz-selection,pre[class*=language-]::-moz-selection,code[class*=language-] ::-moz-selection,pre[class*=language-] ::-moz-selection{background:#cceae7;color:#263238}code[class*=language-]::selection,pre[class*=language-]::selection,code[class*=language-] ::selection,pre[class*=language-] ::selection{background:#cceae7;color:#263238}:not(pre)>code[class*=language-]{white-space:normal;border-radius:.2em;padding:.1em}pre[class*=language-]{overflow:auto;position:relative;padding:18px;padding:var(--space-s)}.language-css>code,.language-sass>code,.language-scss>code{color:#f2a60d}[class*=language-] .namespace{opacity:.7}.token.atrule{color:#3d7b87}.token.attr-name{color:#00a2c2}.token.attr-value,.token.attribute{color:#13aa13}.token.boolean{color:#ce0058}.token.builtin,.token.cdata,.token.char,.token.class{color:#00a2c2}.token.class-name{color:#6182b8}.token.comment{color:#aabfc9}.token.constant{color:#3d7b87}.token.deleted{color:#ce0058}.token.doctype{color:#aabfc9}.token.entity{color:#ce0058}.token.function{color:#3d7b87}.token.hexcode{color:#f2a60d}.token.id,.token.important{color:#3d7b87;font-weight:700}.token.inserted{color:#00a2c2}.token.keyword{color:#3d7b87}.token.number{color:#f2a60d}.token.operator{color:#00a2c2}.token.prolog{color:#aabfc9}.token.property{color:#00a2c2}.token.pseudo-class,.token.pseudo-element{color:#13aa13}.token.punctuation,.token.regex{color:#00a2c2}.token.selector{color:#ce0058}.token.string{color:#13aa13}.token.symbol{color:#3d7b87}.token.tag{color:#005461}.token.unit{color:#f2a60d}.token.url,.token.variable{color:#ce0058}.u-hr,.c-library hr,.o-prose hr{margin:0 0 27px;border:none;padding-bottom:27px;padding-bottom:var(--space-m-xl);margin-bottom:var(--space-m-xl);border-bottom:1px solid #BFD3D6}.u-border-top{border-top:1px solid #BFD3D6}.u-border-bottom{border-bottom:1px solid #BFD3D6}.u-border{border:1px solid #BFD3D6}.o-grid{display:flex;flex-wrap:wrap;justify-content:stretch;margin-bottom:-18px;margin-bottom:calc(-1 * var(--gutter));width:100%}.o-grid--float:after{content:" ";display:table;clear:both}.o-grid--between{justify-content:space-between}.o-grid--no-height-match{align-items:start}.o-grid>*{margin-bottom:18px;margin-bottom:var(--gutter);width:100%}@media (min-width: 40em){.o-grid--of-two>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--gutter) / 2 - .1px)}.o-grid--of-two>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two>*:nth-child(2n+1){margin-left:0}.o-grid--of-two.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--space-s) / 2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-two.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-two.o-grid--s>*:nth-child(2n+1){margin-left:0}}.o-grid--of-two-switch{justify-content:space-between}@media (min-width: 40em){.o-grid--of-two-switch>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--gutter) / 2 - .1px)}.o-grid--of-two-switch>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-switch>*:nth-child(2n+1){margin-left:0}.o-grid--of-two-switch.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--space-s) / 2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-two-switch.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-two-switch.o-grid--s>*:nth-child(2n+1){margin-left:0}.o-grid--of-two-switch>:nth-child(2n+2){margin-left:0}}@media (min-width: 55em){.o-grid--of-two-late>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--gutter) / 2 - .1px)}.o-grid--of-two-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-late>*:nth-child(2n+1){margin-left:0}.o-grid--of-two-late.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--space-s) / 2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-two-late.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-two-late.o-grid--s>*:nth-child(2n+1){margin-left:0}}@media (min-width: 22.4em){.o-grid--of-two-early>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--gutter) / 2 - .1px)}.o-grid--of-two-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-early>*:nth-child(2n+1){margin-left:0}.o-grid--of-two-early.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--space-s) / 2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-two-early.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-two-early.o-grid--s>*:nth-child(2n+1){margin-left:0}}@media (min-width: 38em) and (max-width: 54.9375em){.o-grid--of-three>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--gutter) / 2 - .1px)}.o-grid--of-three>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three>*:nth-child(2n+1){margin-left:0}.o-grid--of-three.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--space-s) / 2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-three.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-three.o-grid--s>*:nth-child(2n+1){margin-left:0}}@media (min-width: 55em){.o-grid--of-three>*{width:calc(33.3333333333% - 12px - .1px);width:calc(33.3333333333% - 2 * var(--gutter) / 3 - .1px)}.o-grid--of-three>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three>*:nth-child(3n+1){margin-left:0}.o-grid--of-three.o-grid--s>*{width:calc(33.3333333333% - 12px - .1px);width:calc(33.3333333333% - 2 * var(--space-s) / 3 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-three.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-three.o-grid--s>*:nth-child(3n+1){margin-left:0}}@media (min-width: 38em) and (max-width: 67.9375em){.o-grid--of-three-late>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--gutter) / 2 - .1px)}.o-grid--of-three-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-late>*:nth-child(2n+1){margin-left:0}.o-grid--of-three-late.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--space-s) / 2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-three-late.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-three-late.o-grid--s>*:nth-child(2n+1){margin-left:0}}@media (min-width: 68em){.o-grid--of-three-late>*{width:calc(33.3333333333% - 12px - .1px);width:calc(33.3333333333% - 2 * var(--gutter) / 3 - .1px)}.o-grid--of-three-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-late>*:nth-child(3n+1){margin-left:0}.o-grid--of-three-late.o-grid--s>*{width:calc(33.3333333333% - 12px - .1px);width:calc(33.3333333333% - 2 * var(--space-s) / 3 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-three-late.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-three-late.o-grid--s>*:nth-child(3n+1){margin-left:0}}@media (min-width: 22.4em) and (max-width: 54.9375em){.o-grid--of-three-early>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--gutter) / 2 - .1px)}.o-grid--of-three-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-early>*:nth-child(2n+1){margin-left:0}.o-grid--of-three-early.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--space-s) / 2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-three-early.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-three-early.o-grid--s>*:nth-child(2n+1){margin-left:0}}@media (min-width: 55em){.o-grid--of-three-early>*{width:calc(33.3333333333% - 12px - .1px);width:calc(33.3333333333% - 2 * var(--gutter) / 3 - .1px)}.o-grid--of-three-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-early>*:nth-child(3n+1){margin-left:0}.o-grid--of-three-early.o-grid--s>*{width:calc(33.3333333333% - 12px - .1px);width:calc(33.3333333333% - 2 * var(--space-s) / 3 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-three-early.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-three-early.o-grid--s>*:nth-child(3n+1){margin-left:0}}@media (min-width: 38em) and (max-width: 59.9375em){.o-grid--of-four>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--gutter) / 2 - .1px)}.o-grid--of-four>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four>*:nth-child(2n+1){margin-left:0}.o-grid--of-four.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--space-s) / 2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-four.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-four.o-grid--s>*:nth-child(2n+1){margin-left:0}}@media (min-width: 60em){.o-grid--of-four>*{width:calc(25% - 13.6px);width:calc(25% - 3 * var(--gutter) / 4 - .1px)}.o-grid--of-four>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four>*:nth-child(4n+1){margin-left:0}.o-grid--of-four.o-grid--s>*{width:calc(25% - 13.6px);width:calc(25% - 3 * var(--space-s) / 4 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-four.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-four.o-grid--s>*:nth-child(4n+1){margin-left:0}}@media (min-width: 22.4em) and (max-width: 59.9375em){.o-grid--of-four-early>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--gutter) / 2 - .1px)}.o-grid--of-four-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four-early>*:nth-child(2n+1){margin-left:0}.o-grid--of-four-early.o-grid--s>*{width:calc(50% - 9.1px);width:calc(50% - 1 * var(--space-s) / 2 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-four-early.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-four-early.o-grid--s>*:nth-child(2n+1){margin-left:0}}@media (min-width: 60em){.o-grid--of-four-early>*{width:calc(25% - 13.6px);width:calc(25% - 3 * var(--gutter) / 4 - .1px)}.o-grid--of-four-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four-early>*:nth-child(4n+1){margin-left:0}.o-grid--of-four-early.o-grid--s>*{width:calc(25% - 13.6px);width:calc(25% - 3 * var(--space-s) / 4 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-four-early.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-four-early.o-grid--s>*:nth-child(4n+1){margin-left:0}}@media (min-width: 22.4em) and (max-width: 64.9375em){.o-grid--of-five>*{width:calc(33.3333333333% - 12px - .1px);width:calc(33.3333333333% - 2 * var(--gutter) / 3 - .1px)}.o-grid--of-five>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-five>*:nth-child(3n+1){margin-left:0}.o-grid--of-five.o-grid--s>*{width:calc(33.3333333333% - 12px - .1px);width:calc(33.3333333333% - 2 * var(--space-s) / 3 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-five.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-five.o-grid--s>*:nth-child(3n+1){margin-left:0}}@media (min-width: 65em){.o-grid--of-five>*{width:calc(20% - 14.5px);width:calc(20% - 4 * var(--gutter) / 5 - .1px)}.o-grid--of-five>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-five>*:nth-child(5n+1){margin-left:0}.o-grid--of-five.o-grid--s>*{width:calc(20% - 14.5px);width:calc(20% - 4 * var(--space-s) / 5 - .1px);margin-bottom:18px;margin-bottom:var(--space-s)}.o-grid--of-five.o-grid--s>*+*{margin-left:18px;margin-left:var(--space-s)}.o-grid--of-five.o-grid--s>*:nth-child(5n+1){margin-left:0}}@media (max-width: 54.9375em){.o-grid--swipeable{left:50%;left:calc(50% + var(--scrollbarWidth) / 2.0001);position:relative;transform:translate(-50vw);width:100vw;width:calc(100vw - var(--scrollbarWidth));padding-left:var(--gutter);padding-right:var(--gutter);flex-wrap:nowrap;overflow-x:scroll;scroll-snap-type:x mandatory;scroll-padding:var(--gutter);-webkit-overflow-scrolling:touch}.o-grid--swipeable>*{flex:0 0 auto;max-width:23em;width:calc(85vw - var(--gutter) * 2.333);scroll-snap-align:start;scroll-snap-stop:always}.o-grid--swipeable>*+*{margin-left:var(--gutter)!important}}@media (max-width: 55em){.o-grid--float:not([class*=switch])>:nth-child(2n+1),.o-grid--float[class*=switch]>:nth-child(2n+2),.o-grid--float:not([class*=switch])>:nth-child(2n+2),.o-grid--float[class*=switch]>:nth-child(2n+1){position:static}}@media (min-width: 55em){.o-grid--4\/7>:nth-child(2n+2),.o-grid--4\/7-switch>:nth-child(2n+2){width:57.1428571429%}.o-grid--9\/3>:nth-child(2n+1),.o-grid--8\/3>:nth-child(2n+1),.o-grid--8\/4>:nth-child(2n+1),.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--4\/8>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--8\/4-switch>:nth-child(2n+2),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1),.o-grid--4\/8-switch>:nth-child(2n+1){width:65.7142857143%}.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--8\/4>:nth-child(2n+2),.o-grid--3\/9>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+1),.o-grid--4\/8>:nth-child(2n+1),.o-grid--4\/7>:nth-child(2n+1),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--8\/4-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+2),.o-grid--4\/8-switch>:nth-child(2n+2),.o-grid--4\/7-switch>:nth-child(2n+1){width:31.4285714286%}.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--4\/8>:nth-child(2n+2),.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--8\/4>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--8\/4-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1),.o-grid--4\/8-switch>:nth-child(2n+1){margin-left:2.8571428571%;margin-right:0}.o-grid--8\/3>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+1){max-width:828px}.o-grid[class*=switch]>:nth-child(2n+1){order:1}.o-grid--layout{margin-bottom:0}.o-grid--layout>:nth-last-child(1),.o-grid--layout>:nth-last-child(2){margin-bottom:0}.o-grid--push{justify-content:space-between}.o-grid--pull{justify-content:flex-start}.o-grid--float{display:block}.o-grid--float:not([class*=switch])>:nth-child(2n+1),.o-grid--float[class*=switch]>:nth-child(2n+2){float:left}.o-grid--float:not([class*=switch])>:nth-child(2n+2),.o-grid--float[class*=switch]>:nth-child(2n+1){float:right}}@media (min-width: 70em){.o-grid--9\/3>:nth-child(2n+1),.o-grid--8\/3>:nth-child(2n+1),.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1){width:74.2857142857%}.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--3\/9>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+1),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+2){width:22.8571428571%}}.c-library{display:grid;min-height:100vh;grid-template-rows:auto 1fr auto}.c-library--components{grid-template-rows:auto 1fr}.c-library__header{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);padding:9px;padding:var(--space-2xs);flex-direction:column;align-items:flex-start;background:#005461;color:#fff;font-weight:700}@media only screen and (min-width: 650px){.c-library__header{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2);flex-direction:row;align-items:center}}@media only screen and (min-width: 1000px){.c-library__header{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);padding:18px;padding:var(--space-s) var(--space-s-l)}}.c-library__header img{filter:saturate(0) brightness(10)}.c-library__header .c-library-page-active{position:relative}.c-library__header .c-library-page-active:after{content:"";position:absolute;left:0;width:100%;bottom:-6px;border-bottom:1px solid}.c-library__hero{color:#fff;background:linear-gradient(#005461,transparent),linear-gradient(45deg,#00A2C2,#005461)}.c-library__body{display:grid;grid-template-rows:auto auto}@media only screen and (min-width: 600px){.c-library__body{grid-template-columns:10em 1fr}}@media only screen and (min-width: 800px){.c-library__body{grid-template-columns:17em 1fr}}@media only screen and (min-width: 600px){.c-library--components .c-library__body>*{overflow-y:auto;height:calc(100vh - var(--headerHeight) - 1px)}}.c-library__sidebar{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2);border-right:1px solid #EBF1F2;grid-row:-1;scroll-behavior:none}@media only screen and (min-width: 600px){.c-library__sidebar{grid-row:auto}}@media only screen and (min-width: 800px){.c-library__sidebar{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1)}}.c-library__sidebar>*{padding:18px;padding:var(--space-s-l) var(--space-s) var(--space-s-l) var(--space-s-l)}.c-library__sidebar li{position:relative}.c-library__sidebar li a{color:#006daf}.c-library__sidebar li a:hover{text-decoration:underline;color:#006daf}.c-library__sidebar li+li{margin-top:13.5px;margin-top:var(--space-xs)}.c-library__sidebar ul ul{padding:13.5px;padding:var(--space-xs);padding-bottom:0}.c-library__sidebar ul ul li+li{margin-top:9px;margin-top:var(--space-2xs)}.c-library__skip-link{padding:13.5px;padding:var(--space-xs)}@media only screen and (min-width: 600px){.c-library__skip-link{display:none}}.c-library__logo{display:flex;align-items:center;justify-content:center;max-width:15%;min-width:100px}@media only screen and (min-width: 650px){.c-library__logo{justify-content:flex-start}}.c-library__logo-name{padding-left:13.5px;padding-left:var(--space-xs-s);margin-left:13.5px;margin-left:var(--space-xs-s);border-left:1px solid #3D7B87;white-space:nowrap}.c-library__logo-name span{display:block}.c-library__logo-name span:nth-last-child(3),.c-library__logo-name span:nth-last-child(1){text-transform:uppercase;letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);letter-spacing:.08em;color:#bfd3d6}.c-library__logo-name span:nth-last-child(2){color:#fff;letter-spacing:-.03em;font-size:37.32px;font-size:var(--step-4)}.has-js .c-library__sidebar ul>li>ul{display:none}.has-js .c-library__sidebar ul>.c-library-accordion-open>ul{display:block}.c-library .c-library-accordion-open>.c-library-accordion__toggle{transform:rotate(180deg)}.c-library .c-library-accordion__toggle{color:#006daf;line-height:1;font-size:1rem;position:absolute;right:0;top:0;display:flex;align-items:center;justify-content:center;padding:.25rem}.c-library-menu-active{font-weight:700;position:relative}.c-library-menu-active:before{content:"\25b8\2002";position:absolute;left:-17px;top:0}.c-library-stretch{display:flex;flex-direction:column;flex:1}.c-library__main{overflow-y:auto}@media only screen and (min-width: 600px){.c-library__main{overflow-y:scroll}}.c-library__frame{position:relative;width:100%}.c-library__frame-links{position:absolute;right:0;top:calc(-1 * (var(--space-m) + var(--space-s)));z-index:1}.c-library__frame-links a,.c-library__frame-links button{border-radius:0 0 .25em .25em;letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);padding:.25em .666em;background:#BFD3D6;color:#959595}.c-library__frame-background{border-radius:0 0 0 .25em;top:0}.c-library__frame-wrap{--width: "";height:100%;overflow:hidden;position:relative;resize:both}.c-library__frame-wrap:after{background:#EBF1F2;bottom:0;color:#3d7b87;counter-reset:width var(--width);content:counter(width);letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2);mix-blend-mode:multiply;padding:.5ch 1ch;position:absolute;right:0}.c-library__frame iframe{--negative-padding: calc(var(--space-m) * -1);height:100%;width:100%;width:calc(100% - var(--negative-padding) * 2);left:var(--negative-padding);top:var(--negative-padding);position:relative;transition:padding .3s cubic-bezier(.22,.61,.36,1),background-color .3s cubic-bezier(.22,.61,.36,1)}.c-library-code{font-family:Source Code Pro}.c-library-pre{overflow-x:auto;background:#EBF1F2;padding:18px;padding:var(--space-s);font-family:Source Code Pro;line-height:1.4}.c-library-pre--bordered{border-bottom:1px solid #BFD3D6}.c-library-version{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595}.c-library-status{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);padding:.25em .666em;border-radius:.25em;background:#BFD3D6;color:#959595}.c-library-status--ready{background:#13AA13;color:#fff}.c-library-status--in-production,.c-library-status--development,.c-library-status--placeholder{background:#F2A60D;color:#fff}.c-library-status--deprecated{background:#CE0058;color:#fff}.c-library__swatch-grid{display:grid;gap:0 1em;grid-auto-rows:minmax(4em,auto);margin-bottom:var(--space-m)}@media only screen and (min-width: 680px){.c-library__swatch-grid{gap:0;grid-template-columns:repeat(5,auto);grid-template-rows:5em auto}}.c-library__swatch-grid--has-labels{grid-auto-flow:row}@media only screen and (min-width: 40em){.c-library__swatch-grid--has-labels{grid-template-columns:minmax(15%,15em) auto;grid-template-rows:auto}}@media only screen and (min-width: 1000px){.c-library__swatch-grid--has-labels{grid-auto-flow:column;grid-template-columns:repeat(5,1fr);grid-template-rows:5em auto}}.c-library__swatches,.c-library__swatch-labels{display:grid;grid-template-columns:repeat(auto-fit,165px)}.c-library__swatch{display:flex}.c-library__swatch>*{justify-content:center;font-weight:700;margin:auto}.c-library__swatches>*{height:0;padding-bottom:50%;position:relative}.c-library__swatches>*>*{display:flex;justify-content:center;align-items:center;padding:.5rem;font-weight:700;text-align:center;position:absolute;height:100%;width:100%;left:0;top:0}.c-library__swatch-grid table{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}.c-library__swatch-grid table td,.c-library__swatch-grid table th{padding:9px 0 9px 4.5px;padding:var(--space-2xs) 0 var(--space-2xs) var(--space-3xs)}.c-library__swatch-grid table th{width:3em}.c-library__swatch-grid table td{font-family:monospace}.c-library__image-row{display:flex;max-width:100%}.c-library__image-row img{flex:1 1 auto;margin:0 2% 0 0;object-fit:contain;width:6%}.c-library__image-row img:last-child{margin-right:0}.c-library__space{display:block}.c-library__space span{background:linear-gradient(45deg,rgba(255,255,255,.2) 0%,rgba(255,255,255,0) 100%),rgba(206,0,88,.5);height:0;padding-bottom:100%;position:relative;display:block}.c-library__space code{position:absolute;line-height:1;left:100%;top:50%;margin-left:18px;margin-left:var(--space-s);white-space:nowrap;transform:translateY(-50%)}.c-library-grid{background:#00758c;padding:3rem 1rem;display:flex;justify-content:center;align-items:center;color:#fff;letter-spacing:-.01em;font-size:15px;font-size:var(--step--1)}.c-library-grid--alt{background:#3D7B87;padding:2rem 1rem}.c-library-grid--alt:before{content:"\a0";display:block}.c-library-grid--first{background:#005461;padding:2rem 1rem}.c-library-grid--first:before{content:"First on mobile"}.c-library-copy{position:relative}.c-library-copy__trigger{position:absolute;background:#BFD3D6;bottom:0;right:0;font-weight:700;letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);padding:4.5px 9px;padding:var(--space-3xs) var(--space-2xs);letter-spacing:.02em}.c-library-copy__trigger:hover{color:#ce0058}.c-library__typo__sidebar{width:14.2857142857%}.c-library__typo__sidebar span{display:block}.c-library__typo__sidebar .x2{margin-top:4.25em;border:1px solid #333333;border-width:1px 0;height:2em;line-height:2em}.c-library__typo__main{width:82.8571428571%}.c-library__semi{font-weight:600}.c-library__photo-grid{display:grid;gap:2px;grid-template-columns:1fr;margin-top:54px;margin-top:var(--space-xl)}@media only screen and (min-width: 880px){.c-library__photo-grid{grid-auto-flow:dense;grid-auto-rows:auto}.c-library__photo-grid img{height:100%;width:100%;object-fit:cover}.c-library__photo-grid div{grid-column:1/3;grid-row:1/2;display:flex}.c-library__photo-grid div h2{margin:auto var(--space-s)}.c-library__photo-grid.grid-1{grid-template-columns:40% 20% 40%;grid-template-rows:var(--space-2xl) 400px 400px}.c-library__photo-grid.grid-1 img:nth-child(2){grid-row:2/3;grid-column:1/3}.c-library__photo-grid.grid-1 img:nth-child(3){grid-column:3/4;grid-row:1/3}.c-library__photo-grid.grid-1 img:nth-child(5){grid-column:2/4}.c-library__photo-grid.grid-2{grid-template-columns:50% 50%;grid-template-rows:var(--space-2xl) 300px 300px}.c-library__photo-grid.grid-2 div{grid-column:1/2}.c-library__photo-grid.grid-2 img:nth-child(2){grid-row:2/4}.c-library__photo-grid.grid-2 img:nth-child(3){grid-row:1/3}}.c-library__illustration-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--gutter)}.c-library__illustration-grid :nth-child(odd):nth-last-child(5){grid-column:1/-1}.c-library .c-alert ul li{list-style:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="20" viewBox="0 0 10 20"><circle cx="5" cy="14" r="3.5" fill="%2313AA13" fill-rule="evenodd"/></svg>') outside;margin-left:1em;padding-left:.5rem}.c-library .c-alert ul li h3,.c-library .c-alert ul li h4{line-height:1.6;font-size:1em;color:#13aa13}@media only screen and (max-width: 1050px){.c-library__logo-name span:nth-last-child(3),.c-library__logo-name span:nth-last-child(1){letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}.c-library__logo-name span:nth-last-child(2){letter-spacing:-.02em;font-size:21.6px;font-size:var(--step-1)}.c-library__header nav li:last-child{display:none}}@media only screen and (min-width: 650px) and (max-width: 700px),screen and (max-width: 450px){.c-library__header nav .u-row{gap:9px;gap:var(--space-2xs);letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}}@media only screen and (max-width: 650px){.c-library__header nav a{padding:9px 0;padding:var(--space-2xs) 0;display:block}.c-library__header .c-library-page-active:after{bottom:4.5px;bottom:var(--space-3xs)}}.u-resize{overflow:hidden;resize:both}