@font-face{font-family:'Fraunces';src:url(../../fonts/concepts/fraunces.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Fraunces';src:url(../../fonts/concepts/fraunces-italic.woff2) format('woff2');font-weight:400;font-style:italic;font-display:swap}
.st-pool{--fr:'Fraunces',var(--serif);background:var(--cp-paper);color:var(--cp-ink);--t:var(--cp-ink);--t2:var(--cp-ink-2)}
.st-pool h1,.st-pool h2,.st-pool h3{font-family:var(--fr);font-weight:400}
.pl-hero{position:relative;min-height:calc(100vh - 2.8rem);min-height:calc(100svh - 2.8rem);display:flex;flex-direction:column;color:var(--t);transition:color .9s var(--ease);overflow:hidden}
.st-pool[data-night] {--t:var(--cp-paper);--t2:var(--cp-rule)}
.pl-hero .st-nav{position:relative;z-index:2}
.st-pool .st-nav b{font:italic 400 1.5rem/1 var(--fr);letter-spacing:0;text-transform:none}
.pl-scene{position:absolute;inset:0;background:var(--cp-deck);touch-action:pan-y}
.pl-scene .live{position:absolute;inset:0;width:100%;height:100%;display:block}
.pl-outline{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.pl-outline path{fill:var(--cp-deep);stroke:var(--cp-cope);stroke-width:7;vector-effect:non-scaling-stroke}
.live-on .pl-outline path{fill:none;stroke:none}
.pl-h{position:absolute;width:2.4rem;height:2.4rem;margin:-1.2rem 0 0 -1.2rem;padding:0;border:0;background:none;cursor:grab;touch-action:none;z-index:1}
.pl-h::before{content:"";position:absolute;inset:.75rem;border-radius:50%;background:var(--cp-cope);box-shadow:0 0 0 1px var(--cp-ink),0 .2rem .6rem -.1rem var(--cp-shade);transition:transform .3s var(--spring)}
.pl-h:hover::before,.pl-h:focus-visible::before{transform:scale(1.5)}
.pl-h:active{cursor:grabbing}
.pl-copy{position:relative;z-index:2;width:min(38%,36rem);padding:clamp(.5rem,2vw,4rem) 0 2rem var(--st-pad);pointer-events:none;box-sizing:content-box;margin-top:auto;margin-bottom:auto}
.pl-copy > *{pointer-events:auto}
.st-pool h1{font-size:clamp(3.8rem,8.4vw,23vh);line-height:.92;letter-spacing:-.03em;margin:0 0 .22em}
.st-pool h1 em{font-style:italic;color:var(--cp-deep);transition:color .9s var(--ease)}
.st-pool[data-night] h1 em{color:var(--cp-glow)}
.pl-copy > p{max-width:30ch;font-size:1.05rem;margin:0 0 1.2rem}
.st-pool .st-chips{margin:0 0 .5rem}
.st-pool .st-chip{background:var(--cp-paper);color:var(--cp-ink);box-shadow:inset 0 0 0 1px var(--cp-ink)}
.st-pool .st-chip[aria-pressed=true]{background:var(--cp-ink);color:var(--cp-paper)}
.pl-est{margin-top:1rem;padding:1.1rem 1.2rem;background:var(--cp-paper);color:var(--cp-ink)}
.pl-k{margin:0;font:500 max(11px,.66rem)/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--cp-ink-2)}
.pl-fig{margin:.5rem 0 .2rem;font:400 clamp(1.8rem,3vw,6rem)/1 var(--fr);font-variant-numeric:lining-nums}
.pl-sub{margin:0 0 .9rem;font-size:.8rem;color:var(--cp-ink-2)}
.st-pool .st-btn{background:var(--cp-ink);color:var(--cp-paper)}
.st-pool .st-toast{font-size:.82rem;min-height:0;margin:.6rem 0 0}
.pl-how{background:var(--cp-paper)}
.st-pool h2{font-size:clamp(2.6rem,5.4vw,14vh);line-height:1;letter-spacing:-.02em;margin:0 0 2.4rem;max-width:18ch}
.pl-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.4rem clamp(1rem,2.6vw,5rem)}
.pl-steps li{border-top:1px solid var(--cp-ink);padding-top:.9rem}
.pl-steps span{font:italic 400 1.1rem/1 var(--fr);color:var(--cp-deep)}
.pl-steps h3{font-size:clamp(1.5rem,2.1vw,4rem);margin:.8rem 0 .5rem}
.pl-steps p{margin:0;font-size:.93rem;color:var(--cp-ink-2)}
@media (max-width:900px){
  .pl-hero{min-height:0;background:var(--cp-paper)}
  .st-pool[data-night]{--t:var(--cp-ink);--t2:var(--cp-ink-2)}
  .pl-scene{position:relative;order:3;height:112vw}
  .pl-copy{order:2;width:auto;padding:.5rem var(--st-pad) 1rem;margin:0}
  .st-pool h1{font-size:19vw}
  .pl-est{order:4;margin:0;padding:1.1rem var(--st-pad)}
  .pl-steps{grid-template-columns:minmax(0,1fr)}
}
