wip #5941 @0:05 correctifs css, retours client

diff --git a/app.css b/app.css
index ebb8da6ee9d56aaa28f9a6d5e13ac9f1d8642663..f0b846a9292cc04a824391f272542866e41393d1 100644 (file)
--- a/app.css
+++ b/app.css
@@ -164,7 +164,7 @@ a {
     width: 0;
   }
   100% {
-    width: 110%;
+    width: 100%;
   }
 }
 @keyframes line-second {
@@ -497,7 +497,7 @@ b {
 }
 .app-banner .video-container:before, .app-banner .video-container:after {
   content: "";
-  height: 1px;
+  height: 2px;
   background-color: #ffffff;
   position: absolute;
   bottom: 29%;
@@ -505,7 +505,7 @@ b {
 }
 .app-banner .video-container:before {
   width: 93%;
-  left: -127%;
+  left: -117%;
 }
 @media screen and (min-width: 1024px) {
   .app-banner .video-container:before {
@@ -579,7 +579,7 @@ b {
 .app-intro .line:before {
   content: "";
   width: 0;
-  height: 1px;
+  height: 2px;
   background-color: #ffffff;
   position: absolute;
   z-index: -1;

diff --git a/app.min.css b/app.min.css
index 3c9817dbb56301d88e29f67ada61ae730e16a6a8..9601d63fdbace64bf95723fdf67b137f150c4e40 100644 (file)
--- a/app.min.css
+++ b/app.min.css
@@ -1 +1 @@
-@charset "UTF-8";a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:none}table{border-collapse:collapse;border-spacing:0}a{text-decoration:none}@font-face{font-family:"Maison Neue Book";src:url("assets/fonts/MaisonNeue-Book.woff2") format("woff2"),url("assets/fonts/MaisonNeue-Book.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:"Maison Neue";src:url("assets/fonts/MaisonNeue-Bold.woff2") format("woff2"),url("assets/fonts/MaisonNeue-Bold.woff") format("woff");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:"Maison Neue Book";src:url("assets/fonts/MaisonNeue-BookItalic.woff2") format("woff2"),url("assets/fonts/MaisonNeue-BookItalic.woff") format("woff");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:"Maison Neue";src:url("assets/fonts/MaisonNeue-Medium.woff2") format("woff2"),url("assets/fonts/MaisonNeue-Medium.woff") format("woff");font-weight:500;font-style:normal;font-display:swap}:root{--space-3xs:clamp(0.25rem, calc(0.25rem + 0.00vw), 0.25rem);--space-2xs:clamp(0.50rem, calc(0.50rem + 0.00vw), 0.50rem);--space-xs:clamp(0.75rem, calc(0.75rem + 0.00vw), 0.75rem);--space-s:clamp(1.00rem, calc(1.00rem + 0.00vw), 1.00rem);--space-m:clamp(1.50rem, calc(1.50rem + 0.00vw), 1.50rem);--space-l:clamp(2.25rem, calc(2.25rem + 0.00vw), 2.25rem);--space-xl:clamp(3.00rem, calc(3.00rem + 0.00vw), 3.00rem);--space-2xl:clamp(4.00rem, calc(4.00rem + 0.00vw), 4.00rem);--space-3xl:clamp(5.25rem, calc(5.25rem + 0.00vw), 5.25rem);--space-4xl:clamp(6.00rem, calc(6.00rem + 0.00vw), 6.00rem);--space-3xs-2xs:clamp(0.25rem, calc(0.18rem + 0.30vw), 0.50rem);--space-2xs-xs:clamp(0.50rem, calc(0.43rem + 0.30vw), 0.75rem);--space-xs-s:clamp(0.75rem, calc(0.68rem + 0.30vw), 1.00rem);--space-s-m:clamp(1.00rem, calc(0.86rem + 0.61vw), 1.50rem);--space-m-l:clamp(1.50rem, calc(1.30rem + 0.91vw), 2.25rem);--space-l-xl:clamp(2.25rem, calc(2.05rem + 0.91vw), 3.00rem);--space-xl-2xl:clamp(3.00rem, calc(2.73rem + 1.21vw), 4.00rem);--space-2xl-3xl:clamp(4.00rem, calc(3.66rem + 1.52vw), 5.25rem);--space-3xl-4xl:clamp(5.25rem, calc(5.05rem + 0.91vw), 6.00rem);--space-l-xl-custom:clamp(2.00rem, calc(1.73rem + 1.21vw), 3.00rem);--space-l-3xl:clamp(2.25rem, calc(1.43rem + 3.64vw), 5.25rem);--space-2xl-5xl:clamp(3.38rem, calc(0.03rem + 14.85vw), 15.63rem);--space-4xs-6xl:clamp(2.25rem, calc(-2.86rem + 12.73vw), 10.50rem);--space-xl-6xl:clamp(3.00rem, calc(0.95rem + 9.09vw), 10.50rem);--space-3xs-9xl:clamp(0.25rem, calc(-2.20rem + 10.91vw), 9.25rem);--space-m-xl:clamp(1.50rem, calc(1.09rem + 1.82vw), 3.00rem);--space-custom-title-1:clamp(3.94rem, calc(2.91rem + 4.55vw), 7.69rem);--space-custom-title-3:clamp(0.25rem, calc(-2.20rem + 10.91vw), 9.25rem);--step--2:clamp(0.64rem, calc(0.71rem + -0.07vw), 0.69rem);--step--1:clamp(0.80rem, calc(0.84rem + -0.04vw), 0.83rem);--step-0:clamp(1.00rem, calc(1.00rem + 0.00vw), 1.00rem);--step-1:clamp(1.20rem, calc(1.19rem + 0.06vw), 1.25rem);--step-2:clamp(1.44rem, calc(1.41rem + 0.15vw), 1.56rem);--step-3:clamp(1.73rem, calc(1.67rem + 0.27vw), 1.95rem);--step-4:clamp(2.07rem, calc(1.97rem + 0.45vw), 2.44rem);--step-5:clamp(2.49rem, calc(2.33rem + 0.68vw), 3.05rem);--step-7:clamp(3.58rem, calc(3.26rem + 1.44vw), 4.77rem);--step-10:clamp(3.00rem, calc(0.65rem + 10.45vw), 11.63rem)}@keyframes line-first{0%{width:0}100%{width:110%}}@keyframes line-second{0%{width:0}100%{width:100vw}}@keyframes overlay{0%{width:100%}100%{width:0}}body{background-color:#07090a;font-family:"Maison Neue Book",sans-serif;color:#fff;line-height:1.25;overflow-x:hidden;scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.bg-blue{background-color:#0a7dff}.color-blue{color:#0a7dff}.italic{font-style:italic}.container{width:100%;margin:0 auto}@media screen and (min-width:1680px){.container{width:100%;max-width:1680px}}.container:not(.full){padding:0 var(--space-l-3xl);box-sizing:border-box}.grid{display:grid;gap:32px}@media screen and (min-width:1024px){.grid{grid-template-columns:repeat(2,1fr)}}.grid .grid{grid-template-columns:repeat(1,1fr)}@media screen and (min-width:1024px){.grid .grid{grid-template-columns:repeat(1,1fr)}}@media screen and (min-width:1344px){.grid .grid{grid-template-columns:repeat(2,1fr)}}.grid-item{overflow:hidden}@media screen and (min-width:1024px){.grid-item{width:100%}}@media screen and (min-width:1024px){.grid-reverse .grid-item:first-child{grid-column:2;grid-row:1}.grid-reverse .grid-item:nth-child(2){grid-column:1;grid-row:1}}@media screen and (min-width:1024px){.grid-reverse .grid{margin-left:calc(var(--space-3xs-9xl) - 32px)!important}}.gap-xl{gap:0 var(--space-3xs-9xl)}.flex{display:flex}.justify-between{justify-content:space-between}.align-center{align-items:center}.wrap{flex-wrap:wrap}@media screen and (min-width:1680px){body>.app-section{margin-top:var(--space-4xs-6xl)}}@media screen and (min-width:1680px){body>.app-section~.app-section{margin-top:0}}.border-title{width:100%;font-size:var(--step-3);margin-bottom:var(--space-l-xl-custom);padding:18px 0;position:relative}@media screen and (max-width:1680px){.border-title{margin-top:var(--space-xl-6xl)}}.border-title.active:after,.border-title.active:before{width:100%}.border-title:after,.border-title:before{content:"";position:absolute;width:0;height:1px;background-color:#0a7dff;left:0;transition:width cubic-bezier(.82, 0, .65, .93) .9s}.border-title:before{top:0}.border-title:after{bottom:0}.text-center{text-align:center}.text-right{text-align:right}.text-md{font-size:var(--step-2)}.text-xl{font-size:var(--step-7)}.font-neue{font-family:"Maison Neue",sans-serif}.font-book{font-family:"Maison Neue Book",sans-serif}b{font-weight:700}@media screen and (min-width:1024px){.max-content{width:-moz-max-content;width:max-content}}.relative{position:relative}.app-header{padding-top:var(--space-l-xl);padding-bottom:100px}@media screen and (max-width:1024px){.app-header{padding-bottom:288px}}.app-header .logo{position:relative;z-index:1;max-width:100px;display:inline-block}@media screen and (min-width:1024px){.app-header .logo{max-width:160px}}.app-header .logo img{width:100%}.app-header .video-container-mobile{width:288px;height:288px;position:absolute;top:0;right:0}@media screen and (min-width:1024px){.app-header .video-container-mobile{display:none}}.app-header .video-container-mobile svg,.app-header .video-container-mobile video{position:absolute;width:100%}.app-header .video-container-mobile video{height:100%;-o-object-fit:cover;object-fit:cover}.app-banner{overflow:hidden;padding-bottom:169px}.app-banner .container{box-sizing:border-box;padding:0 var(--space-l-3xl)}.app-banner p{font-size:var(--step-10);position:relative}.app-banner p.first{padding-left:var(--space-custom-title-1)}.app-banner p.second{width:-moz-max-content;width:max-content;position:relative}@media screen and (min-width:1024px){.app-banner p.second:after{display:none}}.app-banner p.second:after{content:"";width:0;position:absolute;height:1px;left:calc(100% + 24px);background-color:#fff;top:45%;animation-name:line-second;animation-timing-function:cubic-bezier(0.82,0,0.65,0.93);animation-fill-mode:forwards;animation-duration:.8s}@media screen and (min-width:768px){.app-banner p.third{padding-left:var(--space-custom-title-3)}}@media screen and (max-width:768px){.app-banner .last-phrase{flex-direction:column-reverse;padding-left:var(--space-custom-title-3)}}.app-banner span{font-size:var(--step-3);transform:translateY(25%)}@media screen and (max-width:1024px){.app-banner span{width:100%;max-width:200px;font-size:18px}}@media screen and (max-width:768px){.app-banner span{font-size:16px}}.app-banner .video-container{height:0;padding-bottom:24.52%;width:24.52%;position:absolute;top:2.2vw;right:var(--space-l-3xl);display:none}@media screen and (min-width:1024px){.app-banner .video-container{display:block}}@media screen and (min-width:1680px){.app-banner .video-container{right:145px}}.app-banner .video-container:after,.app-banner .video-container:before{content:"";height:1px;background-color:#fff;position:absolute;bottom:29%;z-index:4}.app-banner .video-container:before{width:93%;left:-127%}@media screen and (min-width:1024px){.app-banner .video-container:before{animation-name:line-first;animation-timing-function:cubic-bezier(0.82,0,0.65,0.93);animation-fill-mode:forwards;animation-duration:.8s}}@media screen and (min-width:1680px){.app-banner .video-container:before{width:0}}.app-banner .video-container:after{width:100vw;left:80%}@media screen and (min-width:1024px){.app-banner .video-container:after{width:0;animation-name:line-second;animation-timing-function:ease-out;animation-fill-mode:forwards;animation-delay:1s;animation-duration:1s}}.app-banner .video-container .overlay{position:absolute;width:100%;height:100%;top:0;right:0;background:#0a7dff;z-index:3;transform:skewX(-35deg);animation-name:overlay;animation-fill-mode:forwards;animation-duration:.8s;animation-delay:.7s}.app-banner .video-container svg,.app-banner .video-container video{position:absolute;width:100%}.app-banner .video-container video{height:100%;-o-object-fit:cover;object-fit:cover}.app-intro{padding:var(--space-2xl-5xl) 0;position:relative;overflow:hidden}@media screen and (min-width:768px){.app-intro{font-size:var(--step-4)}}.app-intro.active .line:before{animation-fill-mode:forwards;animation-timing-function:cubic-bezier(0.6,0,0.3,1);animation-duration:.75s;animation-name:line-second}.app-intro .line{position:relative}.app-intro .line:before{content:"";width:0;height:1px;background-color:#fff;position:absolute;z-index:-1;left:calc((-100vw + 100%)/ 2);top:.5ch}.app-intro .container{position:relative;z-index:1;padding:0 var(--space-2xl-5xl);box-sizing:border-box}.app-intro .container:after,.app-intro .container:before{content:"";width:calc(100% + 84px);position:absolute;height:100%;background-color:#0a7dff}.app-intro .container:before{content:"";width:78%;height:100%;position:absolute;left:50%;transform:translateX(-50%)}.app-intro .container:after{height:0}.app-section{margin-bottom:var(--space-4xs-6xl)}.app-section .image{height:0;padding-bottom:100%;margin-bottom:36px;position:relative}@media screen and (min-width:1024px){.app-section .image{padding-bottom:0;position:sticky;height:80vh;top:0}}@media screen and (min-width:1680px){.app-section .image{height:72vh;top:15vh}}.app-section .image img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;position:absolute;-o-object-position:0 25%;object-position:0 25%}.app-section .text{width:100%;max-width:85%;margin:auto}@media screen and (min-width:1024px){.app-section .text{margin:initial}}@media screen and (min-width:1680px){.app-section .text{width:90%}}.app-section .content p:not(:last-of-type){margin:0 0 1.73rem}.app-section .content h3{margin-bottom:1rem}.app-section .signature{margin-top:32px}.app-section .signature.pp img{max-width:80px}.app-section .signature.fp img{max-width:60px}.app-section .signature img{flex-shrink:0}.app-section .signature p{font-size:12px}.app-footer .block{width:100%;height:0;padding-bottom:100%;background-repeat:no-repeat;background-size:cover;background-position:0 50%;position:relative;overflow:hidden}@media screen and (min-width:1024px){.app-footer .block{width:50%;height:100vh;padding:0}.app-footer .block:hover img{transform:scale(1.05)}}.app-footer .block *{color:#fff}.app-footer img{position:absolute;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;left:0;top:0;-o-object-position:left center;object-position:left center;transition:all .5s cubic-bezier(.19, 1, .22, 1)}.app-footer .text{padding:var(--space-xl-6xl) 0;position:relative;z-index:2}.app-footer .title{margin-bottom:var(--space-m-xl)}.app-footer .subtitle{font-size:25px;margin-bottom:var(--space-l-xl)}.app-footer .link-block{display:inline-block;width:100%;height:100%}.app-footer .link{color:#fff;font-size:var(--step-4)}.app-footer .link svg{margin-left:18px}
\ No newline at end of file
+@charset "UTF-8";a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:none}table{border-collapse:collapse;border-spacing:0}a{text-decoration:none}@font-face{font-family:"Maison Neue Book";src:url("assets/fonts/MaisonNeue-Book.woff2") format("woff2"),url("assets/fonts/MaisonNeue-Book.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:"Maison Neue";src:url("assets/fonts/MaisonNeue-Bold.woff2") format("woff2"),url("assets/fonts/MaisonNeue-Bold.woff") format("woff");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:"Maison Neue Book";src:url("assets/fonts/MaisonNeue-BookItalic.woff2") format("woff2"),url("assets/fonts/MaisonNeue-BookItalic.woff") format("woff");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:"Maison Neue";src:url("assets/fonts/MaisonNeue-Medium.woff2") format("woff2"),url("assets/fonts/MaisonNeue-Medium.woff") format("woff");font-weight:500;font-style:normal;font-display:swap}:root{--space-3xs:clamp(0.25rem, calc(0.25rem + 0.00vw), 0.25rem);--space-2xs:clamp(0.50rem, calc(0.50rem + 0.00vw), 0.50rem);--space-xs:clamp(0.75rem, calc(0.75rem + 0.00vw), 0.75rem);--space-s:clamp(1.00rem, calc(1.00rem + 0.00vw), 1.00rem);--space-m:clamp(1.50rem, calc(1.50rem + 0.00vw), 1.50rem);--space-l:clamp(2.25rem, calc(2.25rem + 0.00vw), 2.25rem);--space-xl:clamp(3.00rem, calc(3.00rem + 0.00vw), 3.00rem);--space-2xl:clamp(4.00rem, calc(4.00rem + 0.00vw), 4.00rem);--space-3xl:clamp(5.25rem, calc(5.25rem + 0.00vw), 5.25rem);--space-4xl:clamp(6.00rem, calc(6.00rem + 0.00vw), 6.00rem);--space-3xs-2xs:clamp(0.25rem, calc(0.18rem + 0.30vw), 0.50rem);--space-2xs-xs:clamp(0.50rem, calc(0.43rem + 0.30vw), 0.75rem);--space-xs-s:clamp(0.75rem, calc(0.68rem + 0.30vw), 1.00rem);--space-s-m:clamp(1.00rem, calc(0.86rem + 0.61vw), 1.50rem);--space-m-l:clamp(1.50rem, calc(1.30rem + 0.91vw), 2.25rem);--space-l-xl:clamp(2.25rem, calc(2.05rem + 0.91vw), 3.00rem);--space-xl-2xl:clamp(3.00rem, calc(2.73rem + 1.21vw), 4.00rem);--space-2xl-3xl:clamp(4.00rem, calc(3.66rem + 1.52vw), 5.25rem);--space-3xl-4xl:clamp(5.25rem, calc(5.05rem + 0.91vw), 6.00rem);--space-l-xl-custom:clamp(2.00rem, calc(1.73rem + 1.21vw), 3.00rem);--space-l-3xl:clamp(2.25rem, calc(1.43rem + 3.64vw), 5.25rem);--space-2xl-5xl:clamp(3.38rem, calc(0.03rem + 14.85vw), 15.63rem);--space-4xs-6xl:clamp(2.25rem, calc(-2.86rem + 12.73vw), 10.50rem);--space-xl-6xl:clamp(3.00rem, calc(0.95rem + 9.09vw), 10.50rem);--space-3xs-9xl:clamp(0.25rem, calc(-2.20rem + 10.91vw), 9.25rem);--space-m-xl:clamp(1.50rem, calc(1.09rem + 1.82vw), 3.00rem);--space-custom-title-1:clamp(3.94rem, calc(2.91rem + 4.55vw), 7.69rem);--space-custom-title-3:clamp(0.25rem, calc(-2.20rem + 10.91vw), 9.25rem);--step--2:clamp(0.64rem, calc(0.71rem + -0.07vw), 0.69rem);--step--1:clamp(0.80rem, calc(0.84rem + -0.04vw), 0.83rem);--step-0:clamp(1.00rem, calc(1.00rem + 0.00vw), 1.00rem);--step-1:clamp(1.20rem, calc(1.19rem + 0.06vw), 1.25rem);--step-2:clamp(1.44rem, calc(1.41rem + 0.15vw), 1.56rem);--step-3:clamp(1.73rem, calc(1.67rem + 0.27vw), 1.95rem);--step-4:clamp(2.07rem, calc(1.97rem + 0.45vw), 2.44rem);--step-5:clamp(2.49rem, calc(2.33rem + 0.68vw), 3.05rem);--step-7:clamp(3.58rem, calc(3.26rem + 1.44vw), 4.77rem);--step-10:clamp(3.00rem, calc(0.65rem + 10.45vw), 11.63rem)}@keyframes line-first{0%{width:0}100%{width:100%}}@keyframes line-second{0%{width:0}100%{width:100vw}}@keyframes overlay{0%{width:100%}100%{width:0}}body{background-color:#07090a;font-family:"Maison Neue Book",sans-serif;color:#fff;line-height:1.25;overflow-x:hidden;scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.bg-blue{background-color:#0a7dff}.color-blue{color:#0a7dff}.italic{font-style:italic}.container{width:100%;margin:0 auto}@media screen and (min-width:1680px){.container{width:100%;max-width:1680px}}.container:not(.full){padding:0 var(--space-l-3xl);box-sizing:border-box}.grid{display:grid;gap:32px}@media screen and (min-width:1024px){.grid{grid-template-columns:repeat(2,1fr)}}.grid .grid{grid-template-columns:repeat(1,1fr)}@media screen and (min-width:1024px){.grid .grid{grid-template-columns:repeat(1,1fr)}}@media screen and (min-width:1344px){.grid .grid{grid-template-columns:repeat(2,1fr)}}.grid-item{overflow:hidden}@media screen and (min-width:1024px){.grid-item{width:100%}}@media screen and (min-width:1024px){.grid-reverse .grid-item:first-child{grid-column:2;grid-row:1}.grid-reverse .grid-item:nth-child(2){grid-column:1;grid-row:1}}@media screen and (min-width:1024px){.grid-reverse .grid{margin-left:calc(var(--space-3xs-9xl) - 32px)!important}}.gap-xl{gap:0 var(--space-3xs-9xl)}.flex{display:flex}.justify-between{justify-content:space-between}.align-center{align-items:center}.wrap{flex-wrap:wrap}@media screen and (min-width:1680px){body>.app-section{margin-top:var(--space-4xs-6xl)}}@media screen and (min-width:1680px){body>.app-section~.app-section{margin-top:0}}.border-title{width:100%;font-size:var(--step-3);margin-bottom:var(--space-l-xl-custom);padding:18px 0;position:relative}@media screen and (max-width:1680px){.border-title{margin-top:var(--space-xl-6xl)}}.border-title.active:after,.border-title.active:before{width:100%}.border-title:after,.border-title:before{content:"";position:absolute;width:0;height:1px;background-color:#0a7dff;left:0;transition:width cubic-bezier(.82, 0, .65, .93) .9s}.border-title:before{top:0}.border-title:after{bottom:0}.text-center{text-align:center}.text-right{text-align:right}.text-md{font-size:var(--step-2)}.text-xl{font-size:var(--step-7)}.font-neue{font-family:"Maison Neue",sans-serif}.font-book{font-family:"Maison Neue Book",sans-serif}b{font-weight:700}@media screen and (min-width:1024px){.max-content{width:-moz-max-content;width:max-content}}.relative{position:relative}.app-header{padding-top:var(--space-l-xl);padding-bottom:100px}@media screen and (max-width:1024px){.app-header{padding-bottom:288px}}.app-header .logo{position:relative;z-index:1;max-width:100px;display:inline-block}@media screen and (min-width:1024px){.app-header .logo{max-width:160px}}.app-header .logo img{width:100%}.app-header .video-container-mobile{width:288px;height:288px;position:absolute;top:0;right:0}@media screen and (min-width:1024px){.app-header .video-container-mobile{display:none}}.app-header .video-container-mobile svg,.app-header .video-container-mobile video{position:absolute;width:100%}.app-header .video-container-mobile video{height:100%;-o-object-fit:cover;object-fit:cover}.app-banner{overflow:hidden;padding-bottom:169px}.app-banner .container{box-sizing:border-box;padding:0 var(--space-l-3xl)}.app-banner p{font-size:var(--step-10);position:relative}.app-banner p.first{padding-left:var(--space-custom-title-1)}.app-banner p.second{width:-moz-max-content;width:max-content;position:relative}@media screen and (min-width:1024px){.app-banner p.second:after{display:none}}.app-banner p.second:after{content:"";width:0;position:absolute;height:1px;left:calc(100% + 24px);background-color:#fff;top:45%;animation-name:line-second;animation-timing-function:cubic-bezier(0.82,0,0.65,0.93);animation-fill-mode:forwards;animation-duration:.8s}@media screen and (min-width:768px){.app-banner p.third{padding-left:var(--space-custom-title-3)}}@media screen and (max-width:768px){.app-banner .last-phrase{flex-direction:column-reverse;padding-left:var(--space-custom-title-3)}}.app-banner span{font-size:var(--step-3);transform:translateY(25%)}@media screen and (max-width:1024px){.app-banner span{width:100%;max-width:200px;font-size:18px}}@media screen and (max-width:768px){.app-banner span{font-size:16px}}.app-banner .video-container{height:0;padding-bottom:24.52%;width:24.52%;position:absolute;top:2.2vw;right:var(--space-l-3xl);display:none}@media screen and (min-width:1024px){.app-banner .video-container{display:block}}@media screen and (min-width:1680px){.app-banner .video-container{right:145px}}.app-banner .video-container:after,.app-banner .video-container:before{content:"";height:2px;background-color:#fff;position:absolute;bottom:29%;z-index:4}.app-banner .video-container:before{width:93%;left:-117%}@media screen and (min-width:1024px){.app-banner .video-container:before{animation-name:line-first;animation-timing-function:cubic-bezier(0.82,0,0.65,0.93);animation-fill-mode:forwards;animation-duration:.8s}}@media screen and (min-width:1680px){.app-banner .video-container:before{width:0}}.app-banner .video-container:after{width:100vw;left:80%}@media screen and (min-width:1024px){.app-banner .video-container:after{width:0;animation-name:line-second;animation-timing-function:ease-out;animation-fill-mode:forwards;animation-delay:1s;animation-duration:1s}}.app-banner .video-container .overlay{position:absolute;width:100%;height:100%;top:0;right:0;background:#0a7dff;z-index:3;transform:skewX(-35deg);animation-name:overlay;animation-fill-mode:forwards;animation-duration:.8s;animation-delay:.7s}.app-banner .video-container svg,.app-banner .video-container video{position:absolute;width:100%}.app-banner .video-container video{height:100%;-o-object-fit:cover;object-fit:cover}.app-intro{padding:var(--space-2xl-5xl) 0;position:relative;overflow:hidden}@media screen and (min-width:768px){.app-intro{font-size:var(--step-4)}}.app-intro.active .line:before{animation-fill-mode:forwards;animation-timing-function:cubic-bezier(0.6,0,0.3,1);animation-duration:.75s;animation-name:line-second}.app-intro .line{position:relative}.app-intro .line:before{content:"";width:0;height:2px;background-color:#fff;position:absolute;z-index:-1;left:calc((-100vw + 100%)/ 2);top:.5ch}.app-intro .container{position:relative;z-index:1;padding:0 var(--space-2xl-5xl);box-sizing:border-box}.app-intro .container:after,.app-intro .container:before{content:"";width:calc(100% + 84px);position:absolute;height:100%;background-color:#0a7dff}.app-intro .container:before{content:"";width:78%;height:100%;position:absolute;left:50%;transform:translateX(-50%)}.app-intro .container:after{height:0}.app-section{margin-bottom:var(--space-4xs-6xl)}.app-section .image{height:0;padding-bottom:100%;margin-bottom:36px;position:relative}@media screen and (min-width:1024px){.app-section .image{padding-bottom:0;position:sticky;height:80vh;top:0}}@media screen and (min-width:1680px){.app-section .image{height:72vh;top:15vh}}.app-section .image img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;position:absolute;-o-object-position:0 25%;object-position:0 25%}.app-section .text{width:100%;max-width:85%;margin:auto}@media screen and (min-width:1024px){.app-section .text{margin:initial}}@media screen and (min-width:1680px){.app-section .text{width:90%}}.app-section .content p:not(:last-of-type){margin:0 0 1.73rem}.app-section .content h3{margin-bottom:1rem}.app-section .signature{margin-top:32px}.app-section .signature.pp img{max-width:80px}.app-section .signature.fp img{max-width:60px}.app-section .signature img{flex-shrink:0}.app-section .signature p{font-size:12px}.app-footer .block{width:100%;height:0;padding-bottom:100%;background-repeat:no-repeat;background-size:cover;background-position:0 50%;position:relative;overflow:hidden}@media screen and (min-width:1024px){.app-footer .block{width:50%;height:100vh;padding:0}.app-footer .block:hover img{transform:scale(1.05)}}.app-footer .block *{color:#fff}.app-footer img{position:absolute;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;left:0;top:0;-o-object-position:left center;object-position:left center;transition:all .5s cubic-bezier(.19, 1, .22, 1)}.app-footer .text{padding:var(--space-xl-6xl) 0;position:relative;z-index:2}.app-footer .title{margin-bottom:var(--space-m-xl)}.app-footer .subtitle{font-size:25px;margin-bottom:var(--space-l-xl)}.app-footer .link-block{display:inline-block;width:100%;height:100%}.app-footer .link{color:#fff;font-size:var(--step-4)}.app-footer .link svg{margin-left:18px}
\ No newline at end of file

diff --git a/index.html b/index.html
index 4c8c8193b3f8ed3bb93757e5d09fc15afeee5aa6..c6c9858b22c925560f9cfc176604ec001a7f4e08 100644 (file)
--- a/index.html
+++ b/index.html
@@ -20,7 +20,6 @@
 
                 if(y >= offset2)
                     el2.classList.add("active")
-
             })
         })
     </script>
@@ -215,7 +214,7 @@
             <div class="leftblock block">
                 <a class="link-block" href="./rapport-activites/index.html">
                     <div class="text text-center">
-                        <h2 class="title text-xl">Construire</h2>
+                        <h2 class="title text-xl">Construire.</h2>
                         <p class="subtitle">Rapport d'activités</p>
                         <div class="link">Entrez
                             <svg xmlns="http://www.w3.org/2000/svg" width="24.817" height="21.587" viewBox="0 0 24.817 21.587">
@@ -237,7 +236,7 @@
             <div class="rightblock block text-center">
                 <a class="link-block" href="./rapport-esg/index.html">
                     <div class="text text-center">
-                        <h2 class="title text-xl">Notre perspective</h2>
+                        <h2 class="title text-xl">Notre perspective.</h2>
                         <p class="subtitle">Rapport ESG</p>
                         <div class="link">Entrez
                             <svg xmlns="http://www.w3.org/2000/svg" width="24.817" height="21.587" viewBox="0 0 24.817 21.587">

diff --git a/output.css b/output.css
index 06592cf41f049d6734c29120e1d0ed4338d770bd..31465a345dd56c1f5162f5e171eb367ea4e4aee0 100644 (file)
--- a/output.css
+++ b/output.css
@@ -164,7 +164,7 @@ a {
     width: 0;
   }
   100% {
-    width: 110%;
+    width: 100%;
   }
 }
 @keyframes line-second {
@@ -500,7 +500,7 @@ b {
 }
 .app-banner .video-container:before, .app-banner .video-container:after {
   content: "";
-  height: 1px;
+  height: 2px;
   background-color: #ffffff;
   position: absolute;
   bottom: 29%;
@@ -508,7 +508,7 @@ b {
 }
 .app-banner .video-container:before {
   width: 93%;
-  left: -127%;
+  left: -117%;
 }
 @media screen and (min-width: 1024px) {
   .app-banner .video-container:before {
@@ -583,7 +583,7 @@ b {
 .app-intro .line:before {
   content: "";
   width: 0;
-  height: 1px;
+  height: 2px;
   background-color: #ffffff;
   position: absolute;
   z-index: -1;

diff --git a/sass/animations.sass b/sass/animations.sass
index 4198d8dd2e8042dd9d457790a488b12afaef5793..07e1cd16faabc1beaf74db98e09ba19e5e99f35c 100644 (file)
--- a/sass/animations.sass
+++ b/sass/animations.sass
@@ -7,6 +7,6 @@
       width: #{$to}
 
 
-+width(0, 110%, "line-first")
++width(0, 100%, "line-first")
 +width(0vw, 100vw, "line-second")
 +width(100%, 0, "overlay")
\ No newline at end of file

diff --git a/sass/app.sass b/sass/app.sass
index a66b5e05be37d345a7e34b2c7d962baad3692303..af2bd71fe20b92896d1dc6126e737c4df769f184 100644 (file)
--- a/sass/app.sass
+++ b/sass/app.sass
@@ -260,7 +260,7 @@ b
       &:before,
       &:after
         content: ""
-        height: 1px
+        height: 2px
         background-color: $w
         position: absolute
         bottom: 29%
@@ -268,7 +268,7 @@ b
 
       &:before
         width: 93%
-        left: -127% //-117%
+        left: -117%
         +screen-size(small-desktop)
           animation-name: line-first
           animation-timing-function: cubic-bezier(.82,0,.65,.93)
@@ -331,7 +331,7 @@ b
       &:before
         content: ""
         width: 0
-        height: 1px
+        height: 2px
         background-color: $w
         position: absolute
         z-index: -1