:root{--cl-link: var(--cl-zeal)}#landing{padding-top:var(--harbor-height);color:var(--cl-1)}#landing h2 span,#landing h2 b,#landing h2 small{display:block}.cta{margin:40px 0;padding:10px 0}.cta a{display:inline-flex;align-items:center;transition:all .2s;letter-spacing:2px}.cta a svg{margin-right:20px}.cta.mono a:link,.cta.mono a:visited{border-color:var(--cl-zeal);background:var(--cl-zeal);color:var(--cl-0)}.cta.mono a:hover{transform:translateY(-2px);box-shadow:0 10px 20px var(--cl-zeal-d);border-color:var(--cl-zeal-l);background:var(--cl-zeal-l)}.star .cta.mono-invert a:link,.star .cta.mono-invert a:visited{border-color:var(--cl-c);background:var(--cl-0);color:var(--cl-f)}.star .cta.mono-invert a:hover{border-color:var(--cl-b);background:var(--cl-1)}.moon .cta.mono-invert a:link,.moon .cta.mono-invert a:visited{border-color:var(--cl-c);background:var(--cl-f);color:var(--cl-0)}.moon .cta.mono-invert a:hover{border-color:var(--cl-b);background:var(--cl-e)}:root[data-ambience=star] #self-dev{--bg-hero: #7af}:root[data-ambience=moon] #self-dev{--bg-hero: #015}#self-dev{line-height:1.6;background:linear-gradient(0deg,var(--bg-hero),var(--cl-f))}#self-dev .boat{padding:0 2rem 150px}#self-dev h2{font-size:1.6em;padding:3rem 0}#self-dev h2 small{font-weight:300;color:var(--cl-4);font-style:italic}#self-dev h2 b{font-weight:600;font-size:1.2em;letter-spacing:.1rem}#self-dev h2 i{color:var(--cl-4);font-weight:300;letter-spacing:.3rem}#self-dev ul{list-style-type:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-around;align-items:center}#self-dev a{display:block;padding:1rem 2rem;border:1px solid var(--cl-zure);margin:1rem 0;border-radius:.5rem;background:var(--cl-f);font-weight:600;display:flex;align-items:center}#self-dev a svg{margin-right:1rem}#self-dev a:link,#self-dev a:visited{color:var(--cl-0)}#self-dev a:hover{background:var(--cl-3);color:var(--cl-f);box-shadow:0 0 10px var(--cl-zure)}#self-dev .benefit{color:var(--cl-4)}#self-dev .problem{display:flex;flex-wrap:wrap}#self-dev .problem p{flex:1 1 50%}#self-dev .problem svg{display:block;height:17.5em;aspect-ratio:1/1;flex:1 1 50%;position:relative;top:-5rem;animation:rotateRight 15s linear infinite}@media(max-width:768px){#self-dev .problem p,#self-dev .problem svg{flex:1 1 100%;top:0}#self-dev .problem svg{margin:2rem auto}}@keyframes rotateRight{0%{transform:rotate(0)}to{transform:rotate(360deg)}}
