/* Eduarda & Thiago — aquarela da papelaria + camada de caneta (o lado "cool") */
:root{
  --papel:#FBF6EC; --papel2:#F4ECDC;
  --ouro:#A69977; --ouro-esc:#7A6B45;
  --tinta:#1B1A17; --tinta2:#3B3833;
  --rosa:#E46A8B; --rosa-claro:#F7C9D5;
  --verde:#5E8A3A; --azul:#4A86D9;
  --cinzel:"Cinzel", "Trajan Pro", Georgia, serif;
  --serif:"Cormorant Garamond", Georgia, serif;
  --mao:"Caveat", "Segoe Print", cursive;
}
*{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:clip;background:var(--papel)}
body{font-family:var(--serif);color:var(--tinta);background:var(--papel);-webkit-font-smoothing:antialiased;overflow-x:clip}
[hidden]{display:none!important}
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}
img{display:block;max-width:100%}
svg{display:block}

/* controles finos */
.progresso{position:fixed;left:0;top:0;height:2px;width:100%;transform-origin:left;transform:scaleX(0);background:var(--rosa);z-index:60}
.pular{position:fixed;top:16px;right:16px;z-index:50;font:600 19px/1 var(--mao);color:var(--tinta);background:rgba(251,246,236,.9);
  border:1.5px solid var(--tinta);border-radius:999px;padding:6px 16px 8px;cursor:pointer;transform:rotate(-2deg)}
.pular:hover{background:var(--rosa-claro)}
.dica{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;
  font:600 21px/1 var(--mao);color:var(--tinta);z-index:30;pointer-events:none;white-space:nowrap}
.dica i{width:1.5px;height:28px;background:currentColor;transform-origin:top;animation:dica 1.8s ease-in-out infinite}
@keyframes dica{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}

/* ---------- palco preso (abertura + capa) ---------- */
#palco{position:relative;height:100vh;height:100lvh;overflow:hidden;background:var(--papel)}
#palco::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:40;opacity:.32;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .55 0 0 0 0 .45 0 0 0 0 .35 0 0 0 .2 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.cena{position:absolute;inset:0;z-index:10;pointer-events:none}
.cena>*{pointer-events:auto}

/* ---------- capa ---------- */
.capa{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:2vw;padding:0 6vw 0 7vw}
.capa-txt{display:flex;flex-direction:column;align-items:flex-start;text-align:left;max-width:560px}
.mono{width:clamp(130px,17vh,190px);aspect-ratio:232/158;color:var(--ouro)}
.mono svg{width:100%;height:100%;overflow:visible}
.mono path{fill:currentColor;stroke:currentColor;stroke-width:.35}
.nomes{width:min(38vw,560px);aspect-ratio:129/14;color:var(--ouro-esc);margin-top:3.4vh;font-size:0}
.nomes svg{width:100%;height:100%}
.data{display:flex;gap:.55em;font:400 clamp(20px,2.8vh,30px)/1 var(--cinzel);letter-spacing:.12em;color:var(--ouro-esc);margin-top:2.6vh}
.data i{font-style:normal;color:var(--rosa)}
.onde{font:500 clamp(17px,2.2vh,21px)/1.45 var(--serif);font-style:italic;color:var(--tinta2);margin-top:1.6vh;max-width:34ch}
.btn{display:inline-block;margin-top:3.6vh;font:500 13px/1 var(--cinzel);letter-spacing:.16em;text-transform:uppercase;color:var(--tinta);
  text-decoration:none;border:1.5px solid var(--tinta);border-radius:999px;padding:15px 26px;position:relative;transition:background .3s}
.btn:hover{background:var(--rosa-claro)}

.capa-arte{position:relative;height:100%;display:flex;align-items:center;justify-content:center}
.quadro{position:relative;height:min(84vh,900px);aspect-ratio:1082/1454;max-width:100%}
.quadro-cv{position:absolute;inset:0;width:100%;height:100%}
.nota{position:absolute;font:600 clamp(22px,2.9vh,30px)/1.05 var(--mao);color:var(--tinta);white-space:nowrap;display:flex;align-items:center;gap:8px;pointer-events:none}
.nota .rab{height:1.5em;width:auto}
.nota-aqui{left:calc(50% + min(84vh,900px)*.36);top:39%;transform:rotate(-5deg);flex-direction:row-reverse}
.nota-aqui .rab{transform:scaleX(-1) rotate(-12deg);height:1.8em}
.maria-senta{position:absolute;height:min(28vh,300px);width:auto;right:calc(50% + min(84vh,900px)*.3);bottom:4vh;filter:drop-shadow(0 6px 6px rgba(60,40,10,.12))}
.nota-maria{right:calc(50% + min(84vh,900px)*.3 + min(28vh,300px)*.62);bottom:calc(4vh + min(28vh,300px)*.55);transform:rotate(-6deg);flex-direction:column;align-items:flex-end;gap:2px}
.nota-maria .rab{height:1.1em}
.nota-maria span{display:flex;align-items:center;gap:6px}

/* ---------- abertura A: o mapa ---------- */
.mundo{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}
.mundo canvas,.mundo svg{position:absolute;inset:0;width:100%;height:100%}
.mundo svg{overflow:visible}
.caneta{fill:none;stroke:var(--tinta);stroke-linecap:round;stroke-linejoin:round}
.caneta.rosa{stroke:var(--rosa)}
.rotulo{position:absolute;pointer-events:none;text-align:center;transform-origin:50% 100%;white-space:nowrap}
.rotulo b{display:block;font:500 clamp(13px,1.5vw,20px)/1.1 var(--cinzel);letter-spacing:.1em;color:var(--tinta);background:rgba(251,246,236,.86);padding:6px 12px 5px;border-radius:3px}
.rotulo span{display:block;font:600 clamp(18px,1.9vw,27px)/1.05 var(--mao);color:var(--tinta);margin-top:6px;text-shadow:0 0 6px var(--papel),0 0 12px var(--papel)}
.titulo-a{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);text-align:center;z-index:20;width:min(92vw,900px);pointer-events:none}
.titulo-a h2{font:400 clamp(34px,5.4vw,76px)/1.08 var(--cinzel);color:var(--tinta);letter-spacing:.02em}
.titulo-a h2 em{font:600 1.18em/1 var(--mao);color:var(--rosa);font-style:normal;letter-spacing:0;position:relative;white-space:nowrap}
.titulo-a p{font:italic 400 clamp(19px,1.8vw,25px)/1.4 var(--serif);color:var(--tinta2);margin-top:18px}
.encontro{position:absolute;pointer-events:none;text-align:center;white-space:nowrap}
.encontro b{display:block;font:600 clamp(24px,2.5vw,36px)/1 var(--mao);color:var(--tinta);text-shadow:0 0 8px var(--papel),0 0 14px var(--papel)}
.encontro span{display:inline-block;font:500 clamp(13px,1.2vw,16px)/1 var(--cinzel);letter-spacing:.14em;color:var(--tinta);background:var(--rosa-claro);padding:6px 10px 5px;margin-top:8px}
.veu{position:absolute;inset:0;background:var(--papel);opacity:0;pointer-events:none}

/* ---------- abertura B: a cena em tela cheia que vira o quadro ---------- */
.cena-b{position:absolute;inset:0;transform-origin:0 0;overflow:hidden;will-change:transform,clip-path}
.cam{position:absolute;will-change:transform}
.cam canvas,.cam img{display:block;width:100%;height:100%}
.cam-cerca{opacity:0;pointer-events:none}
.brilho{position:absolute;width:18px;height:18px;margin:-9px 0 0 -9px;pointer-events:none;opacity:0;animation:brilha 3.4s ease-in-out infinite}
.brilho::before,.brilho::after{content:"";position:absolute;left:50%;top:50%;background:#fffdf4;border-radius:2px;transform:translate(-50%,-50%)}
.brilho::before{width:2px;height:100%}.brilho::after{width:100%;height:2px}
.brilho:nth-child(3){animation-delay:.7s}.brilho:nth-child(4){animation-delay:1.5s}.brilho:nth-child(5){animation-delay:2.2s}.brilho:nth-child(6){animation-delay:2.9s}.brilho:nth-child(7){animation-delay:1.1s}
@keyframes brilha{0%,100%{opacity:0;transform:scale(.3) rotate(0)}45%{opacity:.95;transform:scale(1) rotate(45deg)}70%{opacity:0;transform:scale(.4) rotate(70deg)}}
.passaros{position:absolute;left:0;top:5%;width:100%;height:32%;overflow:visible;pointer-events:none}
.voo path{fill:none;stroke:#2B2925;stroke-width:.9;stroke-linecap:round;stroke-linejoin:round;transform-box:fill-box;transform-origin:50% 100%;animation:bate .42s ease-in-out infinite alternate}
.voo{animation:voa 38s linear infinite}
.v1{--y:6px;animation-delay:-6s}.v2{--y:12px;animation-delay:-14s;animation-duration:44s}.v3{--y:3px;animation-delay:-26s;animation-duration:41s}
.v2 path{animation-delay:-.2s}.v3 path{animation-delay:-.1s}
@keyframes voa{from{transform:translate(-12px,var(--y)) scale(.3)}to{transform:translate(112px,calc(var(--y) - 5px)) scale(.3)}}
@keyframes bate{from{transform:scaleY(1)}to{transform:scaleY(-.35)}}
.pincel{position:absolute;left:0;top:0;width:clamp(130px,12vw,210px);transform-origin:0 55%;pointer-events:none;opacity:0;overflow:visible;--ponta:#4A86D9;z-index:2}
.pincel path{fill:none;stroke:var(--tinta);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}
.pincel .cabo{fill:#F4ECDC}.pincel .virola{fill:#D9D2C2}.pincel .ponta{fill:var(--ponta)}
.maria-cena{position:absolute;left:0;top:0;width:auto;z-index:24;pointer-events:none;transform-origin:50% 100%;opacity:0;filter:drop-shadow(0 8px 8px rgba(40,50,10,.18))}
.abre-b{position:absolute;inset:0;z-index:23;pointer-events:none;--mw:clamp(220px,32vh,340px)}
.mono-b,.nomes-b,.data-b{position:absolute;left:7vw;transform-origin:0 0}
.mono-b{top:7vh;width:var(--mw);aspect-ratio:232/158;color:var(--ouro-esc)}
.mono-b svg,.nomes-b svg{width:100%;height:100%;overflow:visible}
.mono-b{position:absolute}
.mono-b .mono-cv{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.nomes-b{top:calc(7vh + var(--mw)*.68 + 3vh);width:min(40vw,620px);aspect-ratio:129/14;color:var(--ouro-esc)}
.data-b{top:calc(7vh + var(--mw)*.68 + 3vh + min(40vw,620px)*.1085 + 2.6vh);font:400 clamp(22px,3vh,32px)/1 var(--cinzel);letter-spacing:.12em;color:var(--ouro-esc);white-space:nowrap;opacity:0}
.data-b i{font-style:normal;color:var(--rosa)}
.convite-cv{position:absolute;left:calc(7vw - 4px);top:calc(7vh + var(--mw)*.68 + 3vh + min(40vw,620px)*.1085 + 2.6vh + clamp(22px,3vh,32px) + 2.4vh);pointer-events:none}
.convite-txt{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
/* noite na serra: céu escuro, texto claro, pássaros dormindo, vaga-lumes no lugar dos brilhos */
.noite .nomes-b{color:#EADFBF}
.noite .data-b{color:#EADFBF}
.noite .passaros{display:none}
.noite .brilho::before,.noite .brilho::after{background:#FFD36B}
.noite .dica{color:#F4EAD0}

/* ---------- depois ---------- */
.depois{position:relative;min-height:80vh;display:grid;place-content:center;text-align:center;padding:90px 24px;background:var(--papel)}
.depois h2{font:400 clamp(36px,5vw,70px)/1.05 var(--cinzel);max-width:16ch;margin:0 auto 22px}
.depois h2 em{font:600 1.15em/1 var(--mao);color:var(--rosa);font-style:normal}
.depois p{max-width:46ch;margin:0 auto 20px;font-size:21px;line-height:1.55}
.nota-teste{font:600 20px/1.3 var(--mao)!important;opacity:.8}
.nota-teste a{color:var(--tinta)}
.rodape{background:var(--tinta);color:var(--papel);text-align:center;padding:22px;font:400 14px/1.5 var(--serif);letter-spacing:.04em}
.rodape a{color:var(--rosa-claro);text-decoration:none}

/* =========================== SEÇÕES =========================== */
.sec{position:relative;padding:140px 7vw;background:var(--papel)}
.sec-cab{text-align:center;max-width:780px;margin:0 auto 70px}
.sec-cab h2{font:400 clamp(38px,4.6vw,68px)/1.08 var(--cinzel);color:var(--tinta);letter-spacing:.01em}
.sec-cab h2 em{font:600 1.2em/1 var(--mao);color:var(--rosa);font-style:normal;letter-spacing:0;white-space:nowrap}
.sec-sub{font:italic 400 clamp(20px,1.7vw,24px)/1.5 var(--serif);color:var(--tinta2);margin-top:18px}
.mao{font:600 clamp(22px,2vw,28px)/1.1 var(--mao);color:var(--tinta);display:flex;align-items:center;gap:8px}
.mao .rab{height:1.3em;width:auto}
[data-entra]{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
[data-entra].in{opacity:1;transform:none}
.foto{margin:0;position:relative}
.foto img{width:100%;height:100%;object-fit:cover;display:block}
.foto.arco{border-radius:999px 999px 14px 14px;overflow:hidden;clip-path:inset(0 round 999px 999px 14px 14px)}
.foto.oval{border-radius:50%;overflow:hidden;clip-path:ellipse(50% 50% at 50% 50%)}
.foto::after{content:"";position:absolute;inset:8px;border:1px solid rgba(251,246,236,.75);border-radius:inherit;pointer-events:none}
.link{font:500 12px/1 var(--cinzel);letter-spacing:.16em;text-transform:uppercase;color:var(--tinta);text-decoration:none;border:0;background:none;border-bottom:1.5px solid var(--rosa);padding:6px 0;cursor:pointer}
.btn-cheio{background:var(--tinta);color:var(--papel);border:0;cursor:pointer}
.btn-cheio:hover{background:var(--tinta2)}

/* história */
.hist{position:relative;max-width:1100px;margin:0 auto;display:flex;flex-direction:column;gap:110px}
.hist-linha{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}
.parada>*{position:relative;z-index:1}
.hist-traco{fill:none;stroke:var(--tinta);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:4000;stroke-dashoffset:4000}
.parada{position:relative;display:grid;grid-template-columns:150px minmax(0,1fr) minmax(0,300px);gap:44px;align-items:center}
.parada[data-lado="d"]{grid-template-columns:minmax(0,300px) minmax(0,1fr) 150px}
.parada[data-lado="d"] .carimbo{order:3}.parada[data-lado="d"] .foto{order:1}.parada[data-lado="d"] .parada-txt{order:2}
.parada[data-lado="e"] .parada-txt{grid-column:2 / span 2;max-width:560px}
.parada .foto{aspect-ratio:3/4}
.parada-txt h3{font:400 clamp(26px,2.4vw,36px)/1.15 var(--cinzel);margin-bottom:14px}
.parada-txt p{font-size:21px;line-height:1.6;color:var(--tinta2);margin-bottom:12px}
.parada-txt .mao{margin-top:8px}
.carimbo{position:relative;z-index:1;width:150px;height:150px;background:var(--papel);border-radius:50%;opacity:0;transform:scale(1.6) rotate(-18deg)}
.carimbo svg{width:100%;height:100%;overflow:visible}
.carimbo circle,.carimbo path{fill:none;stroke:#2F5E9E;stroke-width:2.2}
.carimbo path{stroke:none}
.carimbo circle+circle{stroke-width:1;stroke-dasharray:3 4}
.carimbo text{font:500 13px var(--cinzel);letter-spacing:.14em;fill:#2F5E9E;text-anchor:middle}
.carimbo .cb-meio{font:600 22px var(--mao);letter-spacing:0}
.carimbo .cb-so{font-size:27px}
.cartao-destaque{box-shadow:6px 6px 0 var(--rosa)}
.cartao p+p{margin-top:10px}
.carimbo-rosa circle{stroke:var(--rosa)}.carimbo-rosa text{fill:var(--rosa)}
.carimbo.bate{animation:bate .5s cubic-bezier(.3,1.6,.5,1) forwards}
@keyframes bate{0%{opacity:0;transform:scale(1.6) rotate(-18deg)}60%{opacity:.95}100%{opacity:.92;transform:scale(1) rotate(-8deg)}}

/* álbum */
.album{padding-left:0;padding-right:0;overflow:hidden}
.album .sec-cab{margin-bottom:50px}
.album-trilho{overflow:visible}
.album-faixa{display:flex;gap:4vw;align-items:center;padding:0 8vw;width:max-content}
.album-faixa .foto{flex:none;width:clamp(240px,22vw,340px);aspect-ratio:3/4}
.album-faixa .foto:nth-child(even){margin-top:90px}
.album-faixa .foto.oval{aspect-ratio:4/5}
.album-faixa figcaption{position:absolute;left:50%;bottom:-46px;transform:translateX(-50%) rotate(-3deg);font:600 24px/1 var(--mao);white-space:nowrap}
.album-faixa .foto{overflow:visible;clip-path:none;border-radius:0}
.album-faixa .foto img{border-radius:999px 999px 14px 14px}
.album-faixa .foto.oval img{border-radius:50%}
.album-faixa .foto::after{display:none}

/* Mariazinha */
.maria-fatos{display:flex;justify-content:center;gap:40px;flex-wrap:wrap;max-width:1100px;margin:-30px auto 40px}
.maria-fatos p{font:600 25px/1.2 var(--mao);display:flex;align-items:center;gap:10px;max-width:330px}
.maria-fatos .rab{height:1.6em;width:auto;flex:none}
.campo{position:relative;height:min(44vw,480px);margin:0 -7vw;cursor:pointer;overflow:hidden;user-select:none;-webkit-tap-highlight-color:transparent}
.campo-grama{position:absolute;left:0;right:0;bottom:0;width:100%;height:62%;object-fit:cover;object-position:50% 100%;
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 30%);mask-image:linear-gradient(to bottom,transparent,#000 30%)}
.campo-maria{position:absolute;left:0;top:0;width:auto;transform-origin:50% 100%;pointer-events:none;filter:drop-shadow(0 8px 8px rgba(40,50,10,.18))}
.campo-bola{position:absolute;left:0;top:0;width:36px;opacity:0;pointer-events:none}
.campo-dica{position:absolute;left:50%;top:10%;transform:translateX(-50%) rotate(-2deg);font:600 26px/1 var(--mao);transition:opacity .4s;pointer-events:none;white-space:nowrap}
.campo.jogou .campo-dica{opacity:0}
.campo-conta{position:absolute;right:7vw;top:12%;font:600 24px/1 var(--mao);color:var(--rosa);pointer-events:none}

/* o dia */
.conta{display:flex;justify-content:center;gap:clamp(14px,3vw,46px);margin:-20px auto 70px}
.conta div{text-align:center;min-width:90px}
.conta b{display:block;font:400 clamp(44px,5vw,76px)/1 var(--cinzel);font-variant-numeric:tabular-nums}
.conta span{font:600 22px/1 var(--mao);color:var(--rosa)}
.cartoes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;max-width:1120px;margin:0 auto}
.cartao{background:#FFFDF7;border:1.5px solid var(--tinta);border-radius:6px;padding:30px 30px 32px;box-shadow:6px 6px 0 var(--rosa-claro)}
.cartao h3{font:400 clamp(22px,1.9vw,28px)/1.2 var(--cinzel);margin:10px 0 12px}
.cartao p{font-size:19px;line-height:1.55;color:var(--tinta2)}
.cartao .link{display:inline-block;margin-top:16px}
.botoes{display:flex;gap:18px;flex-wrap:wrap;margin-top:6px}
.cartao:nth-child(2){transform:translateY(24px)}
.cartao:nth-child(2).in{transform:translateY(24px)}

#o-dia .cartoes{grid-template-columns:repeat(2,minmax(0,1fr));max-width:760px}
.cartao:nth-child(2),.cartao:nth-child(2).in{transform:none}
.traje{max-width:1180px;margin:70px auto 0;text-align:center}
.traje .mao{justify-content:center}
.traje h3{font:400 clamp(26px,2.4vw,36px)/1.15 var(--cinzel);margin:8px 0 26px}
.traje-figs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;align-items:end}
.traje-figs figure{margin:0}
.traje-figs img{width:100%;height:clamp(240px,30vw,400px);object-fit:contain;object-position:50% 100%;transition:transform .5s cubic-bezier(.3,1.4,.5,1)}
.traje-figs figure:last-child img{transform:scale(.92);transform-origin:50% 100%}
.traje-figs figure:hover img{transform:translateY(-8px) rotate(-1.5deg)}
.traje-figs figure:last-child:hover img{transform:scale(.92) translateY(-8px) rotate(-1.5deg)}
.traje-obs{max-width:46ch;margin:18px auto 0;font:italic 400 19px/1.5 var(--serif);color:var(--tinta2)}
.traje-nota{display:flex;justify-content:center;gap:40px;flex-wrap:wrap;margin-top:22px;font:600 22px/1.2 var(--mao);color:var(--tinta2)}
/* como chegar */
.rota{position:relative;max-width:1000px;margin:0 auto 80px}
.rota-svg{width:100%;height:auto;overflow:visible}
.rota-traco{fill:none;stroke:var(--tinta);stroke-width:2.4;stroke-linecap:round;stroke-dasharray:6 9;stroke-dashoffset:1400}
.rota.anda .rota-traco{animation:rota 2.6s ease-out forwards}
@keyframes rota{to{stroke-dashoffset:0}}
.rota-pt{fill:var(--papel);stroke:var(--tinta);stroke-width:2}
.rota-cor{position:absolute;left:50%;top:54.5%;width:44px;transform:translate(-50%,-50%) scale(0);transition:transform .5s 1.5s cubic-bezier(.3,1.6,.5,1)}
.rota.anda .rota-cor{transform:translate(-50%,-50%) scale(1)}
.rota-rot{position:absolute;font:500 clamp(12px,1.2vw,15px)/1.2 var(--cinzel);letter-spacing:.1em;white-space:nowrap}
.rota-rot span{font:600 1.4em var(--mao);letter-spacing:0;color:var(--rosa)}
.r1{left:0;top:84%}.r2{left:50%;top:76%;transform:translateX(-50%);color:var(--rosa)}.r3{right:0;top:80%;text-align:right}

/* dicas */
.bilhetes{display:grid;grid-template-columns:1.25fr 1fr;gap:56px;max-width:1040px;margin:0 auto;align-items:start}
.bilhete{position:relative;background:#FFFDF4;padding:38px 26px 30px;box-shadow:0 10px 24px rgba(60,40,10,.1);transform:rotate(var(--r)) translateY(26px);transition:opacity .9s var(--d),transform .9s var(--d) cubic-bezier(.2,.7,.2,1)}
.bilhete.in{transform:rotate(var(--r))}
.bilhete:hover{transform:rotate(0) translateY(-6px)}
.bilhete .fita{position:absolute;left:50%;top:-12px;width:90px;height:26px;transform:translateX(-50%) rotate(-4deg);background:rgba(228,106,139,.35)}
.bilhete h3{font:600 30px/1.05 var(--mao);margin-bottom:10px}
.bilhete p{font-size:18px;line-height:1.5;color:var(--tinta2)}
.bilhete{padding:44px 40px 34px}
.bilhete h3{font-size:36px;margin-bottom:18px}
.bilhete ul{list-style:none;columns:2;column-gap:34px}
.bilhete:nth-child(2) ul{columns:1}
.bilhete li{break-inside:avoid;font:400 20px/1.25 var(--serif);padding:9px 0;border-bottom:1px dashed rgba(60,40,10,.18)}
.bilhete li small{display:block;font:italic 400 15px/1.3 var(--serif);color:var(--tinta2);margin-top:2px}

/* presentes */
.abas{display:flex;justify-content:center;gap:10px;margin:-30px 0 44px}
.aba{font:500 13px/1 var(--cinzel);letter-spacing:.14em;text-transform:uppercase;padding:13px 22px;border:1.5px solid var(--tinta);border-radius:999px;background:transparent;color:var(--tinta);cursor:pointer}
.aba.ativa{background:var(--tinta);color:var(--papel)}
.grade-presentes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;max-width:1180px;margin:0 auto}
.grade-presentes[data-aba="lua"]{grid-template-columns:repeat(3,minmax(0,1fr));max-width:900px}
.presente{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;background:#FFFDF7;border:1.5px solid var(--tinta);border-radius:6px;padding:26px 18px 22px;cursor:pointer;font:inherit;color:inherit;
  opacity:0;transform:translateY(18px);transition:opacity .6s var(--d),transform .6s var(--d),box-shadow .3s}
.grade-presentes.in .presente{opacity:1;transform:none}
.presente:hover{box-shadow:6px 6px 0 var(--rosa-claro);transform:translateY(-3px)}
.presente .rab{height:70px;width:auto}
.presente-n{font:600 44px/1 var(--mao);color:var(--rosa)}
.presente h3{font:500 19px/1.35 var(--serif);flex:1}
.presente-v{font:500 15px/1 var(--cinzel);letter-spacing:.08em}
.lojas{text-align:center;margin-top:36px;font-size:19px}
.lojas a{color:var(--tinta)}
.modal{position:fixed;inset:0;z-index:80;background:rgba(27,26,23,.5);display:grid;place-items:center;padding:16px}
.modal-caixa{position:relative;background:var(--papel);border:1.5px solid var(--tinta);border-radius:8px;padding:36px 30px 30px;max-width:420px;width:100%;text-align:center}
.modal-caixa .mao{justify-content:center}
.modal-caixa h3{font:400 24px/1.25 var(--cinzel);margin:10px 0 6px}
.modal-x{position:absolute;right:12px;top:8px;border:0;background:none;font-size:32px;cursor:pointer;color:var(--tinta)}
.pix-valor{font:500 20px var(--cinzel);color:var(--rosa);margin-bottom:16px}
.pix-qr{width:190px;margin:0 auto 18px}
.pix-qr svg{width:100%;height:auto}
.modal-caixa .btn{margin:0 0 12px}
.pix-nota{font-size:17px;color:var(--tinta2)}

/* confirmação */
.confirmar{padding-bottom:160px}
.form{max-width:560px;margin:0 auto;display:flex;flex-direction:column;gap:22px}
.fld{display:flex;flex-direction:column;gap:8px}
.fld span,.escolha legend{font:600 22px/1 var(--mao)}
.fld input,.fld textarea{font:400 19px/1.4 var(--serif);padding:13px 14px;border:1.5px solid var(--tinta);border-radius:6px;background:#FFFDF7;color:var(--tinta);width:100%;min-width:0}
.fld input:focus,.fld textarea:focus{outline:2px solid var(--rosa);outline-offset:2px}
.escolha{border:0;display:flex;gap:12px;flex-wrap:wrap;min-width:0}
.escolha legend{margin-bottom:12px}
.escolha label{flex:1;min-width:0}
.escolha input{position:absolute;left:0;top:0;width:1px;height:1px;opacity:0}
.escolha span{display:block;text-align:center;font:500 13px/1 var(--cinzel);letter-spacing:.12em;text-transform:uppercase;padding:16px 10px;border:1.5px solid var(--tinta);border-radius:999px;cursor:pointer}
.escolha input:checked+span{background:var(--tinta);color:var(--papel)}
.escolha input:focus-visible+span{outline:2px solid var(--rosa);outline-offset:2px}
.chips{border:0;display:flex;flex-wrap:wrap;gap:10px;min-width:0}
.chips legend{font:600 22px/1 var(--mao);margin-bottom:12px}
.chips label{position:relative}
.chips input{position:absolute;left:0;top:0;width:1px;height:1px;opacity:0}
.chips span{display:block;font:400 17px/1 var(--serif);padding:11px 16px;border:1.5px solid var(--tinta);border-radius:999px;cursor:pointer}
.chips input:checked+span{background:var(--rosa-claro)}
.chips input:focus-visible+span{outline:2px solid var(--rosa);outline-offset:2px}
#acomp{display:flex;flex-direction:column;gap:16px}
#acomp:empty{display:none}
#seSim{display:flex;flex-direction:column;gap:22px}
#seSim[hidden]{display:none!important}
.erro{color:#B23A48;font-size:17px;min-height:1em}
.form .btn{align-self:center;margin-top:4px}
.ok{text-align:center;max-width:520px;margin:0 auto}
.ok-maria{height:180px;width:auto;margin:0 auto 14px}
.ok h3{font:600 44px/1 var(--mao);color:var(--rosa);margin-bottom:12px}
.ok p{font-size:20px;line-height:1.55;margin-bottom:18px}

/* rodapé */
.rodape{background:var(--tinta);color:var(--papel);text-align:center;padding:70px 20px 40px}
.rodape-mono{width:150px;aspect-ratio:232/158;margin:0 auto 18px;color:var(--ouro)}
.rodape-mono svg{width:100%;height:100%}
.rodape-nomes{font:400 18px/1.4 var(--cinzel);letter-spacing:.12em}
.rodape-sapia{margin-top:26px;font-size:14px;opacity:.75}
.rodape a{color:var(--rosa-claro);text-decoration:none}
.fixo-rsvp{position:fixed;right:20px;bottom:20px;z-index:55;white-space:nowrap;font:500 12px/1 var(--cinzel);letter-spacing:.14em;text-transform:uppercase;color:var(--papel);background:var(--tinta);text-decoration:none;padding:15px 22px;border-radius:999px;
  box-shadow:4px 4px 0 var(--rosa-claro);opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .4s,transform .4s}
.fixo-rsvp.ve{opacity:1;transform:none;pointer-events:auto}

/* =========================== EXTRAS =========================== */
/* mapa da turma */
.mapa-turma{max-width:1100px;margin:0 auto 70px;position:relative}
.mapa-svg{width:100%;display:block;overflow:visible}
.mp-esfera{fill:#F4ECDC;stroke:none}
.mp-pais{fill:#FBF6EC;stroke:var(--tinta);stroke-width:.6;stroke-linejoin:round;opacity:.75}
.mp-brasil{fill:var(--rosa-claro);opacity:1}
.mp-arco{fill:none;stroke:var(--rosa);stroke-width:1.6;stroke-dasharray:3 5;stroke-linecap:round;opacity:0}
.mapa-svg.anda .mp-arco{animation:arco 1.4s var(--d) ease-out forwards}
@keyframes arco{from{opacity:0;stroke-dashoffset:60}to{opacity:1;stroke-dashoffset:0}}
.mp-pt circle{fill:var(--tinta);opacity:.85}
.mp-pt text{font:600 15px var(--mao);fill:var(--tinta);paint-order:stroke;stroke:#FBF6EC;stroke-width:4px}
.mp-pt{opacity:0;transform-box:fill-box;transform-origin:center}
.mapa-svg.anda .mp-pt{animation:ponto .6s var(--d) cubic-bezier(.3,1.6,.5,1) forwards}
@keyframes ponto{from{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}
.mp-casa circle{fill:var(--rosa);stroke:var(--tinta);stroke-width:1.5}
.mp-casa text{font:500 12px var(--cinzel);letter-spacing:.08em;fill:var(--tinta);paint-order:stroke;stroke:#FBF6EC;stroke-width:4px}
.mapa-longe{text-align:center;font:600 26px/1.2 var(--mao);color:var(--rosa);margin-top:16px;min-height:1em}

/* a pista */
.pista{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:50px;align-items:center;max-width:900px;margin:0 auto}
.vitrola svg{width:100%;overflow:visible}
.vitrola rect,.vitrola circle,.vitrola path{fill:none;stroke:var(--tinta);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.vitrola .vi-caixa{fill:#FFFDF7}
.vitrola .vi-selo{fill:var(--rosa-claro)}
.vi-disco{transform-box:fill-box;transform-origin:center}
.vitrola.tocando .vi-disco{animation:gira 3.2s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}
.vi-nota{opacity:0}
.vitrola.tocando .vi-nota{animation:nota 2.4s ease-in-out infinite}
@keyframes nota{0%{opacity:0;transform:translate(0,10px)}30%{opacity:1}100%{opacity:0;transform:translate(12px,-22px)}}
.pista-txt h3{font:400 clamp(26px,2.6vw,36px)/1.15 var(--cinzel)}
.pista-txt h3 em{font:600 1.2em/1 var(--mao);color:var(--rosa);font-style:normal}
.pista-sub{font-size:19px;color:var(--tinta2);margin:10px 0 18px}
.pista-lista{list-style:none;max-height:320px;overflow:auto;display:flex;flex-direction:column;gap:10px;padding-right:6px}
.pista-lista li{background:#FFFDF7;border:1.5px solid var(--tinta);border-radius:6px;padding:10px 14px;animation:entra .5s var(--d) both}
@keyframes entra{from{opacity:0;transform:translateY(10px)}}
.pista-lista b{display:block;font:500 18px/1.3 var(--serif)}
.pista-lista span{font:600 17px/1 var(--mao);color:var(--rosa)}

/* confirmação: cidade */
.origem{position:relative}
.sugestoes{position:absolute;left:0;right:0;top:100%;z-index:5;list-style:none;background:#FFFDF7;border:1.5px solid var(--tinta);border-top:0;border-radius:0 0 6px 6px;max-height:240px;overflow:auto}
.sugestoes button{display:block;width:100%;text-align:left;font:400 17px/1.3 var(--serif);padding:10px 14px;border:0;background:none;cursor:pointer;color:var(--tinta)}
.sugestoes button:hover,.sugestoes button:focus{background:var(--rosa-claro)}

/* dia da festa */
.e-hoje{font:600 clamp(64px,9vw,120px)/1 var(--mao);color:var(--rosa);text-align:center;animation:batida 1.6s ease-in-out infinite}
@keyframes batida{50%{transform:scale(1.05)}}
.foto-form{max-width:520px;margin:0 auto 40px;display:flex;flex-direction:column;gap:16px;align-items:center}
.foto-form .fld{width:100%}
.foto-botao{cursor:pointer}
.foto-status{font:600 21px var(--mao);min-height:1em}
.foto-grade{columns:4 220px;column-gap:14px;max-width:1180px;margin:0 auto}
.foto-item{display:block;break-inside:avoid;margin-bottom:14px;position:relative;border-radius:6px;overflow:hidden;border:1.5px solid var(--tinta)}
.foto-item img{width:100%;height:auto;display:block}
.foto-item span{position:absolute;left:8px;bottom:6px;font:600 18px var(--mao);color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.6)}
.foto-item.nova{animation:entra .8s both}
.foto-vazia{text-align:center;font:600 22px var(--mao)}

/* o sim escondido */
.dica-sim{font:600 .62em var(--mao);opacity:.45;margin-left:6px}
.chuva-sim{position:fixed;inset:0;width:100vw;height:100vh;z-index:90;pointer-events:none}
.selo-sim{position:fixed;left:50%;top:50%;width:min(60vw,260px);z-index:91;pointer-events:none;transform:translate(-50%,-50%) scale(1.8) rotate(-18deg);opacity:0;animation:selo 4.2s cubic-bezier(.3,1.6,.5,1) forwards}
.selo-sim svg{width:100%;overflow:visible}
.selo-sim circle{fill:rgba(251,246,236,.9);stroke:var(--rosa);stroke-width:4}
.selo-sim circle+circle{fill:none;stroke-width:1.5;stroke-dasharray:5 6}
.selo-sim text{font:600 30px var(--mao);fill:var(--rosa);text-anchor:middle}
.selo-sim .ss-sim{font:500 54px var(--cinzel);letter-spacing:.08em}
@keyframes selo{0%{opacity:0;transform:translate(-50%,-50%) scale(1.8) rotate(-18deg)}12%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(-8deg)}80%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) scale(1) rotate(-8deg)}}

/* lareira */
.lareira{position:relative;width:150px;margin:0 auto 30px;display:flex;flex-direction:column;align-items:center;gap:12px}
.lar-fogo{width:110px;filter:invert(1) sepia(.6) saturate(4) hue-rotate(-12deg) brightness(1.05);transform-origin:50% 100%;animation:chama 1.3s ease-in-out infinite alternate}
@keyframes chama{0%{transform:scale(1,1) skewX(0)}35%{transform:scale(1.03,1.06) skewX(-2deg)}70%{transform:scale(.98,1.02) skewX(2deg)}100%{transform:scale(1.02,.97) skewX(-1deg)}}
.lar-brilho{position:absolute;left:50%;top:40px;width:220px;height:150px;transform:translate(-50%,-30%);background:radial-gradient(closest-side,rgba(255,170,70,.35),transparent);animation:brilha-fogo 2.2s ease-in-out infinite alternate;pointer-events:none}
@keyframes brilha-fogo{to{opacity:.6;transform:translate(-50%,-30%) scale(1.1)}}
.lareira.estala .lar-fogo{animation-duration:.7s}
.lar-som{font:600 20px var(--mao);color:var(--rosa-claro);background:none;border:1.5px solid rgba(247,201,213,.5);border-radius:999px;padding:6px 16px 8px;cursor:pointer}
.lar-som:hover{border-color:var(--rosa-claro)}

/* ---------- celular (por último) ---------- */
@media (max-width:760px){
  #palco{height:100svh}
  .capa{grid-template-columns:1fr;grid-template-rows:auto 1fr;align-items:start;gap:0;padding:max(64px,9svh) 16px 0;text-align:center}
  .capa-txt{align-items:center;text-align:center;max-width:none;margin:0 auto}
  .mono{width:clamp(84px,11svh,120px)}
  .nomes{width:min(84vw,400px);margin-top:2svh}
  .data{font-size:clamp(17px,2.4svh,22px);margin-top:1.6svh}
  .onde{font-size:16px;margin-top:1svh;max-width:30ch}
  .btn{margin-top:2svh;padding:13px 22px;font-size:12px}
  .capa-arte{align-items:flex-start;padding-top:2.4svh}
  .quadro{height:min(46svh,70vw*1.34)}
  .nota{font-size:21px}
  .nota-aqui{left:auto;right:4vw;top:auto;bottom:calc(min(46svh,70vw*1.34) * .62);flex-direction:column-reverse;gap:2px}
  .nota-aqui .rab{transform:rotate(100deg);height:1.4em}
  .maria-senta{height:min(17svh,150px);left:4vw;bottom:auto;top:calc(2.4svh + min(46svh,70vw*1.34) * .56)}
  .nota-maria{display:none}
  .titulo-a h2{font-size:clamp(30px,8.6vw,40px)}
  .titulo-a p{font-size:18px}
  .rotulo b{font-size:12px;padding:5px 9px 4px}
  .rotulo span{font-size:19px}
  .abre-b{--mw:clamp(150px,19svh,200px)}
  .mono-b{top:5svh}
  .nomes-b{top:calc(5svh + var(--mw)*.68 + 2svh);width:84vw}
  .data-b{top:calc(5svh + var(--mw)*.68 + 2svh + 84vw*.1085 + 1.6svh);font-size:20px}
  .convite-cv{top:calc(5svh + var(--mw)*.68 + 2svh + 84vw*.1085 + 1.6svh + 20px + 2svh)}
  .brilho{width:12px;height:12px;margin:-6px 0 0 -6px}
  .pincel{width:110px}
  .depois p{font-size:19px}
}

/* celular das seções (sempre no fim do arquivo) */
@media (max-width:760px){
  .sec{padding:84px 16px}
  .sec-cab{margin-bottom:44px}
  .sec-cab h2{font-size:clamp(30px,8.6vw,40px)}
  .sec-sub{font-size:19px}
  .hist{gap:70px}
  .hist-linha{display:none}
  .parada,.parada[data-lado="d"]{grid-template-columns:1fr;gap:20px;justify-items:center;text-align:center}
  .parada[data-lado="d"] .carimbo,.parada[data-lado="d"] .foto,.parada[data-lado="d"] .parada-txt{order:0}
  .parada[data-lado="e"] .parada-txt{grid-column:auto}
  .parada .foto{width:min(72vw,300px)}
  .parada-txt p{font-size:19px}
  .parada-txt .mao{justify-content:center}
  .carimbo{width:118px;height:118px}
  .album-trilho{overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:60px;scrollbar-width:none}
  .album-trilho::-webkit-scrollbar{display:none}
  .album-faixa{padding:0 16px;gap:22px}
  .album-faixa .foto{width:66vw;scroll-snap-align:center}
  .album-faixa .foto:nth-child(even){margin-top:40px}
  .maria-fatos{flex-direction:column;align-items:center;gap:18px;margin-top:-20px}
  .maria-fatos p{font-size:22px;text-align:left}
  .campo{height:78vw;margin:0 -16px}
  .campo-dica{font-size:22px;top:6%}
  .campo-conta{right:16px;top:auto;bottom:4%;font-size:21px}
  .conta{gap:10px;margin-top:-10px}
  .conta div{min-width:0;flex:1}
  .conta b{font-size:38px}.conta span{font-size:19px}
  .cartoes,#o-dia .cartoes{grid-template-columns:1fr;gap:20px}
  .traje-figs{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .traje-figs figure:last-child{grid-column:1 / -1;justify-self:center;width:50%}
  .traje-figs img{height:min(62vw,300px)}
  .traje-nota{flex-direction:column;gap:6px;font-size:20px}
  .cartao{text-align:center;padding:26px 20px}
  .cartao .mao{justify-content:center}
  .cartao:nth-child(2),.cartao:nth-child(2).in{transform:none}
  .botoes{justify-content:center}
  .rota{margin-bottom:56px}
  .rota-rot{font-size:10px;letter-spacing:.06em}
  .r1{top:92%}.r3{top:88%}
  .rota-cor{width:30px}
  .bilhetes{grid-template-columns:1fr;gap:44px;max-width:360px}
  .bilhete{padding:40px 24px 28px}
  .bilhete ul{columns:1}
  .bilhete{text-align:center}
  .abas{flex-wrap:wrap}
  .aba{padding:12px 16px;font-size:11px}
  .grade-presentes,.grade-presentes[data-aba="lua"]{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .presente{padding:18px 10px 16px;gap:8px}
  .presente .rab{height:48px}
  .presente h3{font-size:16px}
  .presente-v{font-size:13px}
  .fld input,.fld textarea{font-size:17px}
  .escolha{flex-direction:column}
  .chips{justify-content:center}
  .chips legend{text-align:center;width:100%}
  .fixo-rsvp{left:50%;right:auto;transform:translate(-50%,16px);bottom:14px}
  .fixo-rsvp.ve{transform:translate(-50%,0)}
}

/* celular dos extras (sempre no fim) */
@media (max-width:760px){
  .pista{grid-template-columns:1fr;gap:24px;text-align:center}
  .vitrola{width:min(64vw,240px);margin:0 auto}
  .pista-lista{text-align:left}
  .mapa-longe{font-size:22px}
  .mp-pt text{font-size:12px}
  .foto-grade{columns:2 140px;column-gap:10px}
  .lareira{transform:scale(.9)}
}