/* The full square sequence shares its choreography with animation-carres.html. */
.square-home{--ink:#211a33;--purple:#6938cf;--orange:#bd4b26;--paper:#faf9f6;--square-header:84px;position:relative;height:300svh;background:var(--paper);color:var(--ink);font:16px/1.55 Arial,sans-serif}
.square-home .stage{position:sticky;top:var(--square-header);height:calc(100svh - var(--square-header));overflow:hidden;isolation:isolate}
.square-home canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.square-home .scene-copy{position:absolute;left:8%;top:50%;transform:translateY(-50%);width:38%;max-width:580px;pointer-events:none}
.square-home .scene-copy.centered{left:50%;transform:translate(-50%,-50%);width:70%;max-width:940px;text-align:center}
.square-home .eyebrow{font:11px monospace;letter-spacing:.09em;color:var(--purple);display:block;margin-bottom:24px}
.home-story .square-home .scene-title{font:500 clamp(34px,4.2vw,60px)/1.07 Georgia,serif!important;letter-spacing:-.035em!important;margin:0 0 28px!important;text-transform:none!important;text-wrap:balance}
.square-home .scene-title em{color:var(--purple);font-weight:400}
.square-home .scene-copy p{font-size:16px;line-height:1.55;max-width:36ch;color:#70657d;margin:0}
.square-home .scene-copy.centered p{margin-inline:auto;max-width:45ch}
.square-home .modules{position:absolute;left:51%;top:21%;width:42%;height:59%;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,1fr);pointer-events:none;opacity:0}
.square-home .modules span{align-self:center;text-align:center;font-size:11px;color:#645574;padding-top:60px}
.square-home .logo-finale{position:absolute;inset:0;opacity:0;pointer-events:none;--logo-ratio:1.5;background:var(--paper)}
.square-home .logo-finale[data-pixel-signature]{inset:auto;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);background:none}
.square-home .logo-symbol{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);width:var(--logo-width,60vw);aspect-ratio:var(--logo-ratio);overflow:hidden;mix-blend-mode:multiply}
.square-home .logo-symbol img{position:absolute;width:100%;max-width:none;height:auto;left:0;top:0}
.square-home .logo-finale>strong{position:absolute;top:calc(43% + var(--logo-width,60vw) / var(--logo-ratio) / 2 + 26px);left:0;right:0;text-align:center;font:bold 32px Georgia,serif}
.square-home .logo-finale>strong span{font:11px monospace;color:var(--purple);letter-spacing:3px;margin-left:5px}
.square-home .logo-finale>p{position:absolute;top:calc(43% + var(--logo-width,60vw) / var(--logo-ratio) / 2 + 76px);left:0;right:0;text-align:center;margin:0;font:20px Georgia,serif;color:#70657d}
.square-home .legend{position:absolute;bottom:94px;left:50%;transform:translateX(-50%);display:flex;gap:24px;font-size:10px;color:#71647d;white-space:nowrap;pointer-events:none}
.square-home .legend span{display:flex;align-items:center;gap:7px}.square-home .legend i{display:block;width:9px;height:9px;background:#ded6e8}.square-home .legend span:nth-child(2) i{background:var(--purple)}.square-home .legend span:nth-child(3) i{background:var(--orange)}
.square-home .bottom{position:absolute;bottom:28px;left:5%;right:5%;display:flex;justify-content:space-between;align-items:center;font-size:11px;gap:15px}
.square-home .bottom>span{min-width:180px;color:#70657d}.square-home .bottom nav{display:flex;gap:10px}.square-home .bottom a{font-size:11px;color:var(--ink)}
.square-home .bottom button{width:10px;height:10px;border:1px solid #b7a8cc;padding:0;background:transparent;cursor:pointer;position:relative}.square-home .bottom button:before{content:'';position:absolute;inset:-8px}.square-home .bottom button[aria-current=true]{background:var(--purple);border-color:var(--purple)}
.square-home .progress{height:2px;position:absolute;bottom:0;width:100%;background:#e7e0ee}.square-home .progress i{display:block;height:100%;width:0;background:var(--purple)}
.square-home .square-film{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(76%,calc((100svh - 290px)*1.778),1060px);opacity:0;pointer-events:none}
.square-home .square-film-heading{margin-bottom:20px;text-align:center}.square-home .square-film-heading>span{font:11px monospace;color:var(--orange)}
.home-story .square-home .square-film h3{font:500 clamp(24px,2.5vw,38px)/1.12 Georgia,serif!important;letter-spacing:-.025em!important;text-transform:none!important;margin:12px 0 0!important;color:var(--ink)}
.square-home video{display:block;width:100%;aspect-ratio:16/9;background:#0b1018;border-radius:4px;box-shadow:0 20px 45px #26162612}
.square-home .square-film-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:11px;color:#70657d;margin-top:12px}.square-home .square-film-footer button{font-size:12px;border:0;padding:8px 0;background:none;color:#a43f20;cursor:pointer}
.square-home button:focus-visible,.square-home a:focus-visible,.square-home video:focus-visible{outline:3px solid var(--orange);outline-offset:6px}
@media(max-width:700px){.square-home{height:300svh}.square-home .scene-copy{left:7%;top:12%;transform:none;width:86%;max-width:none}.square-home .scene-copy.centered{top:40%;width:76%;transform:translate(-50%,-50%)}.home-story .square-home .scene-title{font-size:36px!important;margin-bottom:16px!important}.square-home .scene-copy p{font-size:14px}.square-home .eyebrow{margin-bottom:16px}.square-home .modules{left:7%;top:45%;width:86%;height:37%}.square-home .modules span{font-size:9px;padding-top:34px}.square-home .legend{bottom:100px;gap:10px;font-size:8px}.square-home .bottom{bottom:45px;flex-wrap:wrap}.square-home .bottom>span{min-width:0;font-size:9px}.square-home .bottom>a{font-size:9px}.square-home .bottom nav{gap:12px}.square-home .logo-finale>p{font-size:17px}.square-home .square-film{width:90%;top:46%}.square-home .square-film-heading{margin-bottom:25px}.square-home .square-film-footer{flex-wrap:wrap;font-size:10px}.square-home .square-film-footer button{font-size:11px}}
@media(prefers-reduced-motion:reduce){.square-home{height:calc(100svh - var(--square-header))}.square-home .stage{position:relative;top:0}.square-home .bottom>span{display:none}}
.square-home .bottom{top:22px;bottom:auto;left:9%;right:9%}.square-home .logo-finale>p{width:100%!important;max-width:none!important;text-align:center!important}.square-home .square-film-footer>span,.square-home .square-film-footer>button{width:auto!important;max-width:none;flex:0 1 auto}.square-home .bottom button{border-radius:0!important}.square-home .square-film{width:min(76%,calc((100svh - 340px)*1.778),1000px)}@media(max-width:700px){.square-home .bottom{top:18px;bottom:auto;left:7%;right:7%}.square-home .square-film{width:90%}.square-home .square-film-heading h3{max-width:85%;margin-inline:auto!important}}
.square-home .bottom button[aria-current=false]{background:transparent!important}.square-home .bottom button[aria-current=true]{background:var(--purple)!important}.square-home .square-film{width:min(74%,calc((100svh - 380px)*1.778),960px)}@media(max-width:700px){.square-home .square-film{width:90%}}
/* The frame grows with the scroll, then yields the full scene to the film. */
.square-home .square-film{--film-scale:.38;--film-shift:85px;--film-title-opacity:1;width:min(94%,calc((100svh - 235px)*1.77778),1380px);top:49%;transform:translate(-50%,-50%) translateY(var(--film-shift)) scale(var(--film-scale));transform-origin:center;will-change:transform,opacity}
.square-home .square-film-heading{position:absolute;left:0;right:0;bottom:calc(100% + 26px);margin:0;opacity:var(--film-title-opacity);pointer-events:none}
.square-home .square-film video{border-radius:var(--film-radius,4px);box-shadow:0 22px 60px #211a3322}
.square-home .square-film-footer{position:absolute;top:calc(100% + 10px);left:0;right:0;margin:0;justify-content:flex-start;gap:20px;line-height:1.4}
.square-home .square-film-footer .square-film-sound{background:#211a33;color:#fff;border:1px solid #211a33;padding:9px 14px;border-radius:3px;font:12px Arial,sans-serif;min-height:38px}
.square-home .square-film-footer>span{font-size:10px}
.square-home .square-film-footer>[data-step]{margin-left:8px}
.square-home .square-film-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#6938cf;color:#fff;border:1px solid #fff;padding:15px 24px;border-radius:4px;cursor:pointer;font-size:15px}
.square-home .square-film-play[hidden]{display:none!important}
@media(max-width:700px){.square-home .square-film{width:96%;top:46%}.square-home .square-film-footer{left:8px;right:8px;gap:10px;flex-wrap:wrap}.square-home .square-film-heading{bottom:calc(100% + 22px)}.square-home .square-film-footer>[data-step]{margin-left:0}.square-home .square-film-footer .square-film-sound{font-size:11px}.square-home .square-film-footer>span{font-size:9px}}
@media(prefers-reduced-motion:reduce){.square-home .square-film{transform:translate(-50%,-50%);will-change:auto}}