/* The printed postcard artwork keeps its full original proportions. */
.aspiration{border-top:1px solid var(--line)}
.aspiration .section-heading{align-items:center}
.aspiration .section-heading h2{margin-bottom:0}
.aspiration .section-heading>p{color:#52604e;font-size:1rem}
.aspiration-display,.aspiration-footer{width:100%;max-width:56rem;margin-inline:auto}
.aspiration-display{margin-block:0}
.aspiration-card{display:block;width:100%;padding:0;border:0;background:transparent;perspective:100rem;color:inherit;border-radius:.75rem;box-shadow:0 1rem 2.5rem #283c321a;cursor:pointer}
.aspiration-card:hover{transform:none}
.aspiration-card:disabled{cursor:default}
.aspiration-turner{display:grid;transform-style:preserve-3d;transition:transform .75s cubic-bezier(.16,1,.3,1)}
.aspiration-card.is-flipped .aspiration-turner{transform:rotateY(180deg)}
.aspiration-face{grid-area:1/1;display:block;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:.75rem;overflow:hidden}
.aspiration-face img{display:block;width:100%;height:auto;aspect-ratio:1748/1240;object-fit:contain;background:#fff7df}
.aspiration-back{transform:rotateY(180deg)}
.aspiration-caption{display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:center;justify-content:flex-end;padding-block:1rem .25rem;font-size:.875rem;color:#52604e}
.aspiration-flip{display:inline-flex;gap:.5rem;align-items:center;min-height:2.75rem;padding:.5rem 1rem;border:1px solid var(--ink);border-radius:.25rem;background:transparent;color:var(--ink);font-size:.875rem;transition:background .2s,color .2s}
.aspiration-flip[hidden]{display:none}
.aspiration-flip:hover{transform:none;background:var(--ink);color:var(--paper)}
.aspiration-flip svg{width:1.25rem;height:1.25rem;flex-shrink:0}
.aspiration-footer{font-size:.875rem;color:#52604e}
.aspiration-footer>p{margin-bottom:.5rem}
.aspiration-story{margin-top:1.25rem;border-top:1px solid var(--line)}
.aspiration-story summary{padding-block:1rem;min-height:2.75rem;cursor:pointer;color:var(--ink)}
.aspiration-story summary:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.aspiration-story p{font-size:1rem;line-height:2;max-width:70ch;margin-bottom:1rem}
.aspiration-story div{padding-top:.5rem}
.aspiration ::selection{background:#dce7d2;color:var(--ink)}
@media(min-width:600px){.aspiration-caption{padding-top:1.25rem}.aspiration-footer>p{margin-bottom:.25rem}}
@media(prefers-reduced-motion:reduce){.aspiration-turner{transition:none}}
