/* USMenuz — FOOTER B: "the receipt". Trial design, only on the A–Z page. */
.rf{margin-top:clamp(40px,6vw,72px);padding-bottom:clamp(48px,6vw,80px);overflow:hidden}
/* same width as the page content (.wrap); the printer slot overhangs the paper a little */
.rf__printer{position:relative;z-index:2;height:22px;margin:0 calc(-1 * min(12px, var(--gut)));border-radius:11px;background:#070605;box-shadow:inset 0 3px 8px #000,0 1px 0 var(--line-strong);display:flex;align-items:center;justify-content:space-between;padding:0 16px;font-size:9px;font-weight:700;letter-spacing:.2em;color:var(--muted)}
.rf__printer i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);animation:pulse 2s infinite}
.rcpt{--mono:ui-monospace,"Cascadia Mono","SFMono-Regular",Consolas,"Liberation Mono",monospace;position:relative;margin:-11px 0 0;background:var(--cream);color:#12100E;font:500 14px/1.6 var(--mono);padding:clamp(32px,4vw,52px) clamp(18px,4vw,52px) clamp(28px,4vw,40px);box-shadow:0 30px 60px rgba(0,0,0,.45)}
.rcpt::after{content:"";position:absolute;left:0;right:0;bottom:-12px;height:12px;background:linear-gradient(135deg,var(--cream) 50%,transparent 50%) 0 0/16px 12px repeat-x,linear-gradient(225deg,var(--cream) 50%,transparent 50%) 0 0/16px 12px repeat-x}
.rcpt a{color:#12100E;text-decoration:none}
.rcpt__head{text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px}
.rcpt__head .logo{color:#12100E;font-size:clamp(48px,8vw,96px)}
.rcpt__head .logo span{color:var(--accent-deep)}
.rcpt__head p{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#3b342e}
.rcpt hr{border:0;border-top:2px dashed rgba(18,16,14,.35);margin:24px 0}
.rcpt__cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 36px}
@media (max-width:900px){.rcpt__cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.rcpt__cols{grid-template-columns:minmax(0,1fr)}}
.rcpt h3{font:700 12px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px;color:#5C534B}
.rline{display:flex;align-items:baseline;gap:6px;padding:3px 0;transition:color .2s,padding .3s var(--ease)}
.rline i{flex:1 1 auto;border-bottom:2px dotted rgba(18,16,14,.3);transform:translateY(-4px);min-width:12px}
.rline b{font-weight:700;font-variant-numeric:tabular-nums}
a.rline:hover{color:var(--accent-deep);padding-left:6px}
a.rline:hover i{border-color:var(--accent-deep)}
.rcpt__tot{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;max-width:560px;margin:0 auto}
.rcpt__tot .rline{font-size:15px}
.rcpt__grand{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;border-top:3px double #12100E;margin-top:10px;padding-top:10px}
.rcpt__grand strong{font:400 clamp(28px,4vw,44px)/1 var(--f-display);letter-spacing:.02em}
.rcpt__tip{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:16px 32px;align-items:center}
@media (max-width:700px){.rcpt__tip{grid-template-columns:minmax(0,1fr)}}
.rcpt__tip strong{display:block;font:400 clamp(26px,3vw,36px)/1 var(--f-display);text-transform:uppercase}
.rcpt__form{display:flex;border:2px solid #12100E;border-radius:4px;overflow:hidden}
.rcpt__form input{flex:1 1 auto;min-width:0;border:0;background:transparent;padding:0 14px;height:50px;font:500 15px var(--mono);color:#12100E}
.rcpt__form input::placeholder{color:#7a6a5c}
.rcpt__form input:focus{outline:0}
.rcpt__form button{border:0;background:#12100E;color:var(--cream);padding:0 18px;font:700 13px var(--mono);letter-spacing:.1em;cursor:pointer;transition:background-color .25s}
.rcpt__form button:hover{background:var(--accent-deep)}
.rcpt .form-done{background:#12100E;color:var(--green);border:0}
.rcpt__legal{font-size:12px;line-height:1.65;color:#3b342e;text-align:center;max-width:720px;margin:0 auto}
.rcpt__bar{display:flex;justify-content:center;margin-top:22px}
.rcpt__bar svg{height:56px;width:min(340px,100%)}
.rcpt__thanks{text-align:center;font-weight:700;letter-spacing:.24em;margin-top:10px}
.rcpt__small{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px;font-size:12px;margin-top:8px;color:#3b342e}
.rcpt__small a{text-decoration:underline;text-underline-offset:3px}
.rf__top{display:flex;justify-content:center;margin-top:48px}
.rf__top a{width:84px;height:84px;border-radius:50%;border:1px solid var(--line-strong);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text);text-decoration:none;font-size:11px;font-weight:700;letter-spacing:.12em;gap:2px;transition:background-color .3s,color .3s,border-color .3s}
.rf__top a:hover{background:var(--accent);color:var(--bg);border-color:var(--accent)}
.rf__top a span{font-size:22px;line-height:1}
/* the receipt "prints" out of the slot, line by line */
/* (the footer itself is watched, not the moving paper, so it prints even if you jump straight to the bottom) */
.js .rf[data-reveal]{opacity:1;transform:none}
.js .rf[data-reveal] .rcpt{transform:translateY(-62%);clip-path:inset(62% -30px -40px -30px);transition:transform 2.4s steps(32,end),clip-path 2.4s steps(32,end)}
.js .rf[data-reveal].is-in .rcpt{transform:none;clip-path:inset(-30px -30px -40px -30px)}
@media (prefers-reduced-motion:reduce){.js .rf[data-reveal] .rcpt{transform:none;clip-path:none}}
