.demo-catalog{background:linear-gradient(145deg,#f9f3f6,#f0e8ef);scroll-margin-top:90px}.demo-catalog>header{text-align:center;max-width:760px;margin:0 auto 32px}.demo-plan-picker{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:30px auto 20px}.demo-plan-picker a{padding:13px 23px;min-height:46px;border-radius:99px;border:1px solid #bc9fb8;background:#fff;color:#56334f;font-size:14px;font-weight:700;text-decoration:none}.demo-plan-picker a[aria-current=true]{background:#59324f;color:#fff;border-color:#59324f}.demo-plan-picker a:focus-visible,.demo-catalog-card a:focus-visible{outline:3px solid #784966;outline-offset:4px}.demo-plan-summary,.demo-catalog-count,.demo-catalog-note{text-align:center}.demo-plan-summary{max-width:650px;margin:0 auto;min-height:45px;color:#654e60}.demo-catalog-count{font-size:12px;letter-spacing:.05em;color:#705967;margin:18px 0}.demo-catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}.demo-catalog-card{min-width:0;overflow:hidden;border:1px solid #deced9;border-radius:24px;background:#fff;box-shadow:0 12px 35px #4b234d0a}.demo-catalog [hidden]{display:none!important}.demo-catalog-preview{position:relative;display:grid;place-items:center;min-height:300px;padding:36px 24px 50px;background:var(--demo-bg);color:var(--demo-ink);text-decoration:none;overflow:hidden}.demo-preview-invitation{width:100%;display:grid;justify-items:center;gap:16px;padding:30px 12px;border:1px solid var(--demo-accent);border-radius:100px 100px 15px 15px}.demo-preview-invitation small{font-size:7px;letter-spacing:.15em;text-align:center}.demo-preview-invitation strong{font:400 clamp(34px,4vw,48px)/1 Georgia,serif;overflow-wrap:anywhere;max-width:100%}.demo-preview-invitation i{width:45px;height:1px;background:var(--demo-accent)}.demo-preview-invitation>span{font-size:12px;letter-spacing:.25em}.demo-preview-invitation b{font-size:7px;letter-spacing:.12em;font-weight:500}.demo-preview-spark{position:absolute;top:16px;right:23px;color:var(--demo-accent)}.demo-preview-plan{position:absolute;bottom:14px;left:24px;font-size:10px;letter-spacing:.1em;text-transform:uppercase}.demo-catalog-copy{padding:24px}.demo-catalog-copy h3{font-size:23px;margin:0 0 12px;color:#43283d}.demo-catalog-copy p{font-size:14px;line-height:1.65;color:#6d5968;margin:0 0 12px}.demo-catalog-copy small{color:#6d5968;display:block;font-size:11px}.demo-catalog-copy>a{display:flex;justify-content:space-between;align-items:center;min-height:48px;margin-top:16px;border-top:1px solid #e9dfe6;color:#59324f;font-weight:700;text-decoration:none}.demo-catalog-note{margin-top:28px;color:#705967;font-size:12px}@media(max-width:950px){.demo-catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.demo-catalog-grid{grid-template-columns:1fr}.demo-plan-picker a{padding:12px 16px}.demo-catalog-preview{min-height:310px}.demo-preview-invitation{max-width:280px}}

/* One row per plan; native scrolling also works without JavaScript. */
.demo-catalog-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc((100% - 52px)/3);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:0;padding:5px 0 18px;scrollbar-width:thin;scrollbar-color:#bc9fb8 transparent}
.demo-catalog-card{scroll-snap-align:start}
.demo-catalog-grid:focus-visible{outline:3px solid #784966;outline-offset:4px;border-radius:24px}
.demo-carousel-controls{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:18px}
.demo-carousel-controls button{display:grid;place-items:center;width:46px;height:46px;border:1px solid #bc9fb8;border-radius:50%;background:#fff;color:#59324f;cursor:pointer;transition:background .2s,color .2s}
.demo-carousel-controls button:hover:not(:disabled){background:#59324f;color:#fff}
.demo-carousel-controls button:focus-visible{outline:3px solid #784966;outline-offset:3px}
.demo-carousel-controls button:active:not(:disabled){background:#43283d;color:#fff}
.demo-carousel-controls button:disabled{opacity:.35;cursor:default}
.demo-carousel-controls span{min-width:100px;text-align:center;color:#59324f;font-size:13px}
@media(max-width:950px){.demo-catalog-grid{grid-template-columns:none;grid-auto-columns:calc((100% - 26px)/2)}}
@media(max-width:560px){.demo-catalog-grid{grid-template-columns:none;grid-auto-columns:100%;gap:16px}}
@media(prefers-reduced-motion:reduce){.demo-carousel-controls button{transition:none}}