@layer components{.hero{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;margin-bottom:var(--size-lg);scroll-margin-top:var(--header-height);@media (max-width:639px){margin-bottom:var(--size-xxl)}}.hero__img-background{z-index:var(--z-bg);width:100%;height:max(40rem,calc(62dvh - var(--header-height)));object-fit:cover;@media (max-width:639px){height:60rem}}.hero__intro{position:absolute;bottom:calc(-1 * var(--size-lg));margin-inline:calc(var(--section-padding-inline) + var(--section-content-padding-inline));max-width:min(80rem,100dvw);padding-block:var(--size-md);padding-inline:calc(var(--size-md) * 5);border-radius:var(--size-md);background-color:var(--col-white);box-shadow:var(--shadow);display:flex;align-items:flex-start;gap:var(--size-md);@media (max-width:639px){flex-direction:column;align-items:center;padding-inline:var(--size-md);-webkit-padding-before:var(--size-lg);padding-block-start:var(--size-lg);gap:var(--size-sm);max-width:calc(100dvw - var(--size-md) * 2)}}.hero__intro-img{position:absolute;flex:none;width:unset;height:unset;filter:drop-shadow(var(--shadow-sm));@media (max-width:639px){position:unset}&.hero__intro-img--plumber{width:16rem;top:calc(-1 * var(--size-lg));left:calc(-1 * var(--size-lg));@media (max-width:639px){left:unset;margin-top:-24rem}&.jump{--amplitude:var(--size-lg)!important;animation:jump var(--transition-slow)!important}}&.hero__intro-img--since-98{width:10rem;top:calc(-1 * var(--size-md));right:calc(-1 * var(--size-md));@media (max-width:639px){margin-bottom:calc(-1 * var(--size-xl))}}}.hero__texts{display:flex;flex-direction:column;justify-content:center;text-align:center;gap:var(--size-xs)}.hero__text{color:color-mix(in srgb,var(--col-dark) 80%,transparent)}}@layer components{.anim-scroll__elem:has(.realisation){display:flex;@media (max-width:639px){align-self:stretch}}.realisation{flex:none;display:flex;color:var(--col-white);background-color:color-mix(in srgb,var(--col-dark),var(--col-white) 7.5%);box-shadow:0 0 var(--size-sm) var(--size-sm) var(--section-col-bg);border-radius:var(--size-md);transition:var(--transition);overflow:hidden;@media (max-width:639px){flex-direction:column}@media (min-width:640px){&:not(.realisation--current){--img-width:20rem;--img-height:20rem;cursor:pointer;.realisation__texts-super-wrapper{width:0;padding-inline:0}.realisation__texts-wrapper{opacity:0}}}&.realisation--current{.realisation__image-wrapper{@media (min-width:640px){border-top-right-radius:0;border-bottom-right-radius:0}@media (max-width:639px){border-bottom-left-radius:0;border-bottom-right-radius:0}}}}.realisation__image-wrapper,.realisation__texts-super-wrapper,.realisation__texts-wrapper{transition:var(--transition-slow)}.realisation__image-wrapper{width:var(--img-width);height:var(--img-height);border-radius:var(--size-md);overflow:hidden;position:relative;img{width:100%;height:100%;object-fit:cover;object-position:center}}.realisation__image-button{position:absolute;z-index:1;inset-block-end:var(--size-sm);inset-inline-end:var(--size-sm);transition:var(--transition);width:var(--size-md);height:var(--size-md);display:grid;place-content:center;&:after{inset:calc(-1 * var(--size-lg))}&:after,&:before{content:"";position:absolute}&:before{pointer-events:none;z-index:-1;inset:calc(-1 * var(--size-xl));-webkit-backdrop-filter:blur(.5rem);backdrop-filter:blur(.5rem);background-color:rgba(from black r g b/25%);-webkit-mask-image:radial-gradient(circle closest-side at center,black 15%,transparent);mask-image:radial-gradient(circle closest-side at center,black 15%,transparent);transition:var(--transition);opacity:0}&:is(.realisation__image-wrapper:hover :not(:hover)):before{opacity:.8}&:hover:before{opacity:1}@media (max-width:639px){display:none}.realisation__image-button-icon-corners{--size:var(--size-xxxs);--width:calc(var(--size-xxs) / 2);display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);grid-gap:calc(var(--size) * 2);gap:calc(var(--size) * 2);opacity:0;transition:var(--transition);&:is(.realisation__image-wrapper:hover *){opacity:.62}&:is(.realisation__image-button:hover *){opacity:1;gap:calc(var(--size) * 3)}}.realisation__image-button-icon-corner{width:calc(var(--size) * 2);height:calc(var(--size) * 2);border:var(--width) solid var(--col-white);&:first-child{-webkit-border-after:none;border-block-end:none;-webkit-border-end:none;border-inline-end:none}&:nth-child(2){-webkit-border-after:none;border-block-end:none;-webkit-border-start:none;border-inline-start:none}&:nth-child(3){-webkit-border-before:none;border-block-start:none;-webkit-border-end:none;border-inline-end:none}&:nth-child(4){-webkit-border-before:none;border-block-start:none;-webkit-border-start:none;border-inline-start:none}}}.realisation__texts-super-wrapper{width:var(--texts-width);overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-items:center}.realisation__texts-wrapper{flex:none;width:var(--texts-width);height:var(--img-height);justify-content:center;padding:var(--size-lg);-webkit-padding-end:calc(var(--size-md) + var(--interactive-height-xl) / 2);padding-inline-end:calc(var(--size-md) + var(--interactive-height-xl) / 2);display:flex;flex-direction:column;gap:var(--size-xxs);overflow:hidden;@media (max-width:639px){height:unset}}}@layer components{.section.section--realisations{--section-col-bg:var(--col-dark);--img-base-height:min(60rem,calc(100dvh - var(--header-height) - var(--size-lg) * 2));--img-base-width:calc(var(--img-height) * 3/4);--img-height:var(--img-base-height);--img-width:var(--img-base-width);--texts-width:max(calc(var(--img-base-width) * 8/12),25rem);--realisations-padding:calc(50dvw - (var(--texts-width) + var(--img-width)) / 2);--mobile-max-size:calc(100dvw - (var(--section-padding-inline) + var(--section-content-padding-inline)) * 2);padding-inline:unset;@media (max-width:767px){--img-base-width:calc(var(--mobile-max-size) * 3/5);--texts-width:calc(var(--mobile-max-size) * 2/5)}@media (max-width:639px){--img-base-width:var(--mobile-max-size);--img-base-height:var(--mobile-max-size);--texts-width:var(--mobile-max-size);--realisations-padding:calc(var(--section-padding-inline) + var(--section-content-padding-inline))}&:after,&:before{z-index:-1}&:after{content:"";position:absolute;inset:0;background-image:url(/images/pattern-white.svg);background-attachment:fixed;background-size:50rem;background-position:50%;opacity:8.5%}.pipe-title{--pipe-title-text-col:var(--col-white);@media (min-width:640px){left:calc(var(--realisations-padding) - var(--section-content-padding-inline) - var(--size-xxs))}@media (max-width:639px){left:calc(var(--section-padding-inline) - var(--section-content-padding-inline))}}.section__content{max-width:unset;padding-inline:unset}}}@layer components{.realisations{padding-inline:var(--realisations-padding);display:flex;gap:var(--size-xl);align-items:center;overflow-x:auto;-ms-overflow-style:none;scrollbar-width:none;::-webkit-scrollbar{display:none}@media (max-width:639px){height:unset}@media (min-width:640px){height:calc(var(--img-height) + var(--size-xxl) * 2);margin-block:calc(-1 * var(--size-xxl))}}.realisations__nav{--inset-nav:calc(var(--realisations-padding) - var(--interactive-height-xl) / 2);position:absolute;inset-inline-start:var(--inset-nav);inset-inline-end:calc(var(--inset-nav) - var(--scrollbar-width));display:flex;justify-content:space-between;pointer-events:none;.button{pointer-events:all}@media (max-width:639px){--inset-nav:var(--size-xs)}}}