.ph{isolation:isolate;background:var(--night);position:relative;overflow:clip}.ph-media{height:var(--mh,60svh);min-height:22rem;position:relative;overflow:hidden;container-type:size}.ph-frame{--ar:.5581;--s:1;--fx:.5;--fy:.65;--vx:.5;--vy:.6;--W:calc(var(--s) * max(100cqw, 100cqh * var(--ar)));--H:calc(var(--W) / var(--ar));width:var(--W);height:var(--H);left:clamp(100cqw - var(--W), var(--vx) * 100cqw - var(--fx) * var(--W), 0px);top:clamp(100cqh - var(--H), var(--vy) * 100cqh - var(--fy) * var(--H), 0px);position:absolute}.ph-plate,.ph-video{object-fit:cover;width:100%;max-width:none;height:100%;position:absolute;inset:0}.ph-video{opacity:0;transition:opacity 1.2s var(--ease)}.ph-video.is-ready{opacity:1}.ph-can{z-index:1;left:var(--cx);bottom:calc(100% - var(--cy));height:var(--ch);aspect-ratio:540/1400;position:absolute;transform:translate(-50%)}.ph-can-img{width:100%;max-width:none;height:100%;filter:var(--tint,none) blur(.2px);position:relative}.ph-can-shade,.ph-can-rim{pointer-events:none;-webkit-mask:var(--can-mask) center / 100% 100% no-repeat;mask:var(--can-mask) center / 100% 100% no-repeat;position:absolute;inset:0}.ph-can-shade{mix-blend-mode:multiply;background:linear-gradient(oklch(.42 .06 270 / var(--lid,0)), transparent 8%), linear-gradient(transparent 90%, oklch(25% .06 285/.75)), var(--shade,linear-gradient(90deg, transparent 55%, oklch(45% .08 285/.6))), linear-gradient(var(--amb,transparent), var(--amb,transparent))}.ph-can-rim{mix-blend-mode:screen;background:var(--rim,none)}.ph-can:before,.ph-can:after{content:"";z-index:-1;pointer-events:none;border-radius:50%;position:absolute}.ph-can:before{background:radial-gradient(closest-side,oklch(6% .03 285/.9),oklch(6% .03 285/.35) 70%,#0000);height:3.6%;bottom:-1.6%;left:2%;right:2%}.ph-can:after{filter:blur(6px);height:11%;transform:translateX(var(--cast,12%)) scaleX(1.2);background:radial-gradient(closest-side,oklch(8% .04 285/.55),#0000);bottom:-5%;left:-30%;right:-30%}.ph-can-refl{pointer-events:none;width:100%;max-width:none;height:100%;opacity:var(--refl,0);filter:var(--tint,none) blur(1.5px);position:absolute;top:100%;left:0;transform:scaleY(-1);-webkit-mask:linear-gradient(#0000 68%,#000);mask:linear-gradient(#0000 68%,#000)}.ph-scrim{pointer-events:none;background:linear-gradient(oklch(17% .08 285/.75), transparent 22%), linear-gradient(transparent 55%, var(--night));position:absolute;inset:0}.ph-copy{z-index:2;padding:0 var(--gutter) clamp(2.5rem, 8vw, 4rem);justify-items:start;gap:1rem;margin-top:-3rem;display:grid;position:relative}.ph-over{font:600 var(--step--1)/1.3 var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--butter)}.ph h1{letter-spacing:0;word-spacing:-.03em;text-shadow:0 2px 30px oklch(17% .08 285/.5);max-width:15ch;font-size:clamp(2.5rem,1.4rem + 4.6vw,5.75rem);font-weight:600;line-height:1.04}.ph h1 .line{display:block}.ph h1 .w{vertical-align:top;margin:0 -.1em -.14em;padding:0 .1em .14em;display:inline-block;overflow:clip}.ph h1 .wi{display:inline-block}.ph-lede{font-size:var(--step-1);max-width:36ch;color:var(--text);text-wrap:pretty;line-height:1.5}.ph .proof{margin-top:.25rem}.ph .proof li:last-child{display:flex}.ph-formula{font-size:var(--step--1);color:var(--text-muted);flex-wrap:wrap;gap:.25rem 0;max-width:44ch;margin:0;padding:0;list-style:none;display:flex}.ph-formula li:not(:last-child):after{content:"·";color:var(--butter);margin-inline:.6rem}.ph-formula strong{color:var(--butter);font-weight:600}.ph .loop-toggle{opacity:.85}@media (width<=899px){.ph .actions .btn-lg{min-height:3rem}}@media (prefers-reduced-motion:no-preference){.ph h1 .wi{animation:rise .85s var(--ease) both;animation-delay:calc(.12s + var(--i) * 55ms)}.ph [data-in]{animation:up .9s var(--ease) both}.ph [data-in="1"]{animation-delay:60ms}.ph [data-in="2"]{animation-delay:.42s}.ph [data-in="3"]{animation-delay:.52s}.ph [data-in="4"]{animation-delay:.62s}.ph-can{animation:phCan 1.4s var(--ease) both .3s}.ph-plate{animation:phPlate 2.4s var(--ease) both}}@keyframes phCan{0%{opacity:0;transform:translate(-50%)translateY(6%)}}@keyframes phPlate{0%{transform:scale(1.06)}}@media (width>=900px) and (aspect-ratio>=1){.ph{height:max(100svh,42rem)}.ph-media{height:auto;min-height:0;position:absolute;inset:0}.ph-copy{width:min(48rem,54%);padding:7rem var(--gutter) 3rem;align-content:center;gap:1.25rem;margin:0;position:absolute;inset:0 auto 0 0}.ph-scrim{background:linear-gradient(90deg,oklch(17% .08 285/.9),oklch(17% .08 285/.7) 32%,#0000 62%),linear-gradient(oklch(17% .08 285/.7),#0000 20%),linear-gradient(#0000 78%,oklch(17% .08 285/.6))}}.ph-e .ph-frame{--fy:.66;--vy:.62;--cx:76%;--cy:71%;--ch:23%;--tint:brightness(.88) contrast(1.05) saturate(.9);--amb:oklch(74% .05 270);--lid:.7;--shade:linear-gradient(90deg, transparent 40%, oklch(42% .09 280/.75));--rim:linear-gradient(90deg, oklch(78% .12 70/.5), transparent 16%), linear-gradient(oklch(60% .06 260/.35), transparent 10%);--cast:28%}@media (width>=900px) and (aspect-ratio>=1){.ph-e .ph-frame{--ar:1.7917;--fx:1;--vx:1;--fy:.6;--vy:.6;--cx:77%;--cy:67%;--ch:34%}}.ph-f .ph-frame{--fy:.5;--vy:.5;--cx:50%;--cy:74.5%;--ch:30%;--tint:brightness(.94) saturate(1.05);--shade:linear-gradient(90deg, oklch(50% .1 290/.45), transparent 28% 62%, oklch(42% .1 290/.65));--rim:linear-gradient(90deg, transparent 84%, oklch(68% .15 330/.45)), linear-gradient(oklch(85% .03 290/.3), transparent 9%);--cast:0%;--refl:.16}.ph-f{--mh:66svh}@media (width>=900px) and (aspect-ratio>=1){.ph-f .ph-frame{--ar:1.7917;--s:1.18;--fx:.52;--vx:.68;--fy:.55;--vy:.55;--cx:52%;--cy:79.5%;--ch:40%}}.ph-g .ph-frame{--fx:.5;--vx:.5;--fy:.6;--vy:.6;--cx:50%;--cy:83%;--ch:9%;--tint:brightness(.9) contrast(1.04) saturate(.95);--amb:oklch(90% .03 60);--lid:.3;--shade:linear-gradient(90deg, oklch(50% .07 280/.35), transparent 30% 55%, oklch(42% .08 280/.6));--rim:linear-gradient(90deg, oklch(85% .1 75/.45), transparent 12% 90%, oklch(85% .1 75/.3)), linear-gradient(oklch(90% .06 80/.35), transparent 9%);--cast:-6%;--refl:.3}.ph-g{--mh:max(66svh, 106vw)}@media (width>=900px) and (aspect-ratio>=1){.ph-g .ph-media{inset:0 0 0 46%}.ph-g .ph-frame{--ar:.7432;--fx:.5;--vx:.5;--fy:.75;--vy:.75;--cx:30%;--cy:94%;--ch:8%}.ph-g .ph-copy{width:46%}.ph-g .ph-scrim{background:linear-gradient(90deg, var(--night), transparent 22%), linear-gradient(oklch(17% .08 285/.6), transparent 18%)}}.ph-h .ph-frame{--fy:.8;--vy:.78;--cx:77%;--cy:85%;--ch:19%;--tint:brightness(.92) contrast(1.08) sepia(.1);--amb:oklch(80% .05 55);--lid:.55;--shade:linear-gradient(90deg, transparent 40%, oklch(40% .08 290/.75));--rim:linear-gradient(90deg, oklch(78% .14 60/.45), transparent 9%);--cast:30%;--refl:.1}@media (width>=900px) and (aspect-ratio>=1){.ph-h .ph-frame{--ar:1.7917;--fx:.5;--vx:.5;--fy:1;--vy:1;--cx:84%;--cy:94%;--ch:30%}.ph-h .ph-copy{text-align:center;justify-items:center;gap:.9rem;width:auto;padding-top:clamp(5.5rem,11svh,7.5rem);inset:0 0 auto}.ph-h h1{max-width:none;font-size:clamp(3rem,1.5rem + 4.2vw,5.75rem)}.ph-h .ph-lede{max-width:58ch}.ph-h .ph-copy{pointer-events:none;align-content:start;bottom:0}.ph-h .ph-copy>*{pointer-events:auto}.ph-h .proof{left:var(--gutter);position:absolute;bottom:1.5rem}.ph-h .ph-scrim{background:linear-gradient(oklch(17% .08 285/.9),oklch(17% .08 285/.6) 38%,#0000 62%),linear-gradient(#0000 82%,oklch(17% .08 285/.55))}}.concept-nav{z-index:var(--z-skip);background:oklch(17% .08 285/.88);border:1px solid oklch(94% .11 104/.3);border-radius:999px;gap:.25rem;padding:.3rem;display:flex;position:fixed;bottom:.75rem;left:50%;transform:translate(-50%)}.concept-nav a{min-width:2.75rem;min-height:2.75rem;color:var(--text-muted);font:600 var(--step--1)/1 var(--font-body);border-radius:999px;place-items:center;padding-inline:.75rem;text-decoration:none;display:grid}.concept-nav a:hover{color:var(--butter)}.concept-nav a[aria-current=page]{background:var(--butter);color:var(--night-2)}@media not ((width>=900px) and (aspect-ratio>=1)){.concept-nav{width:fit-content;margin:0 auto 2rem;position:static;transform:none}}.ph-film{display:none}.film-in .ph-film{z-index:calc(var(--z-skip) + 1);place-content:center;justify-items:center;gap:clamp(1.25rem,4svh,2.5rem);animation:.5s 4.5s forwards phFilmOut;display:grid;position:fixed;inset:0}.ph-film-bg{background:oklch(95.5% .017 95);position:absolute;inset:0}.ph-film-can{width:auto;max-width:none;height:min(48svh,30rem);position:relative}.ph-film-line{text-align:center;color:oklch(20% .01 285);font:600 clamp(1.6rem, 6.4vw, 2.6rem)/1.2 var(--font-display);margin:0;position:relative}.film-in .ph{isolation:auto}.film-ran .ph-can{animation:none}@keyframes phFilmOut{to{opacity:0;visibility:hidden}}
