/* For protocols page only (2026-11-01). Builds on site.css tokens; loaded after it. No hairlines, no shadows. */

/* hero: the rings that leave, and the one that stays */
.pr-stage{justify-content:space-between}
.pr-leave{width:100%;max-width:560px;margin:auto;overflow:visible}
.pr-leave .lr{fill:none;stroke:var(--on-navy-2);stroke-width:3;animation:pr-out 2.4s var(--ease-move) both}
.pr-leave .usc{fill:var(--white)}
.pr-leave .usc-t{fill:var(--navy);font:500 40px var(--sans);letter-spacing:-.02em;text-anchor:middle;dominant-baseline:central}
.pr-leave .l1{--dx:103px;--dy:38px;animation-delay:.7s}
.pr-leave .l2{--dx:19px;--dy:108px;animation-delay:.78s}
.pr-leave .l3{--dx:-84px;--dy:71px;animation-delay:.86s}
.pr-leave .l4{--dx:-103px;--dy:-38px;animation-delay:.94s}
.pr-leave .l5{--dx:-19px;--dy:-108px;animation-delay:1.02s}
.pr-leave .l6{--dx:84px;--dy:-71px;animation-delay:1.1s}
@keyframes pr-out{from{transform:none;opacity:1}to{transform:translate(var(--dx),var(--dy));opacity:.22}}
.pr-cap{margin:0;color:var(--on-navy);font-size:var(--step-body)}

/* shared: section heads and ring strokes */
.pr-head{max-width:880px}
.pr-head h2{margin:0}
.pr-head p{margin:20px 0 0;color:var(--ink-2);font-size:var(--step-lead);line-height:1.35;max-width:40ch}
.pr .k{margin:0 0 10px;color:var(--ink-3);font-size:var(--step-small);letter-spacing:.02em}
.pr svg .ring{fill:none;stroke:var(--line-2);stroke-width:4}
.pr svg .me{fill:none;stroke:var(--navy);stroke-width:8}
.pr svg .me-f{fill:var(--navy)}
.pr svg .o{fill:none;stroke:var(--line-2);stroke-width:5}
.pr svg .ghost{fill:none;stroke:var(--line-2);stroke-width:4;stroke-dasharray:6 10}

/* every protocol has a bad day: three large pictures */
.pr-bad{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:clamp(32px,4vw,56px) 0 0;padding:0;list-style:none}
.pr-bad li{background:var(--field);border-radius:var(--r);padding:clamp(24px,3vw,44px);display:flex;flex-direction:column}
.pr-bad svg{width:100%;height:auto;max-height:220px;overflow:visible;margin-bottom:clamp(20px,2.4vw,36px)}
.pr-bad h3{margin:0 0 10px;font-weight:400;font-size:var(--step-lead);letter-spacing:-.01em}
.pr-bad p{margin:0;color:var(--ink-2)}
@media(max-width:860px){.pr-bad{grid-template-columns:1fr}.pr-bad svg{max-height:180px}}

/* without USC, with USC */
.pr-vs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:24px;margin-top:clamp(32px,4vw,56px)}
.pr-vs > div{padding:clamp(18px,2.2vw,30px) clamp(24px,3.4vw,56px)}
.pr-vs .no{background:var(--field)}
.pr-vs .yes{background:var(--navy);color:var(--on-navy)}
.pr-vs .top{padding-top:clamp(28px,3.6vw,56px);padding-bottom:clamp(20px,2.4vw,36px);border-radius:var(--r) var(--r) 0 0;display:flex;align-items:center;gap:16px}
.pr-vs .end{padding-bottom:clamp(28px,3.6vw,56px);border-radius:0 0 var(--r) var(--r)}
.pr-vs .top h3{margin:0;font-weight:300;font-size:clamp(1.75rem,1.2rem + 1.8vw,2.75rem);line-height:1.08;letter-spacing:-.025em}
.pr-vs .top svg{width:44px;height:44px;flex:none}
.pr-vs .yes.top h3{color:var(--white)}
.pr-vs .top .ring{stroke:var(--ink-3);stroke-width:6;stroke-dasharray:14 12}
.pr-vs .top .on{fill:none;stroke:var(--white);stroke-width:8}
.pr-vs .k{margin-bottom:6px}
.pr-vs .yes .k{color:var(--on-navy-2)}
.pr-vs .v{margin:0;font-size:var(--step-lead);line-height:1.3;letter-spacing:-.01em}
.pr-vs .no .v{color:var(--ink-3)}
.pr-vs .yes .v{color:var(--white)}
.pr-vs-end{margin:clamp(28px,3.4vw,48px) 0 0;font-size:var(--step-lead);color:var(--ink);max-width:48ch}
@media(max-width:640px){
  .pr-vs{grid-template-columns:1fr;row-gap:0}
  .pr-vs .top.no{display:none}
  .pr-vs .top.yes{border-radius:var(--r);margin-bottom:12px}
  .pr-vs .no:not(.top){border-radius:var(--r) var(--r) 0 0;margin-top:12px}
  .pr-vs .yes:not(.top){border-radius:0 0 var(--r) var(--r)}
  .pr-vs .no .k::after{content:", without USC"}
  .pr-vs .yes .k::after{content:", with USC"}
  .pr-vs .end{padding-bottom:clamp(18px,2.2vw,30px)}
}

/* real bad days */
.pr-real{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;margin-top:clamp(32px,4vw,56px)}
.pr-real > div{grid-column:span 6;background:var(--field);border-radius:var(--r);padding:clamp(28px,4vw,56px)}
.pr-real .big{margin:0;font-weight:300;font-size:var(--step-display);line-height:1;letter-spacing:-.04em;color:var(--navy)}
.pr-real .k{margin:16px 0 12px}
.pr-real p{margin:0;color:var(--ink-2)}
.pr-real-end{margin:clamp(28px,3.4vw,48px) 0 0;font-size:var(--step-lead);color:var(--ink);max-width:40ch}
@media(max-width:760px){.pr-real > div{grid-column:1 / -1}}

/* how membership works: one track, four rings */
.pr-track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin:clamp(32px,4vw,56px) 0 0;padding:0;list-style:none;position:relative}
.pr-track::before{content:"";position:absolute;left:60px;right:calc(25% - 78px);top:59px;height:4px;background:var(--line-2)}
.pr-track li{position:relative}
.pr-track svg{width:120px;height:120px;display:block;margin-bottom:24px;background:var(--bg);border-radius:50%}
.pr-track .n{margin:0 0 6px;color:var(--ink-3);font-size:var(--step-small)}
.pr-track h3{margin:0 0 10px;font-weight:400;font-size:var(--step-lead);letter-spacing:-.01em}
.pr-track p{margin:0;color:var(--ink-2);max-width:30ch}
@media(max-width:900px){
  .pr-track{grid-template-columns:1fr;gap:32px}
  .pr-track::before{left:58px;right:auto;top:60px;bottom:60px;width:4px;height:auto}
  .pr-track li{display:grid;grid-template-columns:120px minmax(0,1fr);gap:0 24px;align-items:start}
  .pr-track svg{margin:0;grid-row:span 3}
}
@media(max-width:480px){
  .pr-track::before{left:38px;top:40px;bottom:40px}
  .pr-track li{grid-template-columns:80px minmax(0,1fr);gap:0 18px}
  .pr-track svg{width:80px;height:80px}
}

/* who it is for: six tiles */
.pr-who{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:clamp(32px,4vw,56px) 0 0;padding:0;list-style:none}
.pr-who li{background:var(--field);border-radius:var(--r);padding:clamp(24px,2.8vw,40px)}
.pr-who svg{width:96px;height:96px;display:block;margin-bottom:clamp(20px,2.4vw,32px)}
.pr-who svg .ring{stroke-width:5}
.pr-who svg .o{stroke-width:7}
.pr-who svg .me{stroke-width:11}
.pr-who svg .ghost{stroke:var(--ink-3);stroke-width:7;stroke-dasharray:9 11}
.pr-who h3{margin:0 0 8px;font-weight:400;font-size:var(--step-lead);letter-spacing:-.01em}
.pr-who p{margin:0;color:var(--ink-2)}
@media(max-width:1000px){.pr-who{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.pr-who{grid-template-columns:1fr}}

/* built to stay: one navy band, three facts */
.pr-stay{background:var(--navy);color:var(--on-navy);border-radius:var(--r);padding:clamp(32px,5vw,80px)}
.pr-stay h2{color:var(--white);margin:0;max-width:16ch}
.pr-stay-pts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:clamp(36px,4.4vw,64px)}
.pr-stay .big{margin:0 0 14px;font-weight:300;font-size:var(--step-head);line-height:1;letter-spacing:-.03em;color:var(--white)}
.pr-stay-pts p{margin:0}
.pr-stay a{color:var(--white)}
@media(max-width:860px){.pr-stay-pts{grid-template-columns:1fr}}

/* central bank: one ring that holds the others */
.pr-cb{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:40px 24px;align-items:center}
.pr-cb-fig{grid-column:1 / span 5;width:100%;max-width:460px;height:auto}
.pr-cb-fig .big{fill:none;stroke:var(--navy);stroke-width:8}
.pr-cb-fig .m{fill:none;stroke:var(--navy);stroke-width:4;opacity:.45}
.pr-cb-fig .usc{fill:var(--navy)}
.pr-cb-fig .usc-t{fill:var(--white);font:500 26px var(--sans);text-anchor:middle;dominant-baseline:central}
.pr-cb-t{grid-column:7 / span 6}
.pr-cb-t .lede{margin-top:24px;max-width:36ch}
@media(max-width:900px){.pr-cb-fig{grid-column:1 / -1;max-width:320px}.pr-cb-t{grid-column:1 / -1}}

/* talk to us: the founders, by email */
.pr-founders{margin:28px 0;padding:0;list-style:none;display:grid;gap:16px}
.pr-founders li{display:flex;flex-direction:column;gap:2px}
.pr-founders .who{color:var(--ink-3);font-size:var(--step-small)}
.pr-founders a{font-size:var(--step-body);word-break:break-word}

@media (prefers-reduced-motion: reduce){
  .pr-leave .lr{animation:none;transform:translate(var(--dx),var(--dy));opacity:.22}
}