/* Showroom follows the live Case Studies hero and presents one build per section. */
.wf-showroom-hero{height:630px;padding:0;background:linear-gradient(145deg,#064c43 7%,#087d71 53%,#119b88 80%,#48bca3)}
.wf-showroom-hero:after{content:none}
.wf-showroom-hero-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:64px;height:100%}
.wf-showroom-hero h1{position:relative;z-index:1;color:#fff;font-size:72px;font-weight:400;line-height:1.2;letter-spacing:-.025em}
.wf-showroom-hero h1 strong{display:block;font-weight:600}
.wf-showroom-hero h1 span{display:block;font-weight:400;white-space:nowrap}
.wf-showroom-portrait{position:relative;align-self:end;min-width:0;height:100%}
.wf-showroom-portrait img{position:absolute;z-index:2;bottom:0;left:50%;transform:translateX(-50%);height:92%;width:auto;max-width:none}
.wf-showroom-circle-back{position:absolute;z-index:1;top:16%;right:0;width:74%;aspect-ratio:1;border-radius:50%;background:linear-gradient(165deg,#23bca5,#89d9b9)}
.wf-showroom-circle-front{position:absolute;z-index:3;bottom:0;left:0;width:55%;aspect-ratio:1;border-radius:50%;background:linear-gradient(140deg,#56d0bcbf,#b9ead761)}
.showroom-browse{padding-block:32px;background:white;border-bottom:1px solid var(--wf-mint)}
.showroom-browse .showroom-toolbar{margin:0 auto;justify-content:space-between;gap:32px}
.showroom-browse .search{flex:1 1 320px;max-width:360px;min-width:0}
.showroom-browse .search-input{font-size:16px;min-height:48px;background:white;border-radius:8px}
.showroom-browse .segments{flex:none;flex-wrap:wrap;gap:24px;padding:0;background:transparent;border-radius:0}
.showroom-browse .segments button{position:relative;min-height:48px;padding:10px 0;border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;font-size:16px;color:var(--wf-body);font-weight:400}
.showroom-browse .segments button.active{box-shadow:none;background:transparent;color:var(--wf-brand);font-weight:600;border-bottom-color:var(--wf-teal)}
.demo-story{padding-block:88px;background:#fff}
.demo-story:nth-child(even){background:var(--wf-surface)}
.demo-story-inner{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);align-items:center;gap:64px}
.demo-story-art,.demo-story-copy{min-width:0}
.demo-story-copy .demo-category{display:block;font-size:12px;line-height:1.5;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--wf-teal);margin:0 0 12px}
.demo-story-copy h2{font-size:40px;line-height:1.2;font-weight:600;letter-spacing:-.025em;color:var(--wf-ink);margin:0 0 24px}
.demo-story-lead{font-size:22px;line-height:1.45;font-weight:500;color:var(--wf-ink);margin:0 0 16px}
.demo-story-summary{font-size:18px;line-height:1.65;font-weight:400;color:var(--wf-body);margin:0}
.demo-story-actions{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin-top:32px}
.demo-story-actions .wf-button{min-height:52px;padding:14px 22px;font-size:16px;font-weight:600;border-radius:4px;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:10px}
.demo-story-actions .wf-button svg{width:18px;height:18px}
.demo-story-actions .demo-details-link{min-height:52px;padding:13px 18px;border:1px solid var(--wf-border);border-radius:4px;font-size:16px;font-weight:500;color:var(--wf-brand);display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;white-space:nowrap}
.demo-story-actions .demo-details-link:hover{background:var(--wf-mint);border-color:var(--wf-teal)}
.demo-story-actions .demo-details-link svg{width:18px;height:18px}
.demo-story-art .demo-image-button{aspect-ratio:4/3;border:1px solid var(--wf-border);border-radius:16px;box-shadow:0 16px 40px -24px rgb(6 76 67 / .25)}
.demo-story-art .product-scene{background:linear-gradient(140deg,#f2f8f5,#d5eee7)}
.demo-story-art .product-window{left:5%;top:9%;width:90%;border-radius:8px;transform:none;box-shadow:0 16px 32px -16px rgb(6 76 67 / .35)}
.demo-story-art .product-window-chrome{height:18px;padding-left:10px}
.demo-story-art .product-focus{right:4%;bottom:8%;width:72%;padding:6px;border-radius:10px;transform:none;box-shadow:0 14px 30px -14px rgb(6 76 67 / .38)}
.demo-story-art .product-scene--portrait .product-focus{width:37%;bottom:6%}
.demo-story-art .demo-image-button:hover .product-window{transform:translateY(-2px)}
.demo-story-art .demo-image-button:hover .product-focus{transform:translateY(-3px)}
.showroom-sections .showroom-empty{padding-block:96px;background:#fff;border:0}
.demo-story-inner{row-gap:24px}
.demo-possibilities{grid-column:1/-1;min-width:0;color:var(--wf-body)}
.demo-possibilities>summary{width:calc((100% - 64px)/2.12);margin-left:auto;cursor:pointer;color:var(--wf-brand);font-size:15px;font-weight:500;line-height:1.5;list-style:none;padding-block:10px;display:flex;align-items:center;gap:12px}
.demo-possibilities>summary::-webkit-detailworkspaceer{display:none}
.demo-possibilities>summary:after{content:'';width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-top:-4px;flex:none}
.demo-possibilities[open]>summary:after{transform:rotate(225deg);margin-top:4px}
.demo-possibilities summary:focus-visible,.demo-use-matches summary:focus-visible{outline:2px solid var(--wf-teal);outline-offset:5px;border-radius:2px}
.demo-possibilities-content{padding-top:28px;border-top:1px solid var(--wf-border);margin-top:12px}
.demo-possibilities-intro{font-size:16px;line-height:1.6;margin:0 0 28px;max-width:680px}
.demo-use-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 64px}
.demo-use-group{min-width:0}
.demo-use-group h3{font-size:18px;line-height:1.4;font-weight:600;color:var(--wf-brand);margin:0 0 16px}
.demo-use-group ol{margin:0;padding-left:32px;list-style:decimal}
.demo-use-group li{font-size:15px;line-height:1.6;padding:5px 8px;border-bottom:1px solid var(--wf-border);overflow-wrap:anywhere}
.demo-use-group li::marker{color:var(--wf-teal);font-size:12px}
.demo-use-group .demo-use-match{background:var(--wf-mint);color:var(--wf-brand);font-weight:500}
.demo-use-matches{margin-top:24px;border-left:3px solid var(--wf-teal);padding:4px 0 4px 18px;font-size:15px;line-height:1.6}
.demo-use-matches p{margin:0 0 8px}
.demo-use-matches ul{list-style:disc;margin:0;padding-left:18px}
.demo-use-matches li{padding-bottom:6px}
.demo-use-matches summary{cursor:pointer;color:var(--wf-brand);margin-block:8px}
.demo-use-matches .demo-use-scope{font-size:13px;margin:12px 0 0;color:var(--wf-body)}
@media(max-width:1100px){.demo-possibilities>summary{width:calc((100% - 40px)/2.12)}.demo-use-groups{column-gap:40px}}
@media(max-width:800px){.demo-possibilities>summary{width:100%;max-width:680px;margin-inline:auto}.demo-use-groups{gap:28px}.demo-possibilities-content{max-width:680px;margin-inline:auto}}
@media(max-width:640px){.demo-use-groups{grid-template-columns:1fr}.demo-use-group li{font-size:14px}.demo-possibilities-content{padding-top:24px}.demo-possibilities>summary{font-size:14px}.demo-use-matches{font-size:14px}}
@media(min-width:1600px){.wf-showroom-hero{height:70vh;min-height:630px;max-height:850px}.wf-showroom-hero h1{font-size:84px}}
@media(max-width:1100px){.wf-showroom-hero h1{font-size:clamp(42px,5.5vw,60px)}.wf-showroom-hero-inner{gap:32px}.demo-story-inner{gap:40px}.demo-story-copy h2{font-size:34px}.demo-story-lead{font-size:20px}.demo-story-summary{font-size:17px}.demo-story-actions{gap:12px}.demo-story-actions .wf-button,.demo-story-actions .demo-details-link{font-size:15px;padding-inline:16px}.showroom-browse .segments{gap:20px}}
@media(max-width:800px){.demo-story{padding-block:64px}.demo-story-inner{grid-template-columns:1fr;gap:40px}.demo-story-art{max-width:680px;width:100%;margin-inline:auto}.demo-story-copy{max-width:680px;width:100%;margin-inline:auto}.demo-story-copy h2{font-size:36px}.showroom-browse .showroom-toolbar{gap:20px}.showroom-browse .search{max-width:none}.showroom-browse .segments{width:100%;gap:24px}}
@media(max-width:640px){.wf-showroom-hero{height:auto}.wf-showroom-hero-inner{grid-template-columns:1fr;gap:12px;padding-top:44px}.wf-showroom-hero h1{font-size:clamp(36px,9.5vw,60px);line-height:1.2}.wf-showroom-portrait{width:100%;max-width:480px;height:390px;margin-inline:auto}.wf-showroom-portrait img{height:100%}.wf-showroom-circle-back{width:65%;top:14%;right:4%}.wf-showroom-circle-front{width:48%;left:2%}.showroom-browse{padding-block:24px}.showroom-browse .segments{gap:16px}.showroom-browse .segments button{font-size:14px;min-height:40px;padding-block:8px}.demo-story{padding-block:48px}.demo-story-inner{gap:28px}.demo-story-copy h2{font-size:32px;line-height:1.25;margin-bottom:20px}.demo-story-lead{font-size:20px;line-height:1.45}.demo-story-summary{font-size:16px;line-height:1.65}.demo-story-actions{gap:12px;margin-top:28px}.demo-story-actions .wf-button,.demo-story-actions .demo-details-link{font-size:14px;padding:12px 16px;min-height:48px}.demo-story-art .product-window-chrome{height:12px}.demo-story-art .product-focus{padding:4px}.showroom-sections .showroom-empty{padding-block:48px}}
@media(max-width:360px){.wf-showroom-hero h1{font-size:34px}.demo-story-actions{gap:8px}.demo-story-actions .wf-button,.demo-story-actions .demo-details-link{padding-inline:12px}}
@media(max-width:640px){.demo-story-actions{display:grid;grid-template-columns:1fr}.demo-story-actions>[data-launch],.demo-story-actions .wf-button,.demo-story-actions .demo-details-link{width:100%}}
@media(prefers-reduced-motion:reduce){.demo-story-art .demo-image-button:hover .product-window,.demo-story-art .demo-image-button:hover .product-focus{transform:none}}
