:where(.pencil-site) .hero{padding-block:clamp(36px,10.6vw,152px) clamp(48px,8vw,120px);overflow-x:clip}:where(.pencil-site) .hero__grid{grid-template:".card"1fr"copy card""proof card"".card"1fr/minmax(0,48.5fr) minmax(0,51.5fr);display:grid}:where(.pencil-site) .hero__copy{grid-area:copy;padding-top:clamp(0px,1.2vw,18px)}:where(.pencil-site) .hero__copy h1{max-width:7em;font-size:clamp(48px,6vw,88px)}:where(.pencil-site) .hero__lede{max-width:22.5em;margin-top:clamp(20px,2.1vw,30px)}:where(.pencil-site) .hero__actions{margin-top:clamp(28px,2.9vw,42px)}:where(.pencil-site) .hero__alt{color:var(--ink-soft);text-wrap:balance;margin:14px 0 0;font-size:15px;line-height:1.5}:where(.pencil-site) .hero__alt strong{font-weight:600}:where(.pencil-site) .hero__grid .note-card{grid-area:card;align-self:center;width:106%}@media (width>=1024px){:where(.pencil-site) .hero__grid .note-card{align-self:end}}:where(.pencil-site) .hero__proof{grid-area:proof;margin-top:30px;overflow:hidden}:where(.pencil-site) .hero__proof .site-proof{margin-left:-1.6em}:where(.pencil-site) .hero__proof .site-proof li{margin-left:1.6em;position:relative}:where(.pencil-site) .hero__proof .site-proof li:after{content:none}:where(.pencil-site) .hero__proof .site-proof li:before{content:"·";color:var(--graphite);position:absolute;left:-.95em}@media (width>=901px){:where(.pencil-site) .hero__proof .site-proof{font-size:14px}}@media (width<=900px){:where(.pencil-site) .hero__grid{grid-template-rows:none;grid-template-columns:minmax(0,1fr);grid-template-areas:"copy""proof""card"}:where(.pencil-site) .hero__copy{padding-top:0}:where(.pencil-site) .hero__copy h1{font-size:clamp(40px,9.4vw,76px)}:where(.pencil-site) .hero__grid .note-card{width:100%;margin-top:clamp(36px,7vw,64px)}}@media (width<=600px){:where(.pencil-site) .hero__grid{grid-template-areas:"copy""card""proof"}:where(.pencil-site) .hero__copy h1{font-size:clamp(40px,13.2vw,52px)}:where(.pencil-site) .hero__lede{margin-top:18px}:where(.pencil-site) .hero__actions{gap:14px 28px;margin-top:26px}:where(.pencil-site) .hero__grid .note-card{width:132%;margin:30px 0 0 -1.6%}:where(.pencil-site) .hero__proof{margin-top:6px}}:where(.pencil-site) .note-card{aspect-ratio:1510/1066;position:relative;container-type:inline-size}:where(.pencil-site) .note-trail{--stroke:var(--pencil);width:30cqw;height:42cqw;position:absolute;top:52cqw;left:15cqw}@media (width<=1023px){:where(.pencil-site) .note-trail{display:none}}:where(.pencil-site) .note-card__art,:where(.pencil-site) .note-card__art img{width:100%;height:100%;position:absolute;inset:0}:where(.pencil-site) .note-card__plane{transform-origin:0 0;width:62.914%;height:67.542%;color:var(--pencil);font-family:var(--font-hand);font-weight:400;line-height:1;position:absolute;top:15.76%;left:2.649%;transform:rotate(-9.33deg)}:where(.pencil-site) .note-card__question,:where(.pencil-site) .note-card__followup{white-space:nowrap;margin:0;font-size:4.503cqw;position:absolute}:where(.pencil-site) .note-card__question{font-size:4.636cqw;top:14.86%;left:9.26%;rotate:.6deg}:where(.pencil-site) .note-card__followup{transform-origin:100% 80%;top:57.44%;right:24.42%;rotate:-.5deg}:where(.pencil-site) .note-written{display:inline-block}:where(.pencil-site) .note-card__question,:where(.pencil-site) .note-answer__label,:where(.pencil-site) .note-written,:where(.pencil-site) .note-erasing,:where(.pencil-site) .note-hint{filter:var(--filter-tooth)}:where(.pencil-site) .note-card__answers{gap:.42em;font-size:4.503cqw;display:flex;position:absolute;top:34.44%;left:8.95%}:where(.pencil-site) .note-answer{padding:var(--answer-pad-y) var(--answer-pad-x);color:inherit;font:inherit;line-height:var(--answer-line);white-space:nowrap;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:.5em;transition:background-color .15s;display:block;position:relative}:where(.pencil-site) .note-answer:nth-child(2){translate:0 -.05em;rotate:.8deg}:where(.pencil-site) .note-answer:nth-child(3){translate:0 .03em;rotate:-.7deg}@media (hover:hover){:where(.pencil-site) .note-answer:hover:not([aria-pressed=true]){background:linear-gradient(transparent 60%, var(--yellow-wash) 60% 90%, transparent 90%)}}.pencil-site .note-answer:focus-visible{background-color:color-mix(in srgb, var(--yellow-wash) 60%, transparent)}:where(.pencil-site) .pencil-loop{left:calc(-1 * var(--loop-bleed-x));top:calc(-1 * var(--loop-bleed-y));width:calc(100% + 2 * var(--loop-bleed-x));height:calc(100% + 2 * var(--loop-bleed-y));pointer-events:none;fill:none;stroke:var(--pencil);stroke-width:5.5px;stroke-linecap:round;stroke-linejoin:round;position:absolute;overflow:visible}:where(.pencil-site) .pencil-loop path{filter:var(--filter-loop)}:where(.pencil-site) .note-hint{color:var(--graphite);font-family:var(--font-hand);white-space:nowrap;pointer-events:none;align-items:flex-end;gap:.15em;margin:0;font-size:3.2cqw;line-height:1;display:flex;position:absolute;top:26%;left:70.5%;transform:rotate(-6deg)}:where(.pencil-site) .note-hint__arrow{fill:none;stroke:currentColor;stroke-width:2.6px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:1.7em;height:auto;margin-bottom:-.55em}:where(.pencil-site) .note-hint__arrow--above{display:none}@media (width<=600px){:where(.pencil-site) .note-hint{flex-direction:row-reverse;align-items:flex-start;font-size:4.2cqw;top:.6%;left:2.5%;transform:rotate(-3deg)}:where(.pencil-site) .note-hint__arrow--beside{display:none}:where(.pencil-site) .note-hint__arrow--above{stroke-width:1.5px;width:4.2em;margin:.35em 0 0 .1em;display:block}}:where(.pencil-site) .pencil-loop--draw path{stroke-dasharray:1;animation:.56s cubic-bezier(.42,.08,.3,1) .12s both note-loop-draw}@keyframes note-loop-draw{0%{stroke-dashoffset:1px;opacity:0}3%{opacity:1}to{stroke-dashoffset:0;opacity:1}}:where(.pencil-site) .pencil-loop--erase,:where(.pencil-site) .note-erasing{animation:.36s ease-in both note-rub-out}:where(.pencil-site) .note-erasing{display:inline-block}@keyframes note-rub-out{0%{opacity:1;transform:translate(0)}25%{transform:translate(-.035em)}50%{opacity:.5;transform:translate(.045em)}75%{transform:translate(-.025em)}to{opacity:0;transform:translate(0)}}:where(.pencil-site) .note-writing{animation:.9s linear .5s both note-write}@keyframes note-write{0%{clip-path:inset(-.4em 100% -.4em -.3em)}30%{clip-path:inset(-.4em 67% -.4em -.3em)}36%{clip-path:inset(-.4em 65% -.4em -.3em)}68%{clip-path:inset(-.4em 27% -.4em -.3em)}74%{clip-path:inset(-.4em 25% -.4em -.3em)}to{clip-path:inset(-.4em -.3em)}}:where(.pencil-site) .note-crumbs{pointer-events:none;position:absolute;inset:0}:where(.pencil-site) .note-crumb{left:var(--x);top:var(--y);width:var(--size);height:calc(var(--size) * .7);opacity:0;animation:note-crumb-fall .8s ease-out var(--delay) both;border-radius:46% 54% 42% 58%;position:absolute}:where(.pencil-site) .note-crumb--eraser{background:#d79a9e}:where(.pencil-site) .note-crumb--graphite{background:#85898e}@keyframes note-crumb-fall{0%{opacity:0;transform:translate(0)rotate(0)}18%{opacity:.95}70%{opacity:.8}to{opacity:0;transform:translate(var(--dx), var(--dy)) rotate(var(--spin))}}:where(.pencil-site) .note-hint{animation:.7s ease-out .2s both note-hint-in}@keyframes note-hint-in{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion:reduce){:where(.pencil-site) .pencil-loop--draw path,:where(.pencil-site) .note-writing,:where(.pencil-site) .note-hint{animation:none}:where(.pencil-site) .pencil-loop--erase,:where(.pencil-site) .note-erasing,:where(.pencil-site) .note-crumbs{display:none}}