/* Agenda de Dezembro — grunge / scrapbook editorial (preto e branco + vermelho + dourado). 9:16 em cqw. */
:root {
  --preto: #0E0D0C; --tinta: #161412; --cinza: #5C5853; --papel: #EFEDE8; --verm: #A3161D; --ouro: #B88A2E;
  --g: "Anton", Impact, "Arial Narrow", sans-serif; --s: "Caveat Brush", "Comic Sans MS", cursive;
  --m: "Special Elite", "Courier New", monospace; --t: "Archivo Narrow", "Arial Narrow", sans-serif; --a: "Mrs Saint Delafield", cursive;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; background: #1A1918; font-family: var(--t); color: var(--tinta); }
h1, h2, p, ul, ol, figure { margin: 0; padding: 0; }
button { font: inherit; border: 0; cursor: pointer; }
#paginas { max-width: 480px; margin: 0 auto; padding: 10px 8px 90px; display: flex; flex-direction: column; gap: 12px; }
.pg { position: relative; aspect-ratio: 9/16; overflow: hidden; border-radius: 14px; container-type: inline-size; font-size: 3.4cqw; line-height: 1.35; box-shadow: 0 14px 34px -14px rgba(0,0,0,.8); }
.pg > * { position: absolute; z-index: 2; }
.fundo { inset: 0; z-index: 0 !important; background-size: cover; background-position: center; }
.granulado { inset: 0; z-index: 1 !important; pointer-events: none; opacity: .22; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.granulado--cl { opacity: .14; mix-blend-mode: multiply; }
.contador { top: 3cqw; left: 3cqw; z-index: 9 !important; font: 600 2.5cqw var(--t); color: #fff; background: rgba(0,0,0,.7); padding: .5cqw 2cqw; border-radius: 99px; }
.script { font-family: var(--s); font-weight: 400; }
.ic { width: 5cqw; height: 5cqw; flex: none; }
.rb { width: 7cqw; height: auto; z-index: 3 !important; }
.rb--preto { color: var(--tinta); } .rb--branco { color: #fff; filter: drop-shadow(0 0 .6cqw rgba(0,0,0,.6)); }
.arroba { left: 0; right: 0; bottom: 4.4cqw; text-align: center; font: 400 3.3cqw var(--m); color: var(--tinta); z-index: 4 !important; }
.estrelas { width: 26cqw; height: 26cqw; color: var(--tinta); z-index: 3 !important; }
.estrelas .rb { position: absolute; }
.estrelas .e1 { width: 11cqw; left: 3cqw; top: 0; transform: rotate(8deg); } .estrelas .e2 { width: 8cqw; left: 14cqw; top: 9cqw; transform: rotate(-12deg); }
.estrelas .e3 { width: 13cqw; left: 6cqw; top: 13cqw; } .estrelas .e4 { width: 6cqw; left: 0; top: 13cqw; }
/* títulos: script + condensada gigante (como no Canva) */
.tt { left: 0; right: 0; text-align: center; font-weight: 400; line-height: .9; z-index: 4 !important; }
.tt__s { display: block; font-family: var(--s); font-size: 11cqw; line-height: 1; transform: rotate(-3deg); margin-bottom: -1.4cqw; }
.tt__s--ouro { color: var(--ouro); }
.tt__g { display: block; font-family: var(--g); font-size: 17cqw; letter-spacing: -.01em; white-space: nowrap; text-shadow: .5cqw .5cqw 0 rgba(0,0,0,.08); }
.sub-script { left: 0; right: 0; text-align: center; font: 400 4.6cqw var(--s); color: var(--ouro); top: 47cqw; transform: rotate(-2deg); z-index: 4 !important; }
/* recortes */
.caderno { background: url(../img/caderno.webp) center / 100% 100% no-repeat; filter: drop-shadow(0 1.4cqw 2cqw rgba(0,0,0,.28)); }
.caderno > * { position: absolute; }
.fita { width: 26cqw; z-index: 5; opacity: .92; }
.fita--a { left: 50%; top: -2.4cqw; transform: translateX(-50%) rotate(-4deg); }
.laco-preto { width: 13cqw; left: 3cqw; top: -5cqw; transform: rotate(-16deg); filter: drop-shadow(0 .6cqw .8cqw rgba(0,0,0,.3)); }
.postit { width: 24cqw; filter: drop-shadow(0 1cqw 1.4cqw rgba(0,0,0,.3)); }
.mulher { filter: grayscale(1) contrast(1.12) brightness(1.02) drop-shadow(0 2cqw 4cqw rgba(0,0,0,.6)); }

/* 1 capa */
.eco { left: -4cqw; right: -4cqw; text-align: center; font-family: var(--g); color: rgba(255,255,255,.07); white-space: nowrap; line-height: .8; z-index: 1 !important; }
.eco--topo { top: -3cqw; font-size: 34cqw; }
.eco--base { bottom: -2cqw; font-size: 16cqw; }
.capa__mes { left: 0; right: 0; top: 13cqw; text-align: center; font-family: var(--g); line-height: .84; z-index: 2 !important; }
.capa__mes span { display: block; font-size: 25cqw; letter-spacing: -.01em; color: #fff; transform: rotate(-3deg); }
.capa__mes span:last-child { color: transparent; -webkit-text-stroke: .45cqw #fff; transform: rotate(-3deg) translateX(2cqw); }
.rasgo { width: 130cqw; left: -15cqw; filter: drop-shadow(0 1cqw 2cqw rgba(0,0,0,.6)); }
.rasgo--capa { top: 64cqw; transform: rotate(-6deg); opacity: .96; z-index: 2 !important; }
.mulher--capa { left: 10cqw; width: 80cqw; top: 46cqw; z-index: 3 !important; }
.capa__selo { left: 9cqw; right: 9cqw; bottom: 15cqw; padding: 3.6cqw 4cqw 3cqw; text-align: center; border: .4cqw solid #fff; border-radius: 99px; background: rgba(14,13,12,.82); z-index: 5 !important; box-shadow: 0 0 0 1.2cqw rgba(14,13,12,.82), 0 0 0 1.5cqw rgba(255,255,255,.5); }
.capa__selo h1 { font: 400 8.4cqw var(--g); letter-spacing: .03em; color: #fff; text-transform: uppercase; white-space: nowrap; line-height: 1; }
.capa__selo h1 .script { text-transform: none; font-size: 8cqw; color: #E9C77C; letter-spacing: 0; margin-right: 1cqw; }
.capa__selo p { margin-top: 1.4cqw; display: flex; align-items: center; justify-content: center; gap: 1.4cqw; font: 400 3cqw var(--m); color: #ddd; }
.capa__selo .ic { width: 3.8cqw; height: 3.8cqw; }

/* 2 contagem */
.estatua { right: -10cqw; top: 66cqw; width: 50cqw; filter: grayscale(1) contrast(1.15); transform: scaleX(-1) rotate(-4deg); z-index: 1 !important; }
.pg--cont .postit { left: 3cqw; top: 112cqw; transform: rotate(-12deg); z-index: 1 !important; }
.tt--cont { top: 13cqw; }
.caderno--cont { left: 9cqw; width: 74cqw; top: 56cqw; height: 72cqw; transform: rotate(-2deg); }
.datas { list-style: none; left: 10cqw; right: 7cqw; top: 15cqw; display: flex; flex-direction: column; gap: 5.4cqw; }
.datas li { display: flex; align-items: baseline; gap: 2.4cqw; font: 400 6cqw var(--s); line-height: 1.05; color: var(--tinta); }
.datas b { font: 400 6.6cqw var(--g); color: var(--tinta); }
.datas b::after { content: " –"; font-family: var(--s); }
.datas li:last-child b { color: var(--verm); }
.estrelas--cont { right: 8cqw; bottom: 16cqw; }

/* 3 calendário */
.jornal--cal { right: -10cqw; bottom: 8cqw; width: 44cqw; transform: rotate(-9deg); filter: grayscale(1) drop-shadow(0 1cqw 1.4cqw rgba(0,0,0,.25)); z-index: 1 !important; }
.pinheiro { left: -6cqw; bottom: 4cqw; width: 26cqw; transform: rotate(18deg); z-index: 1 !important; filter: drop-shadow(0 1cqw 1.2cqw rgba(0,0,0,.25)); }
.tt--cal { top: 9cqw; }
.cal { left: 7cqw; right: 7cqw; top: 48cqw; display: grid; grid-template-columns: repeat(7, 1fr); row-gap: 2.6cqw; text-align: center; z-index: 4 !important; }
.cs { font: 600 3.8cqw var(--t); color: var(--tinta); padding-bottom: 2.6cqw; }
.cs--dom { color: var(--ouro); }
.cd { position: relative; display: grid; place-items: center; height: 9cqw; font: 400 5cqw var(--t); color: var(--tinta); }
.cd i { position: relative; font-style: normal; z-index: 1; }
.cd svg { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.cd__dom { width: 9.6cqw; color: var(--ouro); } .cd--dom i { color: var(--ouro); }
.cd__c { width: 10cqw; color: var(--tinta); }
.cd--f i { opacity: 0; } .cd__x { width: 7.4cqw; color: var(--tinta); }
.legenda { left: 9cqw; right: 26cqw; top: 122cqw; list-style: none; display: flex; flex-direction: column; gap: 2.4cqw; font: 400 3.2cqw var(--m); color: var(--tinta); z-index: 4 !important; }
.legenda li { display: flex; align-items: center; gap: 2.6cqw; }
.lg--dom { display: inline-grid; place-items: center; width: 7cqw; height: 7cqw; border: .3cqw solid var(--ouro); border-radius: 50%; font: 600 2.4cqw var(--t); color: var(--ouro); }
.lg-x { width: 6cqw; margin: 0 .5cqw; } .lg-c { width: 7cqw; }
.estrelas--cal { right: 6cqw; top: 112cqw; }

/* 4 horários */
.foto-pb { filter: grayscale(1) contrast(1.15); box-shadow: 0 1.4cqw 2.4cqw rgba(0,0,0,.35); }
.foto-pb--hor { left: -6cqw; bottom: 9cqw; width: 42cqw; aspect-ratio: 4/5; object-fit: cover; transform: rotate(-8deg); border: 1.6cqw solid #fff; border-bottom-width: 6cqw; z-index: 1 !important; }
.fita--b { left: 4cqw; bottom: 62cqw; transform: rotate(-36deg); width: 20cqw; z-index: 3 !important; }
.tt--hor { top: 10cqw; } .tt--hor .tt__g { font-size: 15cqw; }
.caderno--hor { left: 7cqw; right: 7cqw; top: 44cqw; height: 88cqw; transform: rotate(1deg); }
.hor { list-style: none; left: 13cqw; right: 6cqw; top: 9cqw; display: flex; flex-direction: column; gap: 1.6cqw; font: 600 3.8cqw var(--t); text-transform: uppercase; }
.hor span { color: var(--ouro); }
.hor-av { list-style: none; left: 12cqw; right: 5cqw; top: 30cqw; display: flex; flex-direction: column; gap: 6cqw; }
.hor-av li { position: relative; display: flex; align-items: flex-start; gap: 2cqw; }
.hor-av p { flex: 1; font: 600 3.5cqw var(--t); color: var(--verm); line-height: 1.3; }
.hor-av strong { color: var(--verm); text-decoration: underline wavy rgba(163,22,29,.4); text-underline-offset: .8cqw; }
.hor-av__e { width: 5.6cqw; flex: none; color: var(--ouro); }
.hor-av__x { width: 6cqw; flex: none; color: var(--tinta); transform: rotate(10deg); }
.hor-rod { left: 12cqw; right: 6cqw; bottom: 8cqw; font: 400 2.7cqw var(--m); color: var(--cinza); }
.estrelas--hor { right: 5cqw; bottom: 9cqw; }

/* 5 informações */
.fitaverm { left: 8cqw; top: -2cqw; width: 8cqw; z-index: 3 !important; filter: drop-shadow(0 .8cqw 1cqw rgba(0,0,0,.3)); }
.tt--info { top: 9cqw; left: 12cqw; }
.tt--info .tt__g { font-size: 14cqw; }
.tt__aviso { display: block; margin-top: 2cqw; font: 700 3cqw var(--t); letter-spacing: .14em; color: var(--verm); text-transform: uppercase; }
.info { left: 5cqw; right: 5cqw; top: 46cqw; list-style: none; display: flex; flex-direction: column; z-index: 4 !important; }
.info li { display: flex; gap: 3.4cqw; align-items: flex-start; padding: 4cqw 2cqw; border-top: .5cqw solid var(--tinta); }
.info li:last-child { border-bottom: .5cqw solid var(--tinta); }
.info__ic { width: 10cqw; height: 10cqw; padding: 1.6cqw; border: .45cqw solid var(--verm); border-radius: 50%; color: var(--verm); }
.info b { display: block; font: 700 3.7cqw var(--t); text-transform: uppercase; color: var(--verm); text-decoration: underline; text-underline-offset: .6cqw; }
.info p { margin-top: 1cqw; font: 400 3.3cqw var(--t); color: var(--tinta); }
.info strong { font-weight: 700; }
.estrelas--info { right: 2cqw; bottom: 4cqw; width: 22cqw; height: 22cqw; transform: scale(.8); }

/* 6 sinal e pagamento */
.bola { right: -4cqw; top: 3cqw; width: 26cqw; transform: rotate(14deg); filter: drop-shadow(0 1.4cqw 1.6cqw rgba(0,0,0,.35)); }
.tt--sinal { top: 9cqw; left: 10cqw; right: 16cqw; } .tt--sinal .tt__g { font-size: 14cqw; }
.sinal { left: 8cqw; width: 46cqw; top: 46cqw; }
.sinal__v { font: 400 13cqw var(--g); line-height: 1; color: var(--verm); }
.sinal__v span { display: block; font: 700 2.8cqw var(--t); letter-spacing: .2em; color: var(--tinta); text-transform: uppercase; margin-bottom: 1.4cqw; }
.sinal__t { margin-top: 3cqw; font: 400 3.4cqw var(--t); }
.polaroid-qr { right: 6cqw; top: 46cqw; width: 36cqw; padding: 2.4cqw 2.4cqw 1.4cqw; background: #fff; transform: rotate(4deg); box-shadow: 0 1.6cqw 2.6cqw rgba(0,0,0,.3); text-align: center; }
.polaroid-qr__qr svg { display: block; width: 100%; height: auto; }
.polaroid-qr p { margin-top: 1.4cqw; font: 400 4.6cqw var(--s); display: flex; align-items: center; justify-content: center; gap: 1cqw; }
.seta-qr { width: 7cqw; transform: rotate(-120deg) scaleX(-1); }
.fita--qr { position: absolute; left: 50%; top: -3cqw; width: 22cqw; transform: translateX(-50%) rotate(-6deg); }
.pix { left: 8cqw; right: 8cqw; top: 96cqw; display: flex; flex-direction: column; gap: .6cqw; padding: 3cqw 4cqw; border: .4cqw dashed var(--tinta); }
.pix span { font: 700 2.9cqw var(--t); letter-spacing: .14em; color: var(--verm); text-transform: uppercase; }
.pix code { font: 400 3cqw var(--m); word-break: break-all; }
.pix small { font: 600 2.7cqw var(--t); letter-spacing: .1em; text-transform: uppercase; color: var(--cinza); }
.acoes { left: 0; right: 0; top: 118cqw; display: flex; justify-content: center; }
.btn { display: inline-flex; align-items: center; gap: 2cqw; padding: 3cqw 5.4cqw; border-radius: 99px; font: 700 3.6cqw var(--t); letter-spacing: .06em; text-transform: uppercase; text-decoration: none; white-space: nowrap; }
.btn--preto { background: var(--tinta); color: #fff; box-shadow: .8cqw .8cqw 0 var(--verm); }
.btn--branco { background: #fff; color: var(--tinta); box-shadow: .8cqw .8cqw 0 var(--verm); }
.formas__t { left: 0; right: 0; top: 129cqw; text-align: center; font: 400 6cqw var(--s); color: var(--ouro); }
.formas { left: 0; right: 0; top: 137cqw; list-style: none; display: flex; justify-content: center; gap: 9cqw; }
.formas li { display: flex; flex-direction: column; align-items: center; gap: 1cqw; font: 700 2.9cqw var(--t); text-transform: uppercase; letter-spacing: .08em; color: var(--ouro); }
.formas__ic { width: 10cqw; height: 10cqw; color: var(--tinta); }
.local { left: 8cqw; right: 8cqw; top: 154cqw; display: flex; align-items: center; justify-content: center; gap: 2cqw; text-decoration: none; color: var(--tinta); font: 400 3cqw var(--t); }
.local b { display: block; font-weight: 700; }
.local .ic { width: 6cqw; height: 6cqw; color: var(--verm); }
.pg--sinal .arroba { bottom: 3.4cqw; }
.estrelas--sinal { left: 1cqw; bottom: 22cqw; transform: scale(.6); }

/* 7 final */
.eco--fim { top: 4cqw; font-size: 30cqw; color: rgba(255,255,255,.08); }
.mulher--fim { left: 4cqw; width: 92cqw; top: 14cqw; }
.rasgo--fim { top: 92cqw; transform: rotate(4deg); z-index: 3 !important; }
.fim { left: 0; right: 0; top: 100cqw; text-align: center; color: var(--tinta); z-index: 4 !important; }
.fim h2 .script { display: block; font-size: 22cqw; line-height: .9; transform: rotate(-4deg); color: var(--tinta); }
.fim p { margin: 1.4cqw 12cqw 0; font: 400 3.6cqw var(--t); }
.fim__ass { margin-top: 2cqw !important; font: 400 11cqw var(--a) !important; color: var(--verm); line-height: 1; display: flex; align-items: center; justify-content: center; gap: 1cqw; }
.fim__cor { width: 6cqw; color: var(--verm); }
.pg--fim .btn { margin-top: 10cqw; }
.fim__redes { display: flex; align-items: center; justify-content: center; gap: 1.6cqw; margin-top: 5cqw !important; font: 400 3.3cqw var(--m) !important; color: #ddd; }
.fim__redes .ic { width: 4cqw; height: 4cqw; }

/* cartelas do vídeo */
.gancho__foto { left: 0; top: 30cqw; width: 100%; height: 72cqw; object-fit: cover; filter: grayscale(1) contrast(1.2); z-index: 1 !important; }
.rasgo--gancho { top: 92cqw; transform: rotate(-3deg); }
.gancho { left: 0; right: 0; top: 104cqw; text-align: center; z-index: 4 !important; }
.gancho__k { font: 700 3cqw var(--t); letter-spacing: .18em; text-transform: uppercase; color: var(--verm); }
.gancho h2 { margin-top: 2cqw; font: 400 22cqw var(--g); line-height: .86; color: var(--tinta); white-space: nowrap; }
.gancho h2 .script { display: block; font-size: 10cqw; color: var(--tinta); transform: rotate(-3deg); }
.gancho__s { margin-top: 3cqw; font: 400 4.2cqw var(--m); color: #fff; background: var(--tinta); display: inline-block; padding: 1.4cqw 3cqw; transform: rotate(-1.5deg); }
.estatua--cta { right: -12cqw; top: 6cqw; width: 50cqw; transform: scaleX(-1); }
.postit--cta { left: 4cqw; top: 10cqw; transform: rotate(-10deg); }
.tt--cta { top: 42cqw; } .tt--cta .tt__g { font-size: 26cqw; }
.caderno--cta { left: 8cqw; width: 80cqw; top: 82cqw; height: 50cqw; transform: rotate(-2deg); }
.datas--cta { top: 12cqw; gap: 4cqw; } .datas--cta li { font-size: 5.6cqw; } .datas--cta b::after { content: ""; }
.cta { left: 0; right: 0; bottom: 12cqw; text-align: center; }
.cta p { font: 400 7cqw var(--s); color: var(--ouro); }
.cta b { display: inline-flex; align-items: center; gap: 2.4cqw; margin-top: 2cqw; padding: 3.4cqw 6cqw; border-radius: 99px; background: var(--tinta); color: #fff; font: 700 5.6cqw var(--t); box-shadow: 1cqw 1cqw 0 var(--verm); }
.cta b .ic { width: 6.4cqw; height: 6.4cqw; color: #7EE2A0; }
.estrelas--cta { right: 4cqw; top: 132cqw; }

.flutuante { position: fixed; right: 16px; bottom: 18px; z-index: 50; display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px; border-radius: 99px; background: #fff; color: var(--tinta); font: 700 15px var(--t); letter-spacing: .04em; text-transform: uppercase; text-decoration: none; box-shadow: 4px 4px 0 var(--verm), 0 8px 20px rgba(0,0,0,.5); opacity: 0; pointer-events: none; transform: translateY(12px); transition: .25s; }
.flutuante .ic { width: 20px; height: 20px; } .flutuante--ver { opacity: 1; pointer-events: auto; transform: none; }
.aviso { position: fixed; left: 50%; bottom: 80px; transform: translate(-50%, 20px); z-index: 60; padding: 10px 16px; border-radius: 99px; background: var(--tinta); color: #fff; font-size: 14px; opacity: 0; transition: .25s; pointer-events: none; }
.aviso--ver { opacity: 1; transform: translate(-50%, 0); }
body.exportar .web, body.exportar .flutuante, body.exportar .aviso, body.video .web, body.video .flutuante { display: none !important; }
body.exportar #paginas, body.video #paginas { gap: 0; padding: 0; } body.exportar .pg, body.video .pg { border-radius: 0; box-shadow: none; }
a:focus-visible, button:focus-visible { outline: .6cqw solid var(--verm); outline-offset: .6cqw; }
@media (prefers-reduced-motion: reduce) { .flutuante, .aviso { transition: none; } }

/* ajustes */
.fitaverm { height: 30cqw; object-fit: cover; object-position: 50% 100%; }
.pg--info .info { left: 6cqw; }
.datas b::after { content: ""; } .datas li { gap: 3.4cqw; }
.datas b { border-right: .4cqw solid var(--tinta); padding-right: 3cqw; }
.fim p { color: #EDEAE5; } .fim h2 .script { color: var(--tinta); }
.fim__ass { color: #E25A60 !important; } .fim__cor { color: #E25A60; }
.fim h2 + p { margin-top: 5cqw; }
.gancho h2 { color: #fff; text-shadow: 0 .6cqw 2cqw rgba(0,0,0,.6); } .gancho h2 .script { color: #E9C77C; }
.hor { font-size: 4.2cqw; gap: 2.4cqw; } .hor-av p { font-size: 3.9cqw; } .hor-rod { font-size: 3cqw; }
.pg--fim .btn { margin-top: 7cqw; } .fim__redes { margin-top: 3.4cqw !important; }