.action-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.action-grid>*,.action-grid>[data-link="presentes"],.action-grid>#copy-pix{grid-column:auto}
.envelope-pocket,.fold,.flap-front{filter:hue-rotate(48deg) saturate(.38) brightness(.72)}
.seal-ct,.opening .seal-ct{filter:sepia(1) saturate(2.4) hue-rotate(-15deg) drop-shadow(0 3px 3px #252b2440)}
.model-notice{font:10px Montserrat,Arial,sans-serif;letter-spacing:.1em;margin-bottom:24px!important}

.portrait-stage{aspect-ratio:3/2}.portrait-stage img{object-fit:contain;object-position:center}
.envelope-back,.flap-lining{filter:sepia(1) saturate(2.4) hue-rotate(-15deg);border-color:#b55321}

/* A gentle invitation to scroll, shown only after the envelope finishes opening. */
#scroll-hint{position:fixed;left:50%;bottom:calc(28px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:14;pointer-events:none;color:#636b4d;width:44px;height:44px;display:grid;place-items:center;border:1px solid #636b4d66;border-radius:50%;background:#f8f6f180}
#scroll-hint[hidden]{display:none}
#scroll-hint svg{display:block;width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;animation:scroll-hint-down 1.8s ease-in-out infinite}
@keyframes scroll-hint-down{0%,100%{transform:translateY(-2px);opacity:.7}60%{transform:translateY(2px);opacity:1}}
@media(prefers-reduced-motion:reduce){#scroll-hint svg{animation:none}}

/* Scroll guidance is needed only on mobile layouts. */
@media(min-width:700px){#scroll-hint{display:none}}

/* Barra Fabulê, igual à de /modelo */
:root{--barra:56px}
body{padding-top:var(--barra)}
.envelope{top:var(--barra)}
.barra{position:fixed;inset:0 0 auto 0;z-index:30;height:var(--barra);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 14px;background:#FDFAF3;border-bottom:1px solid #EBE0D3;font-family:Inter,system-ui,sans-serif}
.barra a{text-decoration:none}
.voltar{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 6px;color:#7C4C34;font-size:14px;font-weight:600}
.voltar:hover{color:#453A35}
.barra-marca{height:26px;width:auto}
.barra-cta{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 16px;border-radius:999px;background:#1D827B;color:#fff;font-size:13.5px;font-weight:600;white-space:nowrap}
@media (max-width:420px){.barra-marca{display:none}}