/* The hero's silent product film, drawn locally with real text and simple shapes. */
#hero-film { width:100%; color:#202323; }
#hero-film *, #hero-film *::before, #hero-film *::after { box-sizing:border-box; }
#hero-film .pm-film { container-type:inline-size; overflow:hidden; border-radius:28px; background:#f3f4f2; text-align:left; isolation:isolate; }
#hero-film .pm-film-stage { position:relative; width:100%; aspect-ratio:8 / 5; overflow:hidden; perspective:1100px; }
#hero-film .pm-film-halo { position:absolute; inset:0; background:radial-gradient(ellipse at 51% 46%,#fff9 0%,#fff0 57%); }
#hero-film .pm-film-scene { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; opacity:var(--scene-opacity,0); transform:translate3d(0,var(--scene-y,0),0) rotateX(var(--scene-tilt,0deg)) scale(var(--scene-scale,1)); transform-origin:center 56%; will-change:transform,opacity; }
#hero-film h3,#hero-film p,#hero-film blockquote { margin:0; }
#hero-film .pm-film-card { background:#fff; border:1px solid #e9ece9; box-shadow:0 30px 55px -24px #28363028,0 7px 16px -10px #28363018; border-radius:20px; }
#hero-film .pm-film-icon { display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; width:39px; height:39px; border-radius:11px; }
#hero-film .pm-film-icon svg { width:24px; height:24px; }
#hero-film .pm-film-icon-soft { color:#276b6e; background:#e7f7f5; }
#hero-film .pm-film-eyebrow { display:flex; align-items:center; gap:12px; color:#65716e; font-size:clamp(12px,1.45cqw,17px); font-weight:500; }
#hero-film .pm-film-mini-dot { width:7px; height:7px; background:#b8deda; border-radius:50%; margin-left:auto; }
#hero-film .pm-film-role-card { position:relative; z-index:2; width:57%; max-width:640px; padding:clamp(20px,3.3cqw,42px); transform:rotate(-2deg); }
#hero-film .pm-film-role-card h3 { margin-top:26px; font-size:clamp(21px,3.1cqw,38px); line-height:1.13; letter-spacing:-.045em; font-weight:600; }
#hero-film .pm-film-card-lede { margin-top:10px; color:#78807c; font-size:clamp(14px,1.65cqw,19px); }
#hero-film .pm-film-requirements { display:grid; gap:12px; margin:26px 0 28px; }
#hero-film .pm-film-requirements>div { display:flex; align-items:center; gap:11px; font-size:clamp(16px,1.8cqw,21px); color:#343c39; }
#hero-film .pm-film-requirements svg { width:23px; height:23px; padding:2px; color:#366e64; background:#eaf7f1; border-radius:50%; }
#hero-film .pm-film-role-foot { display:flex; justify-content:space-between; align-items:center; gap:12px; padding-top:20px; border-top:1px solid #eff0ed; font-size:clamp(12px,1.3cqw,15px); color:#88918b; }
#hero-film .pm-film-role-foot>span:last-child { display:flex; align-items:center; gap:10px; color:#48736c; }
#hero-film .pm-film-role-foot>span:last-child>span { font-size:20px; }
#hero-film .pm-film-orbit { position:absolute; width:47%; aspect-ratio:1; border:1px solid #dfe8e2; border-radius:50%; transform:translate(19%,-1%); }
#hero-film .pm-film-orbit::after { content:""; position:absolute; width:11px; height:11px; border:3px solid #f3f4f2; border-radius:50%; background:#77bec0; right:7%; top:21%; }
#hero-film .pm-film-floating-label { position:absolute; bottom:12%; color:#85908a; font-size:clamp(12px,1.3cqw,15px); letter-spacing:.015em; }
#hero-film .pm-film-upload { gap:8%; padding:9% 10%; }
#hero-film .pm-film-paper-stack { position:relative; width:34%; height:73%; max-height:420px; flex:none; perspective:900px; }
#hero-film .pm-film-paper { position:absolute; inset:0; background:#fff; border:1px solid #e7e9e5; border-radius:12px; box-shadow:0 20px 35px -20px #28363030,0 2px 5px #28363006; padding:10%; }
#hero-film .pm-film-paper-back { transform:translate(calc((1 - var(--gather,0)) * -60px - 15px),calc((1 - var(--gather,0)) * 25px - 7px)) rotate(-9deg); background:#fafbf9; }
#hero-film .pm-film-paper-mid { transform:translate(calc((1 - var(--gather,0)) * 60px + 12px),calc((1 - var(--gather,0)) * -10px - 2px)) rotate(7deg); }
#hero-film .pm-film-paper-front { transform:rotate(-1.5deg); }
#hero-film .pm-film-avatar { display:flex; width:42px; height:42px; align-items:center; justify-content:center; border-radius:50%; background:#dcece8; color:#366b63; font-weight:600; font-size:14px; flex:none; }
#hero-film .pm-film-paper-front h3 { font-size:clamp(15px,2cqw,24px); font-weight:600; letter-spacing:-.04em; line-height:1.2; margin:16px 0 4px; }
#hero-film .pm-film-paper-sub { font-size:clamp(10px,1.15cqw,14px); color:#88908a; }
#hero-film .pm-film-paper-rule { height:1px; background:#ecefeb; margin:17px 0; }
#hero-film .pm-film-paper-lines { display:grid; gap:8px; }
#hero-film .pm-film-paper-lines i { height:5px; background:#eef0ed; width:100%; border-radius:5px; }
#hero-film .pm-film-paper-lines i:nth-child(2) { width:88%; }
#hero-film .pm-film-paper-lines i:nth-child(3) { width:65%; }
#hero-film .pm-film-paper-pdf { position:absolute; left:10%; bottom:8%; color:#a0a8a1; font-size:11px; letter-spacing:.05em; }
#hero-film .pm-film-upload-mark { position:absolute; width:68px; height:68px; display:flex; align-items:center; justify-content:center; border:5px solid #f3f4f2; background:#94e2de; border-radius:50%; bottom:3%; right:-11%; box-shadow:0 10px 20px #50675e0c; transform:translateY(calc((1 - var(--gather,0)) * 25px)); }
#hero-film .pm-film-upload-mark svg { width:28px; height:28px; color:#215b5b; }
#hero-film .pm-film-upload-copy { width:45%; }
#hero-film .pm-film-kicker { display:block; color:#77857c; font-size:clamp(12px,1.3cqw,15px); font-weight:500; letter-spacing:.01em; margin-bottom:20px; }
#hero-film .pm-film-big-count { font-size:clamp(56px,8.4cqw,102px); line-height:1; font-weight:500; letter-spacing:-.075em; display:flex; align-items:baseline; gap:12px; }
#hero-film .pm-film-big-count>span { font-size:clamp(20px,2.7cqw,32px); letter-spacing:-.03em; color:#68766d; }
#hero-film .pm-film-upload-copy h3 { font-size:clamp(20px,2.8cqw,32px); line-height:1.2; font-weight:500; letter-spacing:-.035em; margin:14px 0; }
#hero-film .pm-film-upload-copy p,#hero-film .pm-film-match-copy p { color:#78817b; font-size:clamp(15px,1.8cqw,21px); line-height:1.5; }
#hero-film .pm-film-state-tag { display:inline-flex; align-items:center; gap:5px; padding:7px 11px; color:#4b7369; font-size:clamp(11px,1.2cqw,14px); background:#e4eeea; border-radius:20px; margin-top:22px; }
#hero-film .pm-film-state-tag svg { width:17px; height:17px; }
#hero-film .pm-film-match { gap:7%; padding:9% 10%; }
#hero-film .pm-film-ring-wrap { position:relative; width:36%; aspect-ratio:1; flex:none; }
#hero-film .pm-film-ring { display:block; width:100%; height:100%; overflow:visible; transform:rotate(-90deg); fill:none; }
#hero-film .pm-film-ring-track { stroke:#e0e6e0; stroke-width:2; }
#hero-film .pm-film-ring-progress { stroke:#8cd5d2; stroke-width:5; stroke-linecap:round; stroke-dasharray:100; stroke-dashoffset:calc(100 - var(--match-progress,0)); }
#hero-film .pm-film-ring-inner { stroke:#e6eae4; stroke-width:1; stroke-dasharray:1 12; stroke-linecap:round; }
#hero-film .pm-film-ring-text { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; }
#hero-film .pm-film-ring-text>div { font-size:clamp(40px,6cqw,70px); line-height:1; letter-spacing:-.06em; font-weight:500; }
#hero-film .pm-film-count-total { font-size:clamp(14px,1.9cqw,22px); letter-spacing:-.025em; color:#9ba49d; }
#hero-film .pm-film-ring-text>span { font-size:clamp(12px,1.3cqw,16px); color:#748178; }
#hero-film .pm-film-ring-orbit { position:absolute; inset:6.67%; transform:rotate(var(--match-angle,0deg)); }
#hero-film .pm-film-ring-orbit i { display:block; position:absolute; width:10px; height:10px; background:#2d7270; border:2px solid #f3f4f2; border-radius:50%; top:-5px; left:calc(50% - 5px); }
#hero-film .pm-film-match-copy { width:47%; }
#hero-film .pm-film-match-copy h3 { font-size:clamp(23px,3.9cqw,46px); line-height:1.1; font-weight:500; letter-spacing:-.045em; margin-bottom:18px; }
#hero-film .pm-film-match-tags { display:flex; flex-wrap:wrap; gap:7px; margin-top:24px; }
#hero-film .pm-film-match-tags span { display:inline-flex; padding:7px 10px; background:#e8ece7; color:#788178; font-size:clamp(10px,1.1cqw,13px); border-radius:6px; }
#hero-film .pm-film-shortlist { width:76%; max-width:875px; padding:clamp(20px,3cqw,36px); position:relative; transform:rotate(.3deg); }
#hero-film .pm-film-shortlist-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:24px; }
#hero-film .pm-film-shortlist-heading h3 { font-size:clamp(20px,2.6cqw,31px); font-weight:500; letter-spacing:-.04em; }
#hero-film .pm-film-shortlist-heading>span { color:#88918b; font-size:11px; letter-spacing:.07em; }
#hero-film .pm-film-candidates { display:grid; gap:10px; }
#hero-film .pm-film-candidate { display:flex; align-items:center; gap:14px; padding:13px 16px; background:#f4f7f3; border:1px solid #edf0eb; border-radius:10px; }
#hero-film .pm-film-candidate-sam { opacity:var(--row-two,0); transform:translateY(calc((1 - var(--row-two,0)) * 14px)); background:#fafbf9; }
#hero-film .pm-film-avatar-grey { background:#e8eae5; color:#767f75; }
#hero-film .pm-film-candidate-name { display:grid; gap:3px; }
#hero-film .pm-film-candidate-name strong { color:#34423a; font-size:clamp(16px,1.8cqw,21px); font-weight:500; letter-spacing:-.025em; }
#hero-film .pm-film-candidate-name>span { font-size:clamp(12px,1.3cqw,15px); color:#8b938d; }
#hero-film .pm-film-score { margin-left:auto; display:flex; align-items:center; gap:7px; }
#hero-film .pm-film-score strong { font-size:clamp(25px,3cqw,34px); color:#2a6c60; letter-spacing:-.05em; font-weight:500; }
#hero-film .pm-film-score>span { display:none; }
#hero-film .pm-film-evidence { padding:19px 18px 0; opacity:var(--evidence,0); transform:translateY(calc((1 - var(--evidence,0)) * 14px)); }
#hero-film .pm-film-evidence-title { display:flex; align-items:center; gap:6px; color:#7c8880; font-size:clamp(11px,1.15cqw,14px); }
#hero-film .pm-film-evidence-title>svg { width:17px; height:17px; }
#hero-film .pm-film-evidence-check { margin-left:auto; display:flex; align-items:center; justify-content:center; width:18px; height:18px; background:#e6f2eb; color:#578772; border-radius:50%; }
#hero-film .pm-film-evidence-check svg { width:15px; height:15px; }
#hero-film .pm-film-evidence blockquote { margin-top:9px; max-width:680px; font-size:clamp(16px,1.95cqw,23px); line-height:1.45; letter-spacing:-.02em; color:#3c4a41; }
#hero-film .pm-film-result-note { position:absolute; bottom:8.5%; color:#879189; font-size:clamp(12px,1.3cqw,15px); }
#hero-film .pm-film-rail { display:flex; justify-content:space-between; align-items:center; gap:12px; min-height:65px; padding:0 24px 12px; position:relative; z-index:5; }
#hero-film .pm-film-caption { display:flex; align-items:center; gap:7px; color:#879087; font-size:12px; letter-spacing:.005em; }
#hero-film .pm-film-caption-dot { flex:none; width:5px; height:5px; border-radius:50%; background:#97a99f; }
#hero-film .pm-film-controls { display:flex; gap:12px; align-items:center; }
#hero-film .pm-film-scenes { display:flex; gap:1px; }
#hero-film button { font:inherit; cursor:pointer; border:0; -webkit-tap-highlight-color:transparent; }
#hero-film .pm-film-scenes button { display:flex; justify-content:center; align-items:center; width:44px; height:44px; padding:0; border-radius:50%; background:transparent; color:#99a298; font-size:12px; }
#hero-film .pm-film-scenes button span { display:flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:50%; transition:background .2s,color .2s; }
#hero-film .pm-film-scenes button[aria-pressed=true] span { background:#dce8de; color:#456d56; }
#hero-film .pm-film-scenes button:hover span { background:#e5eae3; color:#456d56; }
#hero-film .pm-film-toggle { display:flex; align-items:center; justify-content:center; gap:5px; height:44px; min-width:84px; padding:0 13px; border:1px solid #e0e4dc; border-radius:24px; background:#ffffff8c; color:#65735f; font-size:12px; }
#hero-film .pm-film-toggle svg { width:16px; height:16px; }
#hero-film .pm-film-toggle:hover { background:#fff; }
#hero-film button:focus-visible { outline:2px solid #226b69; outline-offset:2px; }
#hero-film .pm-film-sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@container (max-width:600px) {
  #hero-film .pm-film-stage { aspect-ratio:1 / 1.12; min-height:420px; }
  #hero-film .pm-film-role-card { width:88%; padding:24px; border-radius:17px; transform:rotate(-1.5deg); }
  #hero-film .pm-film-icon { width:34px; height:34px; border-radius:9px; }
  #hero-film .pm-film-icon svg { width:21px; height:21px; }
  #hero-film .pm-film-eyebrow { gap:10px; font-size:16px; }
  #hero-film .pm-film-role-card h3 { margin-top:22px; font-size:clamp(26px,6.8cqw,34px); line-height:1.14; }
  #hero-film .pm-film-card-lede { display:block; margin-top:12px; font-size:16px; line-height:1.5; }
  #hero-film .pm-film-requirements { gap:13px; margin:24px 0 0; }
  #hero-film .pm-film-requirements>div { font-size:18px; gap:9px; line-height:1.4; }
  #hero-film .pm-film-requirements svg { width:22px; height:22px; flex:none; }
  #hero-film .pm-film-role-foot { display:none; }
  #hero-film .pm-film-floating-label { display:none; }
  #hero-film .pm-film-orbit { width:86%; transform:translate(4%,-2%); }

  #hero-film .pm-film-upload { flex-direction:column; gap:18px; padding:16px 24px; }
  #hero-film .pm-film-paper-stack { width:clamp(150px,43cqw,205px); height:clamp(170px,49cqw,235px); max-height:none; }
  #hero-film .pm-film-paper { border-radius:9px; padding:12%; }
  #hero-film .pm-film-paper-front .pm-film-avatar { width:32px; height:32px; font-size:12px; }
  #hero-film .pm-film-paper-front h3 { margin-top:12px; font-size:18px; }
  #hero-film .pm-film-paper-sub { display:none; }
  #hero-film .pm-film-paper-rule { margin:13px 0; }
  #hero-film .pm-film-paper-lines { gap:6px; }
  #hero-film .pm-film-paper-lines i { height:4px; }
  #hero-film .pm-film-paper-front>.pm-film-paper-rule:nth-of-type(3),#hero-film .pm-film-paper-front>.pm-film-paper-lines:nth-of-type(4) { display:none; }
  #hero-film .pm-film-paper-pdf { font-size:11px; }
  #hero-film .pm-film-upload-mark { width:48px; height:48px; border-width:4px; bottom:1%; right:-14%; }
  #hero-film .pm-film-upload-mark svg { width:23px; height:23px; }
  #hero-film .pm-film-upload-copy { width:100%; text-align:center; }
  #hero-film .pm-film-kicker { font-size:16px; line-height:1.4; margin-bottom:8px; }
  #hero-film .pm-film-big-count { justify-content:center; font-size:60px; gap:10px; }
  #hero-film .pm-film-big-count>span { font-size:27px; }
  #hero-film .pm-film-upload-copy h3 { font-size:22px; line-height:1.25; margin:8px 0; }
  #hero-film .pm-film-upload-copy p { display:none; }
  #hero-film .pm-film-state-tag { font-size:14px; padding:5px 10px; margin-top:3px; gap:4px; white-space:nowrap; }
  #hero-film .pm-film-state-tag svg { width:17px; height:17px; }

  #hero-film .pm-film-match { flex-direction:column; padding:20px 24px; gap:22px; }
  #hero-film .pm-film-ring-wrap { width:clamp(160px,48cqw,230px); }
  #hero-film .pm-film-ring-text { gap:9px; }
  #hero-film .pm-film-ring-text>div { font-size:50px; }
  #hero-film .pm-film-count-total { font-size:20px; }
  #hero-film .pm-film-ring-text>span { font-size:16px; }
  #hero-film .pm-film-match-copy { width:100%; text-align:center; }
  #hero-film .pm-film-match-copy h3 { font-size:30px; line-height:1.08; margin-bottom:12px; }
  #hero-film .pm-film-match-copy p { font-size:18px; line-height:1.45; }
  #hero-film .pm-film-match-tags { display:none; }

  #hero-film .pm-film-shortlist { width:90%; padding:20px; border-radius:17px; }
  #hero-film .pm-film-shortlist-heading { display:none; }
  #hero-film .pm-film-candidates { grid-template-columns:1fr; gap:10px; }
  #hero-film .pm-film-candidate { padding:12px; gap:10px; border-radius:9px; }
  #hero-film .pm-film-candidate .pm-film-avatar { width:34px; height:34px; font-size:12px; }
  #hero-film .pm-film-candidate-name strong { font-size:18px; white-space:nowrap; }
  #hero-film .pm-film-candidate-name>span { display:none; }
  #hero-film .pm-film-score { display:flex; flex-direction:column; gap:2px; padding-left:4px; }
  #hero-film .pm-film-score strong { font-size:29px; line-height:1.1; }
  #hero-film .pm-film-score>span { display:block; font-size:11px; color:#829184; }
  #hero-film .pm-film-evidence { padding:20px 2px 0; }
  #hero-film .pm-film-evidence-title { font-size:14px; gap:5px; }
  #hero-film .pm-film-evidence-title>svg { width:17px; height:17px; flex:none; }
  #hero-film .pm-film-evidence-check { display:none; }
  #hero-film .pm-film-evidence blockquote { margin-top:10px; font-size:16px; line-height:1.5; }
  #hero-film .pm-film-result-note { display:none; }

  #hero-film .pm-film-rail { display:grid; grid-template-columns:1fr auto; gap:0 12px; padding:0 16px 8px; min-height:94px; }
  #hero-film .pm-film-caption { grid-column:1; grid-row:1; font-size:11px; gap:5px; line-height:1.4; }
  #hero-film .pm-film-caption-detail { display:inline; }
  #hero-film .pm-film-controls { display:contents; }
  #hero-film .pm-film-scenes { grid-column:1 / -1; grid-row:2; justify-content:center; gap:6px; }
  #hero-film .pm-film-scenes button { width:44px; height:44px; font-size:11px; }
  #hero-film .pm-film-scenes button span { width:23px; height:23px; }
  #hero-film .pm-film-toggle { grid-column:2; grid-row:1; min-width:44px; width:44px; padding:0; }
  #hero-film .pm-film-toggle>span { display:none; }
}
@container (max-width:320px) {
  #hero-film .pm-film-role-card { width:91%; padding:20px; }
  #hero-film .pm-film-role-card h3 { font-size:26px; }
  #hero-film .pm-film-requirements>div { font-size:17px; }
  #hero-film .pm-film-shortlist { width:92%; padding:16px; }
  #hero-film .pm-film-candidate { padding:10px; gap:8px; }
  #hero-film .pm-film-candidate .pm-film-avatar { width:28px; height:28px; font-size:10px; }
  #hero-film .pm-film-candidate-name strong { font-size:18px; }
  #hero-film .pm-film-score strong { font-size:27px; }
  #hero-film .pm-film-match-copy h3 { font-size:28px; }
  #hero-film .pm-film-rail { padding-inline:12px; }
}
