@font-face{font-family:HH-Lemon;src:url('Lemon-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:HH-Nineties;src:url('PerfectlyNineties-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
.hh{--red:#fb0d1b;--ink:#050404;position:relative;clear:both;width:100%;overflow:hidden;background:#fff;color:var(--ink)}
.hh *{box-sizing:border-box}
.hh__shell{width:min(1180px,calc(100% - 48px));margin:0 auto;display:grid;grid-template-columns:minmax(340px,.9fr) minmax(450px,1.1fr);align-items:center;gap:clamp(54px,8vw,112px);padding:72px 0 88px}
.hh__visual{display:flex;justify-content:center;align-items:center;padding:10px 0}
.hh__book-wrap{position:relative;width:min(100%,390px);isolation:isolate}
.hh__book-wrap:before,.hh__book-wrap:after{content:"";position:absolute;inset:4px 0 0;background:#fff;border:1px solid rgba(5,4,4,.12);box-shadow:0 7px 18px rgba(5,4,4,.08);transform-origin:center;pointer-events:none}
.hh__book-wrap:before{z-index:-2;transform:translate(11px,8px) rotate(1.4deg)}
.hh__book-wrap:after{z-index:-1;transform:translate(6px,4px) rotate(.65deg)}
.hh__book{position:relative;z-index:1;display:block;width:100%;height:auto;box-shadow:0 12px 28px rgba(5,4,4,.11)}
.hh__copy{padding-right:12px}
.hh__eyebrow{display:inline-flex;align-items:center;margin:0 0 24px;padding:11px 18px 10px;border-radius:999px;background:var(--red);color:#fff;font:700 18px/1 HH-Lemon,Lemon,sans-serif;text-transform:uppercase;letter-spacing:.7px}
.hh h1{max-width:700px;margin:0;font:700 clamp(54px,5vw,78px)/.9 HH-Lemon,Lemon,sans-serif;letter-spacing:0;text-transform:uppercase}
.hh h1 em{font:inherit;text-transform:inherit;color:var(--red)}
.hh__intro{max-width:610px;margin:28px 0 26px;font:400 19px/1.48 HH-Nineties,'Perfectly Nineties',Georgia,serif}
.hh__contents{display:grid;gap:0;margin:0 0 30px;padding:0;list-style:none;border-top:1px solid rgba(5,4,4,.22)}
.hh__contents li{display:flex;align-items:center;gap:16px;padding:15px 0;border-bottom:1px solid rgba(5,4,4,.22);font:700 19px/1.15 HH-Lemon,Lemon,sans-serif;text-transform:uppercase}
.hh__contents li span{flex:0 0 auto;color:var(--red);font-size:15px}
.hh .hh__button{width:100%;max-width:none;margin:0;gap:13px;font-size:20px;box-shadow:0 8px 20px rgba(251,13,27,.18);transition:transform .15s ease,box-shadow .15s ease,background-color .15s ease}
.hh .hh__button:hover{transform:translateY(-2px);box-shadow:0 11px 25px rgba(251,13,27,.23)}
.hh .hh__button:active{transform:translateY(0);box-shadow:0 5px 13px rgba(251,13,27,.16)}
.hh .hh__button:focus-visible{outline:3px solid var(--ink);outline-offset:4px}
.hh .hh__button:disabled{cursor:wait;opacity:.9}
.hh__button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.hh__button.is-loading svg{animation:hh-bob .7s ease-in-out infinite alternate}
.hh .hh__button.is-done{background:#198754;border-color:#198754}
.hh__meta{display:flex;justify-content:center;flex-wrap:wrap;gap:7px 20px;margin:15px 0 0;color:#716967;font:400 12px/1.3 HH-Nineties,'Perfectly Nineties',Georgia,serif}
.hh__meta span+span:before{content:"·";margin-right:20px}
.hh__status{min-height:20px;margin:8px 0 0;text-align:center;color:#5e5654;font:400 13px/1.3 HH-Nineties,'Perfectly Nineties',Georgia,serif}
@keyframes hh-bob{to{transform:translateY(4px)}}
@media(max-width:850px){.hh__shell{grid-template-columns:1fr;width:calc(100% - 36px);max-width:620px;gap:38px;padding:44px 0 64px}.hh__visual{padding:0}.hh__book-wrap{width:min(72vw,310px)}.hh__copy{width:100%;min-width:0;padding:0;text-align:center}.hh h1{max-width:100%;font-size:clamp(46px,14vw,68px)}.hh__intro{width:calc(100% - 20px);max-width:520px;margin:23px auto 22px;font-size:17px}.hh__contents,.hh__button{width:calc(100% - 12px)!important;margin-left:auto!important;margin-right:auto!important}.hh__contents{text-align:left}.hh__eyebrow{margin-bottom:18px}.hh__meta{gap:6px 10px}.hh__meta span+span:before{margin-right:10px}}
@media(max-width:420px){.hh__shell{width:calc(100% - 28px);padding:32px 0 52px;gap:32px}.hh__book-wrap{width:min(82vw,310px)}.hh__book-wrap:before{transform:translate(8px,6px) rotate(1.2deg)}.hh__book-wrap:after{transform:translate(4px,3px) rotate(.55deg)}.hh h1{font-size:47px}.hh__intro{font-size:16px}.hh__eyebrow{font-size:15px;padding:10px 15px 9px}.hh__contents li{font-size:16px}.hh__contents li span{font-size:13px}.hh .hh__button{min-height:58px;font-size:18px}.hh__meta span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){.hh__button.is-loading svg{animation:none}.hh__button{transition:none}}