.cfb-theme .v12-demo.ottho-redesign .v12-demo-hero,.v12-demo .v12-demo-hero{text-align:center;padding-top:48px;padding-bottom:8px}.v12-demo .v12-demo-hero .v12-page-lede,.v12-demo .v12-demo-hero h1{margin-left:auto;margin-right:auto}.v12-demo-grid{display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));width:100vw;margin-left:calc(50% - 50vw);padding:0 32px}.v12-demo-card{background:#ffffff;border:1px solid #e7e5e0;border-radius:12px;overflow:hidden;box-shadow:0 1px 2px rgba(50,51,57,.04);transition:transform .25s ease,box-shadow .25s ease}.v12-demo-card:hover{transform:translateY(-3px);box-shadow:0 16px 32px -16px rgba(50,51,57,.18)}.v12-demo-chrome{display:flex;align-items:center;gap:6px;padding:11px 14px;background:#fafaf8;border-bottom:1px solid #e7e5e0}.v12-demo-chrome i{width:9px;height:9px;border-radius:50%;display:block}.v12-demo-chrome i:first-child{background:#ff5f57}.v12-demo-chrome i:nth-child(2){background:#febc2e}.v12-demo-chrome i:nth-child(3){background:#28c840}.v12-demo-slider{position:relative;aspect-ratio:16/10;overflow:hidden;background:#f0efec}.v12-demo-slider img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;opacity:0;transition:opacity .6s ease;display:block}.v12-demo-slider img[data-active]{opacity:1}.v12-demo-nav{position:absolute;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:50%;cursor:pointer;background:#ffffff;color:#323339;border:1px solid #e7e5e0;font-size:16px;line-height:1;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease,background .2s ease,color .2s ease;z-index:2;box-shadow:0 2px 8px rgba(50,51,57,.12)}.v12-demo-slider:hover .v12-demo-nav{opacity:1}.v12-demo-nav.prev{left:10px}.v12-demo-nav.next{right:10px}.v12-demo-nav:hover{background:#8450ff;color:#fff;border-color:#8450ff}.v12-demo-dots{position:absolute;bottom:10px;left:0;right:0;display:flex;justify-content:center;gap:6px;z-index:2}.v12-demo-dots button{width:7px;height:7px;border-radius:50%;border:none;cursor:pointer;background:rgba(255,255,255,.75);box-shadow:0 0 0 1px rgba(50,51,57,.15);transition:all .25s ease;padding:0}.v12-demo-dots button[data-active]{background:#8450ff;width:18px;border-radius:4px;box-shadow:none}.v12-demo-meta{padding:14px 18px}.v12-demo-name{font-family:var(--display);font-weight:500;font-size:1.1rem;color:#323339;letter-spacing:-.01em}.ottho-redesign .demo-invitation{padding-block:80px;background:#eae2ef;border-top:1px solid #d9cee2}.ottho-redesign .demo-invitation-inner{text-align:center;max-width:900px}.ottho-redesign .demo-invitation h2{font-size:55px;line-height:1.15;margin:20px 0}.ottho-redesign .demo-invitation p{font-size:16px;line-height:1.8;color:#826b92;max-width:50ch;margin:0 auto 28px}.ottho-redesign .demo-invitation-inner>div{display:flex;justify-content:center;gap:15px;flex-wrap:wrap}@media (max-width:720px){.v12-demo-grid{grid-template-columns:1fr;padding:0 16px}.v12-demo-nav{opacity:1}.ottho-redesign .demo-invitation{padding-block:50px}.ottho-redesign .demo-invitation h2{font-size:35px}}@media (prefers-reduced-motion:reduce){.v12-demo-card,.v12-demo-slider img{transition:none}.v12-demo-card:hover{transform:none}}