
@font-face{font-family:'Paytone One';src:url(/fonts/de541ac940.woff2) format('woff2');font-weight:400;font-display:block}
@font-face{font-family:'Poppins';src:url(/fonts/335f5e93ca.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Poppins';src:url(/fonts/07b1ab73db.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Poppins';src:url(/fonts/a2089c00ec.woff2) format('woff2');font-weight:600;font-display:swap}
:root{--paper:#F4F6F8;--ink:#2A2A2A;--soft:#6A6F78;--rule:#DDE1E6;--pink:#EF5B88;--blue:#1590E8;--blue-cta:#0F78C8;--night:#0F1117;--ease-out:cubic-bezier(0.23,1,0.32,1)}
*{box-sizing:border-box}
a,button{-webkit-tap-highlight-color:transparent}
html{background:var(--paper);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 18px/1.75 'Poppins',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.pt{font-family:'Paytone One','Arial Black',sans-serif;font-weight:400}
/* split: the text on paper, the film on night */
.split{display:block}
@media (min-width:1000px){.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.col-text{padding:0 28px}
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:560px;margin:0 auto;padding:calc(env(safe-area-inset-top,0px) + 22px) 0 0}
.brand{display:flex;align-items:center;gap:14px}
.brand svg{height:22px;width:auto;display:block}
.brand small{font:500 11px/1 'Poppins',sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--soft);padding-left:14px;border-left:1px solid var(--rule)}
.top a.dl{font:500 14px/1 'Poppins',sans-serif;padding:10px 0;border-bottom:1px solid var(--ink)}
article{max-width:560px;margin:0 auto;padding:14vh 0 16vh}
.label{display:flex;align-items:center;gap:10px;margin:0 0 34px;font:500 11px/1 'Poppins',sans-serif;letter-spacing:.24em;text-transform:uppercase;color:var(--soft)}
.label i{width:8px;height:8px;border-radius:1.5px;background:var(--pink);transform:rotate(-6deg)}
.open{margin:0 0 9vh;font:500 clamp(24px,2.5vw,30px)/1.32 'Poppins',sans-serif;letter-spacing:-.012em}
.open span{display:block}
article p{margin:0 0 1.6em}
.lead-in{color:var(--soft);margin-bottom:.5em!important}
.key{font-weight:500;letter-spacing:-.005em}
.rule{width:40px;height:1px;background:var(--ink);border:0;margin:9vh 0}
.credo{list-style:none;margin:0;padding:0}
.credo li{position:relative;padding-left:26px;margin:0 0 1.1em}
.credo li::before{content:'';position:absolute;left:0;top:.72em;width:7px;height:7px;border-radius:1.5px;background:var(--pink);transform:rotate(-6deg)}
.credo b{font-weight:500}
.sig{margin:9vh 0 0!important;font-size:clamp(24px,2.4vw,30px);line-height:1.2}
.sig span{display:block}.sig em{font-style:normal;color:var(--pink)}
.end-m{margin-top:8vh}
.col-text>header,.col-text>article,.col-text>footer{position:relative;z-index:1}
.film-in{position:relative;z-index:1}
.film-m{margin:0 0 9vh}
.film-m .vid{border-radius:10px}
.fm-cap{margin:14px 0 0!important;font-size:14.5px;line-height:1.5;font-weight:500}
.fm-cap span{color:var(--soft);font-weight:400}
@media (min-width:1000px){.film-m{display:none}}
@media (max-width:999px){.col-film{display:none}}
@media (min-width:1000px){.end-m{display:none}}
/* film column */
.col-film{background:var(--night);color:#fff}
@media (min-width:1000px){.col-film{position:sticky;top:0;height:100vh;height:100svh}}
.film-in{height:100%;display:flex;flex-direction:column;justify-content:center;gap:36px;padding:56px 28px}
@media (min-width:1000px){.film-in{padding:8vh 7vw}}
.vid{position:relative;display:block;width:100%;aspect-ratio:16/9;border:0;padding:0;margin:0 auto;border-radius:6px;overflow:hidden;cursor:pointer;background:#141824;color:#fff;font:inherit}
.vid .poster{position:absolute;inset:0;display:flex}
.vid .poster .h{flex:1;background:repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 22px),repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 22px)}
.vid .poster .h.l{background-color:rgba(21,144,232,.22)}.vid .poster .h.r{background-color:rgba(239,91,136,.2)}
.vid .poster .seam{width:1px;background:rgba(255,255,255,.55)}
.vid .poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vid .ring{position:absolute;left:50%;top:50%;width:76px;height:76px;margin:-38px 0 0 -38px;border-radius:50%;border:1px solid rgba(255,255,255,.75);display:flex;align-items:center;justify-content:center;transition:transform 200ms var(--ease-out),background-color 200ms ease}
.vid .ring svg{width:22px;height:22px;fill:#fff;margin-left:3px}
.vid:active .ring{transform:scale(.96)}
@media (hover:hover) and (pointer:fine){.vid:not([aria-disabled="true"]):hover .ring{background:rgba(255,255,255,.12)}}
.vid[aria-disabled="true"]{cursor:default}.vid[aria-disabled="true"] .ring{opacity:.6}
.vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.f-cap{display:flex;justify-content:space-between;align-items:baseline;gap:16px;border-top:1px solid rgba(255,255,255,.16);padding-top:16px}
.f-cap .t{font:500 15px/1.4 'Poppins',sans-serif}
.f-cap .t span{display:block;color:rgba(255,255,255,.6);font-weight:400;font-size:13.5px;margin-top:2px}
.f-cap .s{font:500 11px/1 'Poppins',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.6);white-space:nowrap}
.f-cta{display:flex;align-items:center;justify-content:space-between;gap:16px}
.f-cta p{margin:0;font-size:22px;line-height:1.2}.f-cta p em{font-style:normal;color:var(--pink)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:30px;background:#fff;color:var(--night);font:600 14.5px/1 'Poppins',sans-serif;white-space:nowrap;transition:transform 160ms var(--ease-out)}
.btn:active{transform:scale(.97)}
.btn.ink{background:var(--ink);color:#fff}
footer{max-width:560px;margin:0 auto;padding:28px 0 calc(28px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--rule);font-size:12.5px;color:var(--soft);display:flex;flex-wrap:wrap;gap:6px 18px}
footer a{text-decoration:underline;text-underline-offset:3px}
.js .fade{opacity:0;animation:fin 900ms var(--ease-out) forwards;animation-delay:var(--d,0ms)}
@keyframes fin{to{opacity:1}}
@media (prefers-reduced-motion:reduce){.js .fade{animation:none;opacity:1}}
