#cbf-root, #cbf-root * { box-sizing: border-box; margin: 0; padding: 0; }
  #cbf-root { --red: #e1000f; --red-2: #ff2a2a; --red-dark: #7a0008; --cream: #f1ece2; --ink: #0b0506;
    position: fixed; inset: auto auto 0 0; z-index: 2147483000; pointer-events: none;
    font-family: 'Montserrat', system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
  #cbf-root.cbf-open { pointer-events: auto; }

  /* ---------- fundo escuro (só aparece no mobile) ---------- */
  #cbf-root .cbf-backdrop { display: none; }

  /* ---------- cartão (desktop: canto inferior esquerdo) ---------- */
  #cbf-root .cbf-card {
    position: fixed; left: 24px; bottom: 24px; width: 21.25em; font-size: 16px;
    padding: 1.6em 1.4em 1.1em; border-radius: 1.1em; overflow: hidden; color: #fff; text-align: center;
    background:
      linear-gradient(118deg, transparent 63%, rgba(255,20,30,.75) 63.6%, transparent 64.6%),
      linear-gradient(118deg, transparent 70%, rgba(255,40,40,.22) 71%, transparent 76%),
      linear-gradient(118deg, transparent 12%, rgba(255,20,30,.35) 12.5%, transparent 13.4%),
      radial-gradient(120% 55% at 0% 0%, rgba(170,0,12,.55), transparent 62%),
      radial-gradient(100% 50% at 100% 100%, rgba(150,0,10,.55), transparent 60%),
      var(--ink);
    border: 1px solid rgba(255,40,40,.35);
    box-shadow: 0 1.4em 3em rgba(0,0,0,.55), 0 0 0 1px rgba(0,0,0,.6), 0 0 2.4em rgba(225,0,15,.25);
    opacity: 0; transform: translateY(1.5em) scale(.97); transition: opacity .45s ease, transform .45s cubic-bezier(.2,.9,.25,1.15);
  }
  #cbf-root.cbf-open .cbf-card { opacity: 1; transform: none; }

  /* ---------- fechar ---------- */
  #cbf-root .cbf-close { all: unset; position: absolute; top: .55em; right: .55em; width: 2em; height: 2em; border-radius: 50%;
    display: grid; place-items: center; cursor: pointer; color: #fff; background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.18); font: 700 1.05em/1 'Montserrat', sans-serif; transition: background .2s; z-index: 3; }
  #cbf-root .cbf-close:hover, #cbf-root .cbf-close:focus-visible { background: var(--red); border-color: var(--red); }

  /* ---------- título ---------- */
  #cbf-root .cbf-black, #cbf-root .cbf-friday { font-family: 'Archivo Black', sans-serif; font-size: 3.55em; line-height: .86; letter-spacing: -.01em; }
  #cbf-root .cbf-black { color: #fff; text-shadow: 0 .06em .25em rgba(0,0,0,.6); }
  #cbf-root .cbf-friday { background: linear-gradient(180deg, var(--red-2) 0%, var(--red) 45%, var(--red-dark) 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 .05em .2em rgba(225,0,15,.45)); }

  #cbf-root .cbf-tag { position: relative; display: inline-flex; align-items: center; gap: .3em; margin-top: -.15em;
    padding: .4em .9em .38em; background: var(--cream); transform: rotate(-2deg);
    clip-path: polygon(0 12%,4% 0,9% 9%,15% 2%,22% 8%,30% 1%,38% 7%,46% 0,54% 8%,62% 2%,70% 9%,78% 1%,86% 7%,93% 0,100% 10%,98% 50%,100% 90%,94% 100%,87% 92%,79% 99%,71% 91%,63% 100%,55% 93%,47% 100%,39% 92%,31% 99%,23% 91%,15% 100%,8% 93%,0 98%,2% 52%); }
  #cbf-root .cbf-tag span { font-family: 'Archivo Black', sans-serif; font-size: 1.32em; color: #c3000d; letter-spacing: .01em; line-height: 1; }
  #cbf-root .cbf-tag svg { width: 1.4em; height: 1.4em; }

  #cbf-root .cbf-sub { margin-top: .95em; font-family: 'Archivo Black', sans-serif; font-size: 1.05em; line-height: 1.05; text-transform: uppercase; color: #fff; }
  #cbf-root .cbf-sub b { display: block; color: var(--red-2); font-size: 1.3em; font-weight: 400; }
  #cbf-root .cbf-sub::after { content: ""; display: block; width: 62%; height: .2em; margin: .35em auto 0; border-radius: 1em;
    background: linear-gradient(90deg, transparent, var(--red) 25%, var(--red) 75%, transparent); transform: rotate(-1.5deg); }

  /* ---------- oferta ---------- */
  #cbf-root .cbf-offer { display: flex; align-items: center; justify-content: center; gap: .55em; margin-top: .8em; }
  #cbf-root .cbf-site { font-family: 'Anton', sans-serif; font-size: 2.4em; line-height: .9; text-align: left; color: #fff; text-transform: uppercase; }
  #cbf-root .cbf-pct { text-align: left; }
  #cbf-root .cbf-pct small { display: block; font: 900 .78em/1 'Montserrat', sans-serif; letter-spacing: .02em; margin-bottom: .1em; }
  #cbf-root .cbf-num { display: flex; align-items: center; }
  #cbf-root .cbf-80 { font-family: 'Archivo Black', sans-serif; font-size: 4.9em; line-height: .82; letter-spacing: -.04em;
    background: linear-gradient(180deg, var(--red-2), var(--red) 50%, var(--red-dark)); -webkit-background-clip: text; background-clip: text; color: transparent; }
  #cbf-root .cbf-pc { display: flex; flex-direction: column; align-items: flex-start; margin-left: .12em; font-family: 'Archivo Black', sans-serif; line-height: .85; }
  #cbf-root .cbf-pc i { font-style: normal; }
  #cbf-root .cbf-pc i:first-child { font-size: 2em; color: var(--red-2); }
  #cbf-root .cbf-pc i:last-child { font-size: 1.35em; color: #fff; }

  /* ---------- cupom (ticket) ---------- */
  #cbf-root .cbf-ticket { position: relative; display: flex; align-items: center; gap: .6em; margin-top: 1em; padding: .65em 2.1em .65em .9em;
    background: var(--cream); color: var(--ink); border-radius: .35em; transform: rotate(-1.5deg);
    -webkit-mask: radial-gradient(circle .5em at 0 50%, transparent 98%, #000) left / 51% 100% no-repeat, radial-gradient(circle .5em at 100% 50%, transparent 98%, #000) right / 51% 100% no-repeat;
            mask: radial-gradient(circle .5em at 0 50%, transparent 98%, #000) left / 51% 100% no-repeat, radial-gradient(circle .5em at 100% 50%, transparent 98%, #000) right / 51% 100% no-repeat; }
  #cbf-root .cbf-ticket::after { content: ""; position: absolute; right: .7em; top: .55em; bottom: .55em; width: .95em;
    background: repeating-linear-gradient(180deg, var(--ink) 0 2px, transparent 2px 3px, var(--ink) 3px 4px, transparent 4px 6px, var(--ink) 6px 9px, transparent 9px 10px); }
  #cbf-root .cbf-ticket-l { font-family: 'Archivo Black', sans-serif; font-size: .95em; line-height: 1; text-align: left; text-transform: uppercase; }
  #cbf-root .cbf-ticket-l em { display: block; font-style: normal; font-size: .8em; margin-top: .25em; }
  #cbf-root .cbf-code { all: unset; flex: 1; cursor: pointer; display: flex; flex-direction: column; align-items: center; padding: .3em .5em .32em;
    background: linear-gradient(180deg, #e3000f, #a8000b); color: #fff; border-radius: .3em; transform: skewX(-6deg);
    box-shadow: inset 0 -.15em 0 rgba(0,0,0,.25); transition: transform .15s, filter .15s; }
  #cbf-root .cbf-code:hover, #cbf-root .cbf-code:focus-visible { filter: brightness(1.12); transform: skewX(-6deg) scale(1.03); }
  #cbf-root .cbf-code strong { font-family: 'Archivo Black', sans-serif; font-weight: 400; font-size: 1.75em; line-height: 1; letter-spacing: .02em; }
  #cbf-root .cbf-code small { font: 800 .6em/1 'Montserrat', sans-serif; letter-spacing: .14em; text-transform: uppercase; opacity: .9; margin-top: .25em; }

  /* ---------- CTA ---------- */
  #cbf-root .cbf-cta { display: block; margin-top: 1.05em; padding: .95em 1em; border-radius: .6em; text-decoration: none !important;
    background: linear-gradient(180deg, #ff1f2b, #c2000d); color: #fff !important; font: 900 1.02em/1 'Montserrat', sans-serif; letter-spacing: .04em; text-transform: uppercase;
    box-shadow: 0 .5em 1.4em rgba(225,0,15,.45), inset 0 1px 0 rgba(255,255,255,.3); animation: cbf-pulse 2.2s ease-in-out infinite; transition: filter .2s; }
  #cbf-root .cbf-cta:hover, #cbf-root .cbf-cta:focus-visible { filter: brightness(1.1); }
  @keyframes cbf-pulse { 0%,100% { box-shadow: 0 .5em 1.4em rgba(225,0,15,.45), 0 0 0 0 rgba(255,31,43,.55); } 50% { box-shadow: 0 .5em 1.4em rgba(225,0,15,.45), 0 0 0 .45em rgba(255,31,43,0); } }

  #cbf-root .cbf-brand { margin-top: .85em; font: 600 .68em/1.3 'Montserrat', sans-serif; color: rgba(255,255,255,.6) !important; }
  #cbf-root .cbf-brand b { color: #fff; font-weight: 800; }

  /* ---------- MOBILE: central, ocupando a tela ---------- */
  @media (max-width: 767px) {
    #cbf-root { inset: 0; }
    #cbf-root .cbf-backdrop { display: block; position: fixed; inset: 0; background: rgba(6,2,3,.86); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
      opacity: 0; transition: opacity .35s ease; }
    #cbf-root.cbf-open .cbf-backdrop { opacity: 1; }
    #cbf-root .cbf-card { left: 50%; top: 50%; bottom: auto; font-size: min(calc(92vw / 21.25), 20px);
      max-height: 94vh; max-height: 94dvh; overflow-y: auto; transform: translate(-50%, -46%) scale(.94); }
    #cbf-root.cbf-open .cbf-card { transform: translate(-50%, -50%); }
  }

  @media (prefers-reduced-motion: reduce) {
    #cbf-root .cbf-card, #cbf-root .cbf-backdrop { transition: none; }
    #cbf-root .cbf-cta { animation: none; }
  }

/* Integração no blog: ocultação real e rolagem contida em telas baixas. */
#cbf-root[hidden] { display: none !important; }
#cbf-root .cbf-card { max-height: calc(100vh - 48px); max-height: calc(100dvh - 48px); overflow-y: auto; overscroll-behavior: contain; }
#cbf-root .cbf-close { min-width: 40px; min-height: 40px; }
#cbf-root .cbf-close:focus-visible, #cbf-root .cbf-code:focus-visible, #cbf-root .cbf-cta:focus-visible { outline: 2px solid var(--cream); outline-offset: 3px; }
@media (max-width: 767px) { #cbf-root { overscroll-behavior: contain; } #cbf-root .cbf-card { max-height: 94vh; max-height: 94dvh; } }

