/* Additions to the handed-over design. The design's own CSS is assets/page.css, taken verbatim from
   the component. */
html{background:#0C1112}
body{margin:0}

/* The film's pause control (WCAG 2.2.2: it autoplays and loops) and its text description (1.2.1: it
   is silent, so there is nothing to caption). Pausing also stops the mark's moving dot. */
.film-bar{display:flex;flex-wrap:wrap;align-items:flex-start;gap:12px 24px;margin-top:16px}
.film-btn{display:inline-flex;align-items:center;gap:10px;min-height:40px;padding:0 16px;border-radius:999px;border:1px solid #3A4A4C;background:transparent;color:#F1F3F2;font-family:'Geist Mono',ui-monospace,monospace;font-size:13px;letter-spacing:0.02em;cursor:pointer}
.film-btn:hover{border-color:#8EC0CB}
.film-btn::before{content:'';width:10px;height:12px;box-sizing:border-box;border-left:3px solid currentColor;border-right:3px solid currentColor}
.film-btn[data-state=paused]::before{border-right:0;border-left:10px solid currentColor;border-top:6px solid transparent;border-bottom:6px solid transparent;width:0}
.film-desc{flex:1 1 320px;color:#A7B4B3;font-size:15px;line-height:1.55}
.film-desc summary{font-family:'Geist Mono',ui-monospace,monospace;font-size:13px;letter-spacing:0.02em;color:#8EC0CB;cursor:pointer;min-height:40px;display:flex;align-items:center}
.film-desc p,.film-desc ol{max-width:760px;margin:8px 0 0}
.film-desc ol{padding-left:20px}
.film-desc li{margin-top:6px}
.e-root.motion-paused .go{animation-play-state:paused}
.film-btn:focus-visible,.film-desc summary:focus-visible{outline:2px solid #8EC0CB;outline-offset:3px}

/* The walkthrough form, wired: field errors, the status line, the collection notice, the hidden
   honeypot. The form sits in a .deep section, whose light link colour is unreadable on its white. */
.deep form a{color:#1E4D58}
.deep form a:hover{color:#123540}
.fld input[aria-invalid=true]{border-color:#B3261E;box-shadow:0 0 0 1px #B3261E}
.fld-err{margin:6px 0 0;font-size:14px;line-height:1.4;color:#B3261E}
.submit-row .ts.ts-shown{margin-bottom:12px}
.btn:disabled{opacity:0.55;cursor:not-allowed}
.form-status{margin:0 0 8px;font-size:15px;line-height:1.5;color:#111718}
.form-status:empty{display:none}
.form-status.err{color:#B3261E}
.form-status.ok{color:#2F6B44;font-weight:500}
.form-status:focus{outline:none}
.form-closed{margin:0;padding:12px 14px;border-radius:8px;background:#F5F7F6;border:1px solid #D3DBDA;font-size:15px;line-height:1.5;color:#111718}
.form-note{margin:0;font-size:13px;line-height:1.5;color:#556260}
.hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}

/* The privacy notice and page-not-found (src/SitePages.jsx). */
.page-body h2{margin-top:40px}
.page-body h1 + h2{margin-top:48px}
.page-body p{max-width:720px;margin:10px 0 0;color:#38423F}
.page-body .tl{margin:0 0 18px}