/* Cam's pumpkin pop-up, October 29-31, 2026. Every rule is scoped to #cpp-root so the theme can't reach it. */
@font-face{font-family:'CPP Garage';font-weight:700;font-display:swap;src:url('/wp-content/uploads/2019/12/garage_gothic_bold-webfont.woff2') format('woff2')}
@font-face{font-family:'CPP Lato';font-weight:300;font-display:swap;src:url('Lato-300.woff2') format('woff2')}
@font-face{font-family:'CPP Lato';font-weight:700;font-display:swap;src:url('Lato-700.woff2') format('woff2')}
#cpp-root{--night:#141414;--orange:#EB7C31;--orange-deep:#D96C22;--cream:#FFFBF0;--mute:#8C8375;
  --display:'CPP Garage','Garage Gothic','Big Shoulders Display',Oswald,'Arial Narrow',sans-serif;
  --body:'CPP Lato','Lato',-apple-system,'Helvetica Neue',Arial,sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);font-family:var(--body);font-weight:300;line-height:1.55;color:#222}
#cpp-root *,#cpp-root *::before,#cpp-root *::after{box-sizing:border-box}
#cpp-root [hidden]{display:none!important}
#cpp-root .cpp-scrim{position:fixed;inset:0;z-index:2147482000;background:rgba(20,20,20,.55)}
#cpp-root .cpp-pop{position:fixed;z-index:2147482001;background:var(--orange);padding:10px;box-shadow:0 18px 50px rgba(0,0,0,.4)}
#cpp-root .cpp-inner{background:var(--cream);border-radius:16px;overflow:hidden;position:relative}
#cpp-root .cpp-band{background:var(--night);color:var(--orange);font-family:var(--display);font-weight:700;text-transform:uppercase;line-height:1;text-align:center;position:relative;margin:0}
#cpp-root .cpp-band small{display:block;color:#F5EEE0;font-family:var(--body);font-weight:300;text-transform:none}
#cpp-root .cpp-bat{position:absolute;top:50%;width:34px;height:auto;margin-top:-12px;filter:brightness(0) invert(1);opacity:.6;animation:cpp-drift 6s ease-in-out infinite}
#cpp-root .cpp-bat.l{left:18px}#cpp-root .cpp-bat.r{right:58px;width:26px;animation-delay:-3s}
@keyframes cpp-drift{0%,100%{transform:translate(0,0) rotate(-4deg)}50%{transform:translate(5px,-5px) rotate(4deg)}}
#cpp-root .cpp-hero{display:block;width:100%;height:auto;aspect-ratio:800/448;object-fit:cover;background:#2a2a2a;margin:0;max-width:none}
#cpp-root .cpp-copy{text-align:center}
#cpp-root .cpp-h{font-family:var(--display);font-weight:700;text-transform:uppercase;line-height:1;letter-spacing:0;color:var(--orange);margin:0}
#cpp-root .cpp-p{margin:0 auto;color:#222}
#cpp-root .cpp-p b{font-weight:700}
#cpp-root .cpp-price{font-family:var(--display);font-weight:700;color:var(--night);line-height:1}
#cpp-root .cpp-price span{font-family:var(--body);font-weight:300;color:var(--mute)}
#cpp-root .cpp-btn{display:inline-block;font-family:var(--display);font-weight:700;line-height:1;text-transform:uppercase;text-decoration:none;color:var(--night);background:var(--orange);border:0;border-radius:100em;padding:.42em 1.1em .36em;box-shadow:0 .15em .65em rgba(0,0,0,.25);cursor:pointer;transition:background-color .4s linear,transform .16s var(--ease)}
#cpp-root .cpp-btn:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){#cpp-root .cpp-btn:hover{background:var(--orange-deep);color:var(--night)}}
#cpp-root .cpp-later{display:block;margin:10px auto 0;padding:4px 8px;color:var(--mute);text-decoration:underline;text-underline-offset:3px;background:none;border:0;cursor:pointer;font-family:var(--body);font-weight:300;font-size:13px;line-height:1.4}
#cpp-root .cpp-x{position:absolute;top:8px;right:10px;z-index:3;width:34px;height:34px;padding:0;border-radius:50%;border:0;background:var(--orange);color:var(--night);font:700 19px/34px var(--body);cursor:pointer;transition:transform .16s var(--ease)}
#cpp-root .cpp-x:active{transform:scale(.97)}
#cpp-root .cpp-mute{position:absolute;top:8px;right:52px;z-index:3;width:34px;height:34px;padding:0;border-radius:50%;border:0;background:rgba(245,238,224,.16);font:400 15px/34px var(--body);cursor:pointer;transition:transform .16s var(--ease)}
#cpp-root .cpp-mute:active{transform:scale(.97)}
#cpp-root .desk.sound .cpp-bat.r{right:96px}
#cpp-root .mob.sound .cpp-band{padding-left:46px;padding-right:96px}
#cpp-root .cpp-pop:focus{outline:none}
#cpp-root :focus-visible{outline:3px solid var(--night);outline-offset:3px}
#cpp-root .cpp-band :focus-visible,#cpp-root .cpp-x:focus-visible{outline-color:#F5EEE0}

/* desktop: centered card */
#cpp-root .cpp-pop.desk{left:50%;top:50%;width:600px;max-width:calc(100vw - 32px);max-height:calc(100vh - 32px);overflow:auto;transform:translate(-50%,-50%);border-radius:26px}
#cpp-root .desk .cpp-band{font-size:32px;padding:14px 60px 12px}
#cpp-root .desk .cpp-band small{font-size:13.5px;margin-top:5px}
#cpp-root .desk .cpp-copy{padding:20px 40px 22px}
#cpp-root .desk .cpp-h{font-size:48px;margin:0 0 8px}
#cpp-root .desk .cpp-p{font-size:15.5px;max-width:440px;margin-bottom:14px}
#cpp-root .desk .cpp-row{display:flex;align-items:center;justify-content:center;gap:22px}
#cpp-root .desk .cpp-price{font-size:36px;text-align:left}
#cpp-root .desk .cpp-price span{display:block;font-size:13px;margin-top:4px}
#cpp-root .desk .cpp-btn{font-size:29px}

/* mobile: bottom sheet, never full screen */
#cpp-root .cpp-pop.mob{left:0;right:0;bottom:0;max-height:88vh;overflow:auto;border-radius:26px 26px 0 0;padding:8px 8px 0}
#cpp-root .mob .cpp-inner{border-radius:18px 18px 0 0}
#cpp-root .mob .cpp-band{font-size:24.5px;padding:12px 50px 10px}
#cpp-root .mob .cpp-band small{font-size:12px;margin-top:4px}
#cpp-root .mob .cpp-bat.l{left:10px;width:26px}#cpp-root .mob .cpp-bat.r{right:auto;left:42px;top:30%;width:18px}
#cpp-root .mob .cpp-copy{padding:14px 18px calc(18px + env(safe-area-inset-bottom))}
#cpp-root .mob .cpp-h{font-size:38px;margin:0 0 6px}
#cpp-root .mob .cpp-p{font-size:14px;margin-bottom:10px}
#cpp-root .mob .cpp-price{font-size:28px;margin-bottom:12px}
#cpp-root .mob .cpp-price span{font-size:12.5px;margin-left:6px}
#cpp-root .mob .cpp-btn{display:block;font-size:26.5px}

/* the reopen tab left after a dismiss */
#cpp-root .cpp-tab{position:fixed;left:18px;bottom:18px;z-index:2147481999;font-family:var(--display);font-weight:700;font-size:21px;line-height:1;text-transform:uppercase;background:var(--night);color:var(--orange);border:0;border-radius:100em;padding:10px 16px 9px;box-shadow:0 .15em .65em rgba(0,0,0,.25);cursor:pointer;transition:transform .16s var(--ease)}
#cpp-root .cpp-tab:active{transform:scale(.97)}

/* entrance and exit */
#cpp-root .desk.in{animation:cpp-in-desk .4s var(--ease) both}
#cpp-root .mob.in{animation:cpp-in-mob .4s var(--ease) both}
#cpp-root .cpp-scrim.in{animation:cpp-fade .4s linear both}
#cpp-root .desk.out{animation:cpp-out-desk .2s ease-in both}
#cpp-root .mob.out{animation:cpp-out-mob .25s ease-in both}
#cpp-root .cpp-scrim.out{animation:cpp-fade .2s linear reverse both}
@keyframes cpp-in-desk{from{opacity:0;transform:translate(-50%,-46%) scale(.96)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes cpp-out-desk{from{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-48%) scale(.98)}}
@keyframes cpp-in-mob{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes cpp-out-mob{from{transform:translateY(0)}to{transform:translateY(100%)}}
@keyframes cpp-fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){
  #cpp-root .cpp-bat{animation:none}
  #cpp-root .desk.in,#cpp-root .mob.in{animation:cpp-fade .3s linear both}
  #cpp-root .desk.out,#cpp-root .mob.out{animation:cpp-fade .2s linear reverse both}
}