/* The red IT'S FREE stamp (CEO, 30 Oct 2026), slammed over every "spot/track your elf" heading and button
   by js/free-stamp.js. Same stamp and the same slam as the email's GIF (scripts/make-email-stamp.py). */
.free-stamp{position:absolute;pointer-events:none;z-index:6;height:auto;max-width:none;opacity:0;transform-origin:50% 50%}
.free-stamp--head{width:clamp(96px,2.6em,160px)}
.free-stamp-wrap{position:relative;display:inline-block;max-width:100%}
.free-stamp-wrap>.button,.free-stamp-wrap>.hm-cta,.free-stamp-wrap>.g-btn,.free-stamp-wrap>.btn{display:inline-flex}
.free-stamp--btn{width:clamp(74px,7vw,88px);top:calc(50% - 32px);left:calc(100% + 6px)}
.free-stamp--nav{width:74px;top:calc(100% - 16px);right:-6px}
/* every stamp (Paul, 30 Oct 2026: "do the same"): slams in 1.5 seconds after it comes on screen, lights up red,
   flickers like a sign coming on, then gives the odd flicker */
.free-stamp.on{animation:freeSlam .52s linear 3s forwards,freeLight 1.3s steps(1,end) 3.55s forwards,freeFlicker 6s linear 4.9s infinite}   /* lands at 3 seconds (Paul, 31 Oct 2026) */
@keyframes freeSlam{
  0%{opacity:.14;transform:scale(1.6)}
  12%{opacity:.27;transform:scale(1.38)}
  24%{opacity:.42;transform:scale(1.18)}
  33%{opacity:.6;transform:scale(1.05)}
  44%{opacity:1;transform:translate(3px,2px) scale(1.1,.88)}
  56%{transform:translate(-2px,-1px) scale(.96,1.05)}
  67%{transform:translate(1px,0) scale(1.02,.98)}
  100%{opacity:.9;transform:none}
}
/* a stamp a page draws in its own flow (the Elf Tracker's "free" stamp above its heading) */
.tn-free-stamp{margin:0 0 2px}
.free-stamp--inline{position:relative;display:block;width:clamp(150px,36vw,180px);margin-left:-8px}
/* the one big stamp beside a main button (Paul, 30 Oct 2026) */
.free-stamp--big{width:clamp(140px,13vw,170px);top:calc(50% - 38px);left:calc(100% + 6px);z-index:40}
@keyframes freeLight{
  0%{filter:none}
  8%{filter:drop-shadow(0 0 6px rgba(255,40,80,.95)) drop-shadow(0 0 18px rgba(255,60,100,.7)) brightness(1.2)}
  14%{filter:none}
  22%{filter:drop-shadow(0 0 6px rgba(255,40,80,.95)) drop-shadow(0 0 18px rgba(255,60,100,.7)) brightness(1.2)}
  27%{filter:brightness(.85)}
  38%{filter:drop-shadow(0 0 6px rgba(255,40,80,.95)) drop-shadow(0 0 18px rgba(255,60,100,.7)) brightness(1.2)}
  44%{filter:none}
  52%,100%{filter:drop-shadow(0 0 5px rgba(255,40,80,.9)) drop-shadow(0 0 16px rgba(255,60,100,.55)) brightness(1.15)}
}
@keyframes freeFlicker{
  0%,88%,90%,93%,100%{opacity:.95}
  89%{opacity:.45}
  92%{opacity:.6}
}
@media (prefers-reduced-motion:reduce){.free-stamp.on{animation:none;opacity:.9}}
/* phones: a full-width button keeps its full width, and the stamp sits on its top right corner */
@media (max-width:760px){
  .free-stamp-wrap{display:flex;width:100%}
  .free-stamp-wrap>.button,.free-stamp-wrap>.hm-cta,.free-stamp-wrap>.g-btn,.free-stamp-wrap>.btn{flex:1 1 auto}
  .free-stamp-wrap--nav{display:inline-block;width:auto}
  .free-stamp--btn{width:68px;top:-34px;left:auto;right:-4px}
  .free-stamp--big{width:110px;top:-58px;left:auto;right:-4px}
  .free-stamp-wrap:has(>.free-stamp--big){margin-top:26px}   /* Paul's mock-up, 31 Oct 2026: tighter under the lead text */
  .free-stamp-wrap>.hm-cta{margin-top:0}
}
/* Stamps never cover words (Paul, 1 Nov 2026): it sat on the end of "Here for the Elf Tracker? This is not it.",
   on longer button words ("Encontrar o meu elfo") and on heading words in every language. */
/* a heading's stamp sits in its own gutter at the heading's right end, beside the words, never on them
   (js/free-stamp.js still sets left/top to catch the last letters: overridden here) */
:is(h1,h2,h3):has(>.free-stamp--head){padding-right:calc(clamp(64px,2.4em,96px) + 10px)}
.free-stamp.free-stamp--head{width:clamp(64px,2.4em,96px);left:auto!important;right:0;top:calc(50% - clamp(64px,2.4em,96px) * .39)!important}
/* computers: the stamp beside a button stays inside the button's own height */
.free-stamp--btn{width:clamp(70px,6vw,80px);top:calc(50% - 31px)}
/* phones: the stamp sits in its own space above the button's right end, over no words at all */
@media (max-width:760px){
  .free-stamp-wrap:has(>.free-stamp--btn){margin-top:48px}
  .free-stamp--btn{width:68px;top:-52px;left:auto;right:2px}
  .free-stamp-wrap:has(>.free-stamp--big){margin-top:76px}
  .free-stamp--big{width:100px;top:-80px;left:auto;right:2px}
}
/* Round 1 (2 Nov 2026, 375 wide): no big empty band above the button. On a full-width phone button the words sit in
   the middle, so the stamp can sit on the button's top right corner (still over no words) with only a small gap. */
@media (max-width:760px){
  .free-stamp-wrap:has(>.free-stamp--big){margin-top:34px}
  .free-stamp--big{width:84px;top:-40px;right:-2px}
  .free-stamp-wrap:has(>.free-stamp--btn){margin-top:24px}
  .free-stamp--btn{width:60px;top:-30px;right:-2px}
}
/* No jump on phones (Paul, 3 Nov 2026: "a bit jumpy"): the hero button's FREE stamp arrives a moment after the page
   shows and its space (34px above the button, below) pushed the button and the camera down. The same space is
   kept for it from the start; once stamped, the wrapper's own margin takes over (the button's goes to 0). */
@media (max-width:760px){
  .hm-cta[data-free-stamp="big"]:not([data-free-stamped]){margin-top:34px}
}
