/* =========================================================
   Experiência imersiva + formulário em passos
   Só acrescenta movimento: cores, fontes e layout ficam
   iguais aos de styles.css. Tudo se desliga com
   "reduzir movimento" no sistema.
   ========================================================= */

/* ---------- formulário em passos ---------- */
.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form__top { display: none; }
html.js .form--steps .form__top { display: flex; align-items: center; gap: 14px; margin-bottom: -4px; }
.form__count { margin: 0; font-size: 11px; letter-spacing: .14em; color: var(--areia); font-variant-numeric: tabular-nums; white-space: nowrap; }
.form__progress { flex: 1; min-width: 0; width: 100%; height: 14px; overflow: visible; filter: url(#rough); }
.form__progress path { fill: none; stroke-width: 2; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.form__progress-bg { stroke: var(--linha-clara); }
.form__progress-fg { stroke: var(--creme); stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset .8s var(--ease); }

.form[hidden] { display: none; }
.step { display: grid; gap: 22px; min-width: 0; }
.form--steps { overflow: hidden; }
.form--steps .step:not(.is-current) { display: none; }
.form--steps .form__sim:not([hidden]) { display: contents; }
.form__nav [hidden], .form__keys[hidden] { display: none !important; }

.step.is-in-fwd > * { animation: stepIn .6s var(--ease) both; }
.step.is-in-back > * { animation: stepBack .6s var(--ease) both; }
.step > *:nth-child(2) { animation-delay: .07s; }
.step > *:nth-child(3) { animation-delay: .14s; }
@keyframes stepIn { from { opacity: 0; transform: translateX(34px); } }
@keyframes stepBack { from { opacity: 0; transform: translateX(-34px); } }
@keyframes rise { from { opacity: 0; transform: translateY(14px); } }

.step__hint { margin: -2px 0 4px; }
.step__hello {
  margin: 0; font-family: var(--f-display); font-weight: 250; font-variation-settings: "wdth" 62.5;
  text-transform: uppercase; font-size: clamp(1.9rem, 3.6vw, 2.6rem); line-height: .95;
}
.choice--big .choice__opt span { min-height: 58px; padding: 14px 26px; font-size: 16px; }
.choice__opt span { transition: background .25s, color .25s, border-color .25s, transform .3s var(--ease); }
@media (hover: hover) { .choice__opt:hover span { transform: translateY(-2px); } }
.choice__opt input:checked + span { animation: pop .5s var(--ease); }
@keyframes pop { 40% { transform: scale(1.06); } }
.field--reveal.is-new { animation: rise .5s var(--ease) both; }

.field__wrap { position: relative; display: block; }
.field__wrap input { padding-right: 48px !important; }
.field__ok {
  position: absolute; right: 18px; top: 50%; width: 9px; height: 16px; margin-top: -10px;
  border-right: 1.8px solid var(--creme); border-bottom: 1.8px solid var(--creme);
  transform: rotate(45deg) scale(.4); opacity: 0; transition: opacity .3s, transform .45s var(--ease); pointer-events: none;
}
.field__wrap.is-valid .field__ok { opacity: 1; transform: rotate(45deg) scale(1); }
.is-shake { animation: shake .42s ease; }
@keyframes shake { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(5px); } }

.chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 2px 0 6px; text-transform: none; letter-spacing: 0; }
.chips[hidden] { display: none; }
.chip {
  border: 1px solid var(--linha-clara); background: transparent; color: inherit; border-radius: 999px;
  padding: 7px 14px; font-size: 13px; cursor: pointer; transition: background .2s, color .2s, border-color .2s, transform .25s var(--ease);
}
.chip:hover { border-color: rgba(251, 240, 223, .6); transform: translateY(-1px); }
.chip[aria-pressed="true"] { background: var(--creme); color: var(--cacau); border-color: var(--creme); }

.resumo { margin: 0; display: grid; }
.resumo > div {
  display: grid; grid-template-columns: 104px 1fr; gap: 4px 14px; padding: 12px 0;
  border-top: 1px solid var(--linha-clara); animation: rise .5s var(--ease) both; animation-delay: calc(var(--i, 0) * 60ms);
}
.resumo > div:last-child { border-bottom: 1px solid var(--linha-clara); }
.resumo dt { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--areia); padding-top: 3px; }
.resumo dd { margin: 0; display: flex; justify-content: space-between; align-items: baseline; gap: 12px; min-width: 0; }
.resumo dd span { overflow-wrap: anywhere; min-width: 0; }
.resumo__edit { flex: none; background: none; border: 0; padding: 0; cursor: pointer; font-size: 12px; color: var(--areia); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 420px) { .resumo > div { grid-template-columns: 1fr; } }

.form__nav { display: flex; gap: 12px; align-items: center; }
.form__nav .form__next { flex: 1; }
.form__back {
  min-height: 48px; padding: 0 22px; background: none; border: 1px solid var(--linha-clara); border-radius: 999px; cursor: pointer;
  font-size: 12px; letter-spacing: .14em; text-transform: uppercase; transition: border-color .2s, background .2s;
}
.form__back:hover { border-color: var(--creme); background: rgba(251, 240, 223, .07); }
.form__keys { margin: -12px 0 0; text-align: center; font-size: 12px; color: var(--areia); }
.form__keys kbd { font: inherit; border: 1px solid var(--linha-clara); border-radius: 6px; padding: 1px 6px; }
@media (hover: none) { .form__keys { display: none !important; } }
.btn.is-loading { pointer-events: none; position: relative; overflow: hidden; }
.btn.is-loading::after {
  content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, rgba(107, 64, 54, .16) 50%, transparent 70%);
  animation: shimmer 1.1s linear infinite;
}
@keyframes shimmer { from { transform: translateX(-100%); } to { transform: translateX(100%); } }

.thanks { animation: rise .7s var(--ease) both; }
.thanks__mark { width: 26px; height: 26px; margin: 0 auto 18px; color: var(--areia); animation: spinIn 1.1s var(--ease) both; }
@keyframes spinIn { from { transform: scale(0) rotate(-140deg); opacity: 0; } }

/* brilhos que rebentam (criados pelo script) */
.burst { position: fixed; z-index: 120; width: 0; height: 0; pointer-events: none; }
.burst svg { position: absolute; left: 0; top: 0; }

/* ---------- barra de leitura ---------- */
.nav__progress {
  position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; pointer-events: none;
  background: currentColor; opacity: .5; transform-origin: 0 50%; transform: scaleX(var(--p, 0));
}

/* ---------- hero ---------- */
.hero__img { translate: var(--hx, 0px) var(--hy, 0px); will-change: transform, translate; }
.hero__content { opacity: var(--ho, 1); translate: 0 var(--ht, 0px); }
.hero__motes { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; pointer-events: none; }
html.js .hero__date { animation: rise 1.1s var(--ease) .2s both; }
html.js .hero__place { animation: rise 1s var(--ease) 1s both; }
html.js .hero__content .btn { animation: rise 1s var(--ease) 1.2s both; }
html.js .credit--hero { animation: fadeIn 1.4s ease 1.6s both; }
.hero__title .ln > i { display: block; font-style: normal; }
html.js .hero__title .ln > i { animation: lineUp 1.4s var(--ease) both; animation-delay: calc(.4s + var(--i, 0) * .18s); }
@keyframes lineUp {
  from { clip-path: inset(0 -20% 100% -20%); transform: translateY(.55em); opacity: 0; }
  to { clip-path: inset(-60% -20% -60% -20%); transform: none; opacity: 1; }
}
@keyframes fadeIn { from { opacity: 0; } }

/* ---------- títulos que sobem palavra a palavra ---------- */
.split .w { display: inline-block; }
html.js .split .w {
  clip-path: inset(0 -10% 100% -10%); transform: translateY(.5em); opacity: 0;
  transition: clip-path 1s var(--ease), transform 1s var(--ease), opacity .6s ease;
  transition-delay: calc(.08s + var(--i, 0) * .08s);
}
html.js .split.is-in .w, html.js .is-in .split .w { clip-path: inset(-40% -10% -40% -10%); transform: none; opacity: 1; }
html.js .reveal.split { opacity: 1; transform: none; }

/* ---------- contagem ---------- */
html.js .countdown__ring.draw path { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 2.4s var(--ease) .3s; }
html.js .countdown.is-in .countdown__ring.draw path { stroke-dashoffset: 0; }
.cd__n.is-tick { animation: tick .55s var(--ease); }
@keyframes tick { from { transform: translateY(-30%); opacity: .15; filter: blur(2px); } }
.cd__sep { animation: blink 2s ease-in-out infinite; }
@keyframes blink { 50% { opacity: .2; } }

/* ---------- polaroids: caem e ficam presas com fita-cola ---------- */
html.js .reveal.polaroid {
  opacity: 0; transform: translateY(-46px) rotate(calc(var(--rot, 0deg) * 4)) scale(1.05);
  transition: opacity .8s ease, transform 1.2s cubic-bezier(.34, 1.4, .5, 1), box-shadow .5s;
}
html.js .reveal.polaroid.is-in { opacity: 1; transform: rotate(var(--rot, 0deg)); }
.polaroid { translate: 0 var(--par, 0px); }
html.js .reveal.polaroid::before { transform: scaleX(0); transition: transform .5s var(--ease) .75s; }
html.js .reveal.polaroid.is-in::before { transform: none; }
.p2.reveal { transition-delay: .18s; }
.p3.reveal { transition-delay: .34s; }

/* rabiscos-brilho cintilam devagar */
.dd { animation: twinkle 4.6s ease-in-out infinite; }
.dd--s2, .dd--r2 { animation-duration: 3.4s; animation-delay: -1.2s; }
.dd--a2 { animation-duration: 5.4s; animation-delay: -2s; }
@keyframes twinkle { 0%, 100% { transform: scale(1) rotate(0deg); } 50% { transform: scale(.62) rotate(40deg); opacity: .45; } }

/* ---------- o dia ---------- */
html.js .dia__details .cal { opacity: 0; transform: translateY(26px) rotate(-14deg); transition: opacity .8s ease .1s, transform 1.2s cubic-bezier(.34, 1.4, .5, 1) .1s; }
html.js .dia__details.is-in .cal { opacity: 1; transform: rotate(-2.5deg); }
@media (hover: hover) { .dia__details.is-in .cal:hover { transform: rotate(0deg) scale(1.03); transition-delay: 0s; } }
html.js .cal__day--big svg { stroke-dasharray: 160; stroke-dashoffset: 160; transition: stroke-dashoffset 1.3s var(--ease) 1s; }
html.js .is-in .cal__day--big svg { stroke-dashoffset: 0; }
html.js .facts > div { opacity: 0; transform: translateX(18px); transition: opacity .7s ease, transform .9s var(--ease); }
html.js .is-in .facts > div { opacity: 1; transform: none; }
html.js .is-in .facts > div:nth-child(2) { transition-delay: .12s; }
html.js .is-in .facts > div:nth-child(3) { transition-delay: .24s; }
.dia__art img { translate: 0 var(--par, 0px); }
.dia__art.is-in img { animation: floaty 7s ease-in-out 1s infinite; }
@keyframes floaty { 50% { transform: translateY(-8px) rotate(.6deg); } }

/* ---------- timeline: cada momento acende quando a linha lá chega ---------- */
html.js .tl--anim .tl__icon { opacity: 0; transform: translateY(20px) scale(.9) rotate(-4deg); transition: opacity .8s ease, transform 1s cubic-bezier(.34, 1.4, .5, 1); }
html.js .tl--anim .tl__text { opacity: 0; transform: translateX(-24px); transition: opacity .8s ease .1s, transform 1s var(--ease) .1s; }
html.js .tl--anim .tl__item--flip .tl__text { transform: translateX(24px); }
html.js .tl--anim .tl__item.is-lit .tl__icon, html.js .tl--anim .tl__item.is-lit .tl__text { opacity: 1; transform: none; }
.tl__item.is-lit .tl__node { animation: nodePulse 1.2s var(--ease); }
@keyframes nodePulse {
  0% { box-shadow: 0 0 0 6px var(--cacau), 0 0 0 6px rgba(234, 228, 204, .6); transform: scale(1.5); }
  100% { box-shadow: 0 0 0 6px var(--cacau), 0 0 0 26px rgba(234, 228, 204, 0); transform: scale(1); }
}
@media (max-width: 720px) { html.js .tl--anim .tl__text, html.js .tl--anim .tl__item--flip .tl__text { transform: translateX(16px); } }

/* ---------- igreja e monte ---------- */
.local { transition: transform .45s var(--ease), box-shadow .45s; }
@media (hover: hover) { .local:hover { transform: translateY(-4px); box-shadow: 0 20px 40px -26px rgba(70, 35, 25, .55); } }
.local__icon { transition: transform .6s var(--ease); }
.local:hover .local__icon { transform: rotate(-6deg) scale(1.08); }
.mapa.is-in .pin span { animation: pinDrop .9s cubic-bezier(.34, 1.5, .5, 1) .3s both; }
.mapa.is-in .pin--l span { animation-delay: .55s; }
.mapa.is-in .pin b { animation: fadeIn .6s ease 1s both; }
@keyframes pinDrop { from { transform: translateY(-40px) scale(.6); opacity: 0; } }
html.js .monte.reveal figure { clip-path: inset(10% 10% 10% 10% round 18px); transition: clip-path 1.4s var(--ease); }
html.js .monte.reveal figure + figure { transition-delay: .15s; }
html.js .monte.reveal.is-in figure { clip-path: inset(0 0 0 0 round 18px); }
html.js .monte.reveal img { transform: scale(1.18); transition: transform 2s var(--ease); }
html.js .monte.reveal.is-in img { transform: scale(1); }
@media (hover: hover) { .monte figure:hover img { transform: scale(1.04) !important; transition-duration: .9s; } }

/* ---------- alojamentos ---------- */
html.js .aloj__list.reveal li { opacity: 0; transform: translateY(12px); transition: opacity .6s ease, transform .8s var(--ease); transition-delay: calc(var(--i, 0) * 45ms); }
html.js .aloj__list.reveal.is-in li { opacity: 1; transform: none; }

/* ---------- presente: o embrulho desenha-se ---------- */
html.js .presente__gift.reveal { stroke-dasharray: 420; stroke-dashoffset: 420; transition: opacity .9s var(--ease), transform .9s var(--ease), stroke-dashoffset 2.6s var(--ease) .2s; }
html.js .presente__gift.reveal.is-in { stroke-dashoffset: 0; }
@media (hover: hover) { .presente__gift.is-in:hover { animation: wiggle .8s ease; } }
@keyframes wiggle { 25% { transform: rotate(-8deg); } 60% { transform: rotate(1deg); } }
.iban { transition: border-color .3s, background .3s; }
.iban:hover { border-color: rgba(251, 240, 223, .6); background: rgba(251, 240, 223, .04); }

/* ---------- arcos e contactos ---------- */
.arcos { overflow: hidden; }
.arcos img { transform: scale(1.14) translateY(var(--ay, 0px)); will-change: transform; }
.pessoa { transition: border-color .35s, transform .45s var(--ease), background .35s; }
@media (hover: hover) { .pessoa:hover { border-color: rgba(251, 240, 223, .65); transform: translateY(-4px); background: rgba(251, 240, 223, .04); } }
.contactos__grid .pessoa.reveal:nth-child(2) { transition-delay: .12s; }
.contactos__grid .pessoa.reveal:nth-child(3) { transition-delay: .24s; }
.footer__mark { animation: slowSpin 14s linear infinite; }
@keyframes slowSpin { to { transform: rotate(360deg); } }

/* botões ligeiramente "magnéticos" (só com rato) */
.btn { translate: var(--mx, 0px) var(--my, 0px); }

/* =========================================================
   Botão-selo + pop-up da confirmação
   ========================================================= */
.rsvp__cta { display: none; }
html.has-modal .rsvp__cta { display: grid; justify-items: center; align-self: center; gap: 18px; text-align: center; }
.rsvp__cta-note { margin: 0; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--areia); }

.seal {
  position: relative; display: grid; place-items: center;
  width: clamp(250px, 28vw, 320px); aspect-ratio: 1; padding: 0; border: 0; border-radius: 50%;
  background: none; color: var(--cacau); cursor: pointer; -webkit-tap-highlight-color: transparent;
  translate: var(--mx, 0px) var(--my, 0px); transition: translate .25s var(--ease);
}
.seal:focus-visible { outline: 2px solid var(--creme); outline-offset: 6px; }
.seal__text { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; animation: slowSpin 26s linear infinite; }
.seal__text text { fill: var(--creme); font: 500 10.5px var(--f-body); letter-spacing: .02em; }
.seal:hover .seal__text { animation-duration: 9s; }
.seal__ring { position: absolute; inset: 13.5%; width: 73%; height: 73%; color: var(--areia); filter: url(#rough); overflow: visible; transition: transform 1.2s var(--ease); }
html.js .seal__ring path { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 2.2s var(--ease) .5s; }
html.js .rsvp__cta.is-in .seal__ring path { stroke-dashoffset: 0; }
.seal:hover .seal__ring { transform: rotate(-24deg) scale(1.03); }
.seal__core {
  position: relative; overflow: hidden; isolation: isolate;
  width: 60%; aspect-ratio: 1; border-radius: 50%; background: var(--creme);
  display: grid; place-items: center; align-content: center; gap: 8px;
  box-shadow: 0 26px 50px -26px rgba(20, 8, 5, .7);
  transition: transform .6s cubic-bezier(.34, 1.5, .5, 1), background .4s;
  animation: breathe 3.8s ease-in-out infinite;
}
.seal__core::after { /* reflexo que passa de vez em quando */
  content: ""; position: absolute; inset: -20%; z-index: -1; pointer-events: none;
  background: linear-gradient(115deg, transparent 38%, rgba(255, 255, 255, .85) 50%, transparent 62%);
  transform: translateX(-110%); animation: glint 5.5s ease-in-out 2s infinite;
}
.seal:hover .seal__core { transform: scale(1.07); background: var(--branco); }
.seal:active .seal__core { transform: scale(.96); }
.seal__star { width: 16px; height: 16px; color: var(--cacau); animation: twinkle 3s ease-in-out infinite; }
.seal__label { font-size: clamp(1.45rem, 2.3vw, 1.85rem); line-height: .92; }
.seal__hint { font-size: 10px; letter-spacing: .16em; text-transform: uppercase; opacity: .7; }
.seal.is-done .seal__core { background: var(--areia); }
@keyframes breathe {
  0%, 100% { box-shadow: 0 26px 50px -26px rgba(20, 8, 5, .7), 0 0 0 0 rgba(251, 240, 223, .28); }
  50% { box-shadow: 0 26px 50px -26px rgba(20, 8, 5, .7), 0 0 0 16px rgba(251, 240, 223, 0); }
}
@keyframes glint { 0%, 55% { transform: translateX(-110%); } 80%, 100% { transform: translateX(110%); } }
@media (max-width: 899px) { html.has-modal .rsvp__cta { margin-top: 8px; } }

/* o pop-up ocupa o ecrã todo e abre num círculo a partir do botão */
html.modal-open { overflow: hidden; }
.modal {
  position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none;
  margin: 0; padding: 0; border: 0; overflow-y: auto; overscroll-behavior: contain;
  background: var(--cacau); color: var(--creme);
}
.modal::backdrop { background: rgba(58, 32, 26, .35); }
.modal__inner {
  position: relative; z-index: 1; min-height: 100%;
  display: grid; align-content: center; justify-items: center;
  padding: max(76px, env(safe-area-inset-top, 0px) + 64px) var(--gutter) 56px;
}
.modal__close {
  position: fixed; top: max(16px, env(safe-area-inset-top, 0px) + 10px); right: var(--gutter); z-index: 3;
  display: inline-flex; align-items: center; gap: 10px; min-height: 42px; padding: 8px 18px;
  background: var(--cacau); color: var(--creme); border: 1px solid var(--linha-clara); border-radius: 999px; cursor: pointer;
  font-size: 12px; letter-spacing: .14em; text-transform: uppercase; transition: border-color .2s, background .2s, transform .3s var(--ease);
}
.modal__close span { font-size: 18px; line-height: 1; transition: transform .4s var(--ease); }
.modal__close:hover { border-color: var(--creme); }
.modal__close:hover span { transform: rotate(90deg); }
.modal__head { text-align: center; margin-bottom: clamp(24px, 4vw, 36px); max-width: 640px; }
.modal__star { width: 22px; height: 22px; margin: 0 auto 18px; color: var(--areia); }
.modal__title { font-size: clamp(2.6rem, 6vw, 4.6rem); margin-bottom: 14px; }
.modal__meta { margin: 0; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--areia); }
.modal__body { width: min(100%, 620px); }
.modal__body .rsvp__box { opacity: 1; transform: none; }
.modal .form { background: #734a40; box-shadow: 0 30px 60px -34px rgba(20, 8, 5, .6); } /* opaco: os brilhos do fundo não passam por cima */
.modal.is-shown .modal__head > * { animation: rise .8s var(--ease) both; }
.modal.is-shown .modal__head > :nth-child(1) { animation: spinIn 1s var(--ease) .25s both; }
.modal.is-shown .modal__head > :nth-child(2) { animation-delay: .3s; }
.modal.is-shown .modal__head > :nth-child(3) { animation-delay: .38s; }
.modal.is-shown .modal__head > :nth-child(4) { animation-delay: .46s; }
.modal.is-shown .modal__body { animation: rise .9s var(--ease) .5s both; }
.modal.is-shown .modal__close { animation: fadeIn .6s ease .6s both; }

/* =========================================================
   Magia: brilhos no ar, rasto do rato, fotos que inclinam
   ========================================================= */
.ambient { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.ambient svg {
  position: absolute; color: var(--areia); opacity: 0;
  animation: float var(--d, 9s) ease-in-out var(--dl, 0s) infinite;
}
.sec--cacau > .wrap, .footer > .wrap { position: relative; z-index: 1; }
.footer { position: relative; overflow: hidden; }
@keyframes float {
  0%, 100% { opacity: 0; transform: translateY(14px) scale(.5) rotate(0deg); }
  45%, 55% { opacity: var(--o, .5); transform: translateY(-10px) scale(1) rotate(35deg); }
}

.trail { position: fixed; z-index: 130; left: 0; top: 0; width: 0; height: 0; pointer-events: none; }
.trail svg { position: absolute; left: 0; top: 0; }

@media (hover: hover) and (pointer: fine) {
  html.js .reveal.polaroid.is-in.is-tilt {
    transform: perspective(900px) rotateX(var(--tx, 0deg)) rotateY(var(--ty, 0deg)) scale(1.03);
    transition: transform .2s ease-out, box-shadow .4s; z-index: 3;
    box-shadow: 0 36px 60px -28px rgba(70, 35, 25, .6), 0 2px 6px rgba(70, 35, 25, .12);
  }
  .polaroid::after {
    content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .4s;
    background: radial-gradient(circle at var(--gx, 50%) var(--gy, 50%), rgba(255, 255, 255, .45), transparent 55%);
    mix-blend-mode: soft-light;
  }
  .polaroid.is-tilt::after { opacity: 1; }
}

/* a pintura dos arcos aproxima-se devagar quando aparece */
.arcos.is-in img { animation: kenburns 18s ease-out both; }
@keyframes kenburns { from { scale: 1.08; } to { scale: 1; } }

@media (prefers-reduced-motion: reduce) {
  .ambient, .trail { display: none; }
  html.js .seal__ring path { stroke-dashoffset: 0; }
  .seal { translate: none; }
}

@media (prefers-reduced-motion: reduce) {
  .hero__img, .hero__content, .polaroid, .dia__art img, .btn { translate: none !important; }
  .arcos img { transform: none; }
  .hero__motes, .nav__progress { display: none; }
  html.js .reveal.polaroid { opacity: 1; transform: rotate(var(--rot, 0deg)); }
  html.js .tl--anim .tl__icon, html.js .tl--anim .tl__text, html.js .aloj__list.reveal li, html.js .facts > div, html.js .dia__details .cal { opacity: 1; transform: none; }
  html.js .dia__details .cal { transform: rotate(-2.5deg); }
  html.js .presente__gift.reveal, html.js .cal__day--big svg { stroke-dashoffset: 0; }
  html.js .monte.reveal figure { clip-path: none; }
  html.js .monte.reveal img { transform: none; }
}
@media print {
  .hero__motes, .nav__progress, .burst { display: none !important; }
}