/* A single static frame; only its content changes between features. */
button.bento-card{text-align:left;color:inherit;font:inherit;line-height:inherit;width:100%;appearance:none}
.feature-modal{width:min(1360px,90vw);height:88dvh;max-width:none;max-height:88dvh;padding:0;border:1px solid #e2e8f3;border-radius:30px;background:#fff;color:var(--ink);box-shadow:0 30px 100px #1e266d22;overflow:hidden;margin:auto}
.feature-modal::backdrop{background:rgba(15,20,40,.28);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.feature-modal[open]{animation:fm-open 500ms cubic-bezier(.22,1,.36,1)}
.feature-modal[open]::backdrop{animation:fm-overlay-in 350ms ease-out}
.feature-modal[open].is-closing{animation:fm-close 300ms ease-in forwards}
.feature-modal[open].is-closing::backdrop{animation:fm-overlay-out 300ms ease-in forwards}
.fm-shell{height:100%;display:flex;flex-direction:column;padding:64px 48px 32px;position:relative}
.fm-close,.fm-navigation button{display:grid;place-items:center;width:46px;height:46px;border:1px solid #e2e8f3;border-radius:50%;background:white;color:var(--navy);padding:0;flex-shrink:0;transition:background 280ms var(--motion-ease),border-color 280ms var(--motion-ease)}
.fm-close{position:absolute;right:22px;top:20px;z-index:2}
.fm-close:hover,.fm-navigation button:hover{background:#edf4ff;border-color:#bdcff1}
.fm-close:focus-visible,.fm-navigation button:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.fm-content{display:grid;grid-template-columns:minmax(0,31fr) minmax(0,69fr);grid-template-rows:auto 1fr;grid-template-areas:'copy demo' 'points demo';column-gap:30px;row-gap:24px;overflow-y:auto;overscroll-behavior:contain;min-height:0;flex:1;padding:10px 5px 14px}
.fm-copy{grid-area:copy;padding-top:14px}.fm-copy .eyebrow{font-size:11px;line-height:1.6;letter-spacing:.12em;margin-bottom:22px;color:var(--blue-dark)}
.fm-copy h2{font-size:clamp(1.8rem,3vw,2.7rem);font-weight:500;line-height:1.14;letter-spacing:-.045em;color:var(--navy)}
.fm-copy>p:last-child{font-size:16px;line-height:1.8;margin-top:24px;color:var(--muted)}
.fm-points{grid-area:points}.fm-points .checks{margin:0}.fm-points .checks li{font-size:14px;line-height:1.65;margin:0 0 15px;align-items:flex-start}.fm-points .checks svg{margin-top:3px}
.fm-demo{grid-area:demo;min-width:0;align-self:center;border-radius:22px;background:#f5f8ff;border:1px solid #e4ebf7;padding:24px;overflow:hidden;position:relative}
.fm-demo-image{display:block;width:100%;height:auto;border-radius:14px}
.fm-navigation{display:flex;align-items:center;gap:12px;padding:22px 5px 0;flex-shrink:0}
.fm-prev svg{transform:rotate(180deg)}.fm-counter{font-size:12px;line-height:1.6;color:#77839a;margin-left:8px}
.fm-demo .mini-cal{width:100%;min-width:0}.fm-demo .product-scene{margin:0;max-width:none;box-shadow:none;padding:0;background:transparent;border-radius:14px}
.fm-demo .product-window{grid-template-columns:1fr;min-height:0;border-radius:14px}.fm-demo .sidebar,.fm-demo .copilot-float{display:none}.fm-demo .product-main{padding:18px 14px}.fm-demo .cal-name{font-size:10px}.fm-demo .calendar{font-size:10px}.fm-demo .booking{font-size:9px}.fm-demo .scene-caption{font-size:10px;line-height:1.6;margin-top:14px}
.fm-demo .conversation{border-radius:16px;box-shadow:none;margin:0}.fm-demo .conversation-head{padding:17px 15px;gap:9px;flex-wrap:wrap;font-size:13px}.fm-demo .conversation-head strong{font-size:14px}.fm-demo .guest{padding:20px 16px}.fm-demo .guest p{font-size:13px;line-height:1.7}.fm-demo .ai-answer{margin:0 16px 16px;padding:17px}.fm-demo .ai-answer p{font-size:13px;line-height:1.7}.fm-demo .conversation-foot{font-size:10px;padding:0 16px 16px}
.fm-demo .connection-view{padding:22px 10px;min-height:0}.fm-demo .connected-top{gap:16px}.fm-demo .connected-top span{font-size:14px;padding:12px 15px}.fm-demo .connection-view>p{font-size:12px}
.fm-demo .invoice-visual{border:0;background:transparent;padding:10px 18px 0;min-height:0}.fm-demo .invoice-card{padding:24px;max-width:none}.fm-demo .invoice-card h3{font-size:23px}.fm-demo .invoice-row{font-size:12px}.fm-demo .greek-label{font-size:10px}.fm-demo .analytics-card{padding:22px;border-radius:16px;box-shadow:none}.fm-demo .analytics-head{font-size:12px}.fm-demo .metrics strong{font-size:26px}.fm-demo .metrics>div>span{font-size:11px}.fm-demo .bar-chart{height:180px}.fm-demo .booking-preview{border-radius:16px;box-shadow:none}.fm-demo .booking-preview>img{min-height:310px;object-fit:cover}.fm-demo .booking-search{left:12px;right:12px;bottom:12px;padding:13px;gap:12px}.fm-demo .booking-search span{font-size:10px}.fm-demo .booking-search b{font-size:13px}.fm-demo .booking-preview-top{left:20px;top:20px}
@keyframes fm-open{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes fm-close{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(8px)}}
@keyframes fm-overlay-in{from{opacity:0}to{opacity:1}}
@keyframes fm-overlay-out{from{opacity:1}to{opacity:0}}
@media(max-width:800px){
.feature-modal{width:calc(100vw - 28px);height:calc(100dvh - 28px);max-height:calc(100dvh - 28px);border-radius:22px}
.fm-shell{padding:60px 20px 20px}.fm-close{right:16px;top:14px;width:42px;height:42px}
.fm-content{display:flex;flex-direction:column;gap:25px;padding:0 2px 10px}.fm-copy{padding-top:4px}.fm-copy h2{font-size:30px}.fm-copy .eyebrow{margin-bottom:16px}.fm-copy>p:last-child{font-size:15px;margin-top:18px}.fm-demo{width:100%;padding:14px;border-radius:17px;flex-shrink:0}.fm-points{margin-top:0}.fm-points .checks li{font-size:14px}.fm-navigation{padding:16px 2px 0;gap:10px}.fm-counter{font-size:11px}.fm-demo .product-main{padding:14px 10px}.fm-demo .calendar-head{font-size:9px;gap:8px}.fm-demo .calendar-head strong{font-size:11px}.fm-demo .product-top strong{font-size:12px}.fm-demo .product-top>span{display:none}.fm-demo .cal-row{grid-template-columns:74px 1fr}.fm-demo .cal-name{font-size:8px;padding:8px 4px}.fm-demo .booking{padding:4px 2px;font-size:7px}.fm-demo .conversation-head .tiny-tag{display:none}.fm-demo .guest{padding:16px 12px}.fm-demo .ai-answer{margin:0 12px 12px;padding:13px}.fm-demo .connection-view{padding:18px 0}.fm-demo .connected-top{gap:10px}.fm-demo .connected-top span{font-size:12px;padding:10px}.fm-demo .invoice-visual{padding:8px 0 0}.fm-demo .invoice-card{padding:18px}.fm-demo .invoice-row{font-size:11px}.fm-demo .analytics-card{padding:16px}.fm-demo .analytics-head{font-size:10px;gap:8px}.fm-demo .metrics strong{font-size:23px}.fm-demo .booking-preview>img{min-height:270px}.fm-demo .booking-search{gap:6px;padding:10px}.fm-demo .search-label{font-size:9px}.fm-demo .booking-search svg{display:none}
}
@media(prefers-reduced-motion:reduce){.feature-modal[open],.feature-modal[open]::backdrop,.feature-modal[open].is-closing,.feature-modal[open].is-closing::backdrop{animation:none!important}.fm-close,.fm-navigation button{transition:none}}

/* Shared Product Tour: one feature, with optional independent workflow tabs. */
.fm-copy .fm-tour-label{font-size:10px;letter-spacing:.15em;color:#77839a;margin:0 0 18px;line-height:1.6}
.fm-copy .eyebrow{letter-spacing:.04em;margin-bottom:18px}
.fm-demo-area{grid-area:demo;min-width:0;align-self:center}
.fm-demo-area .fm-demo{padding:18px}
.fm-points>p{font-size:15px;line-height:1.8;color:var(--muted);margin:0 0 24px}
.fm-tabs{display:flex;gap:6px;overflow-x:auto;white-space:nowrap;max-width:100%;padding:5px 3px 12px;scrollbar-width:thin}
.fm-tabs button{flex-shrink:0;border:1px solid transparent;background:transparent;color:var(--muted);font:inherit;font-size:12px;padding:9px 12px;border-radius:10px;cursor:pointer}
.fm-tabs button[aria-selected=true]{background:#edf4ff;border-color:#d6e3f8;color:var(--navy)}
.fm-tabs button:focus-visible,.fm-demo:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.fm-demo-note{font-size:11px;color:var(--muted);line-height:1.6;margin:14px 0 0}
@media(max-width:800px){.fm-demo-area{width:100%;flex-shrink:0}.fm-demo-area .fm-demo{padding:12px}.fm-copy{order:0}.fm-demo-area{order:1}.fm-points{order:2}.fm-tabs button{font-size:12px;padding:10px}.fm-points>p{margin-bottom:18px}}

/* The recording is contained at 16:9; the original Calendar stays beneath as fallback. */
.fm-video-stage{position:relative;width:100%;border-radius:14px;overflow:hidden}
.fm-video-fallback{position:absolute;inset:0;overflow:auto}
.fm-video-stage .product-demo-video{object-fit:contain}
