/* Four concept websites with deliberately different compositions. */
.demo-dialog{width:min(1420px,98vw);max-width:1420px;max-height:98dvh;border-radius:16px}
.demo-toolbar{padding:12px 28px;background:#fffdf5}.demo-toolbar strong{font-size:14px}.demo-toolbar span{font-size:11px}.dialog-close{flex-shrink:0}
.concept-site{overflow:hidden}.concept-nav{padding:28px 55px}.concept-logo{font-size:38px}.concept-nav button{font-size:14px;min-height:44px}
.concept-hero{padding:65px 60px 80px;min-height:590px;gap:10px;isolation:isolate}.concept-hero-copy{position:relative;z-index:2;min-width:0}.concept-hero h2{font-size:clamp(60px,6.8vw,100px);line-height:1.02;letter-spacing:-.045em;max-width:none}.concept-hero h2 em{font-weight:400}.concept-hero .eyebrow{opacity:1;font-size:12px;letter-spacing:.14em}.concept-hero p:not(.eyebrow){font-size:17px;max-width:370px;margin-top:27px}.concept-action{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;padding:16px 23px;border-radius:999px;font-size:14px;font-weight:750;margin-top:30px;min-height:48px}.concept-action span{font-size:22px}
.concept-art{position:relative;min-width:0;height:440px;display:flex;align-items:center;justify-content:center}.concept-main-photo{position:relative;z-index:1;object-fit:contain;width:125%;max-width:none;height:100%;transform:translateY(var(--concept-lift,0px)) rotate(-6deg)}.concept-art-shape{position:absolute;inset:4% -6%;border-radius:50%;background:#795232}.concept-seal{position:absolute;right:8%;top:-15px;z-index:3;display:grid;place-items:center;width:115px;height:115px;border:1px solid currentColor;border-radius:50%;text-align:center;font:italic 20px/1.15 Georgia;transform:rotate(12deg);background:#f5ddac;color:#442b20}.concept-hero-number{position:absolute;left:60px;bottom:25px;font-size:10px;letter-spacing:.18em}
.concept-ribbon{display:flex;justify-content:space-around;align-items:center;gap:22px;padding:24px 35px;border-block:1px solid currentColor;font-size:12px;font-weight:750;letter-spacing:.16em;white-space:nowrap}.concept-ribbon i{font-style:normal;font-size:25px;line-height:1}
.concept-menu{padding:85px 60px}.concept-menu>.eyebrow{font-size:11px;letter-spacing:.12em;margin-bottom:12px}.concept-menu>h2{font-size:56px;line-height:1.1}.concept-filters{margin-block:30px 40px}.concept-menu-grid{gap:34px}.concept-menu-item{display:block;padding-bottom:28px}.concept-menu-item img{height:240px;border-radius:16px;object-fit:cover;background:#f3e4ce;margin-bottom:23px}.concept-menu-item h3{font-size:29px;line-height:1.15}.concept-menu-item p{font-size:15px;line-height:1.8;min-height:54px}.concept-menu-item strong{font-size:18px;margin-top:16px}.concept-menu-item[data-category="Pastries"] img,.concept-menu-item[data-category="Pastry"] img{object-fit:contain}.concept-empty{font-size:12px;padding-inline:0;margin-top:20px}
.concept-story{display:grid;grid-template-columns:1fr 1fr;gap:75px;padding:80px 60px;align-items:center}.story-image{position:relative;min-width:0}.story-image img{width:100%;height:430px;object-fit:cover;border-radius:180px 180px 5px 5px}.story-image p{position:absolute;left:22px;bottom:25px;max-width:80%;padding:18px 25px;background:#fff6e2;color:#3b2b20;transform:rotate(-5deg);font:italic 23px/1.2 Georgia;box-shadow:0 10px 25px #0002}.story-copy h2{font:54px/1.08 var(--demo-font);letter-spacing:-.035em}.story-copy h2 em{font-weight:400}.story-copy>p:not(.eyebrow){font-size:17px;line-height:1.85;margin-top:25px}.story-signoff{display:block;font:italic 24px/1.4 Georgia;margin-top:25px}.story-copy>.eyebrow{font-size:12px}.concept-footer{padding:35px 60px}.concept-footer button{border-radius:999px;padding:16px 22px}
.concept-site.demo-bakery{--demo-bg:#352219;--demo-ink:#f7edda}.demo-bakery .concept-nav{border-color:#73503e}.demo-bakery .concept-logo{font-style:italic}.demo-bakery .concept-action{background:#f4dfb9;color:#352219;border-color:#f4dfb9}.demo-bakery .concept-ribbon{background:#eed4a0;color:#432a1d;border:0}.demo-bakery .concept-menu{background:#fff7e9;color:#432a1d}.demo-bakery .concept-menu-item{border-color:#cdbda6}.demo-bakery .concept-filters button{color:#432a1d;border-color:#ba9a6f}.demo-bakery .concept-filters button[aria-pressed=true]{background:#432a1d;color:#fff7e9}.demo-bakery .story-image img{object-fit:contain;background:#69432d}.demo-bakery .story-copy>.eyebrow{color:#e6bc7c}
.concept-site.demo-cafe{--demo-bg:#f2f4df;--demo-ink:#214e39}.demo-cafe .concept-nav{display:grid;grid-template-columns:1fr auto 1fr;gap:20px}.demo-cafe .concept-nav:before{content:'☀';font:42px Georgia}.demo-cafe .concept-nav>div{justify-content:flex-end}.demo-cafe .concept-logo{font-size:39px}.concept-hero-cafe{display:block;text-align:center;padding-top:45px;padding-bottom:65px}.concept-hero-cafe h2{font-size:clamp(65px,7.5vw,108px)}.concept-hero-cafe h2 br{display:none}.concept-hero-cafe h2 em{display:block}.concept-hero-cafe p:not(.eyebrow){margin-inline:auto;max-width:530px}.concept-hero-cafe .concept-action{margin-top:22px}.concept-hero-cafe .concept-art{height:370px;margin:50px auto 0;max-width:900px}.concept-hero-cafe .concept-main-photo{height:100%;width:90%;object-fit:cover;border-radius:180px 180px 7px 7px;transform:translateY(var(--concept-lift,0px));object-position:50% 58%}.concept-hero-cafe .concept-art-shape{display:none}.concept-hero-cafe .concept-seal{left:-20px;right:auto;top:30px;background:#e0ecc7;color:#254e38;transform:rotate(-13deg);width:128px;height:128px}.coffee-postcard{position:absolute;right:-2%;bottom:-30px;width:190px;background:#fffdf2;padding:10px;z-index:3;transform:rotate(8deg);box-shadow:0 15px 28px #234f3125}.coffee-postcard img{height:165px;width:100%;object-fit:cover}.coffee-postcard span{display:block;padding:12px 5px 6px;font:italic 17px/1.25 Georgia;color:#214e39}.demo-cafe .concept-ribbon{color:#f2f4df;background:#214e39;border:0}.demo-cafe .concept-menu{background:#fffdf3}.demo-cafe .concept-menu-grid{grid-template-columns:1fr}.demo-cafe .concept-menu-item{display:grid;grid-template-columns:190px 1fr auto;gap:0 35px;padding-block:15px 30px;align-items:center;border-color:#bcc8ab}.demo-cafe .concept-menu-item img{grid-column:1;grid-row:1/4;height:150px;margin:0;border-radius:80px 80px 8px 8px}.demo-cafe .concept-menu-item h3{grid-column:2;font-size:34px}.demo-cafe .concept-menu-item p{grid-column:2;min-height:0;max-width:480px;margin-top:10px}.demo-cafe .concept-menu-item strong{grid-column:3;grid-row:1/4;align-self:center;font:30px Georgia}.demo-cafe .concept-story{background:#dce7ca}.demo-cafe .story-image img{border-radius:50% 50% 8px 8px;object-position:50% 58%}
.concept-site.demo-dessert{--demo-bg:#ffdfdf;--demo-ink:#793346}.demo-dessert .concept-nav{border-color:#d29baa}.demo-dessert .concept-logo{font-style:italic;font-size:41px}.concept-hero-dessert{grid-template-columns:1.1fr 1fr;gap:55px;min-height:620px;background:radial-gradient(ellipse at 30% 45%,#fff3e9 0 30%,transparent 30.2%)}.concept-hero-dessert .concept-art{grid-row:1;grid-column:1;height:455px}.concept-hero-dessert .concept-hero-copy{grid-column:2;grid-row:1}.concept-hero-dessert h2{font-size:clamp(66px,6.5vw,94px)}.concept-hero-dessert .concept-main-photo{width:108%;height:100%;object-fit:cover;border-radius:50% 50% 8px 8px;transform:translateY(var(--concept-lift,0px)) rotate(-4deg);mix-blend-mode:normal}.concept-hero-dessert .concept-art-shape{display:none}.concept-hero-dessert .concept-seal{background:#fff7e7;color:#793346;right:-22px;top:-25px}.demo-dessert .concept-action{background:#793346;color:#fff5e9;border-color:#793346}.demo-dessert .concept-ribbon{background:#793346;color:#ffe9e3;border:0}.demo-dessert .concept-menu{background:#fff5ed;text-align:center}.demo-dessert .concept-filters{justify-content:center}.demo-dessert .concept-menu-grid{text-align:left}.demo-dessert .concept-menu-item img{border-radius:50% 50% 12px 12px;height:270px;background:#f9e1db}.demo-dessert .concept-menu-item{border-color:#dcc0c1}.demo-dessert .concept-story{grid-template-columns:1fr 1fr}.demo-dessert .story-image{order:2}.demo-dessert .story-copy{order:1}.demo-dessert .story-image img{border-radius:50%;height:430px}.demo-dessert .story-image p{background:#793346;color:#ffefdf}
.concept-site.demo-tacos{--demo-bg:#ffd24c;--demo-ink:#a92920}.demo-tacos .concept-nav{background:#a92920;color:#fff2c3;border:0}.demo-tacos .concept-logo{font:850 28px Sora!important;letter-spacing:-.05em}.concept-hero-tacos{grid-template-columns:1.1fr 1fr;gap:0;padding-bottom:80px;min-height:610px}.concept-site.demo-tacos .concept-hero h2{font:850 clamp(58px,7.8vw,112px)/.98 Sora;letter-spacing:-.07em;position:relative;z-index:3;max-width:800px}.concept-hero-tacos h2 span{display:block;color:#a92920}.concept-hero-tacos .concept-art{height:440px}.concept-hero-tacos .concept-main-photo{width:120%;height:100%;object-fit:cover;border-radius:48% 42% 50% 40%;transform:translateY(var(--concept-lift,0px)) rotate(9deg);border:8px solid #ffe997}.concept-hero-tacos .concept-art-shape{inset:-6% -10%;background:#ed643f;transform:rotate(-12deg)}.concept-hero-tacos .concept-seal{background:#a92920;color:#fff2c3;top:-40px;right:-5px;border:0;font:850 19px/1.15 Sora;transform:rotate(14deg)}.demo-tacos .concept-action{background:#a92920;color:#fff2c3;border-color:#a92920}.demo-tacos .concept-ribbon{background:#a92920;color:#fff2c3;border:0;font-size:16px}.demo-tacos .concept-menu{background:#fff3cf;color:#83251c}.demo-tacos .concept-menu>h2{text-transform:uppercase;font:850 50px/1.1 Sora}.demo-tacos .concept-menu-grid{grid-template-columns:1.4fr 1fr}.demo-tacos .concept-menu-item img{height:290px;border-radius:18px;object-fit:cover}.demo-tacos .concept-menu-item h3{font:750 26px/1.2 Sora}.demo-tacos .concept-menu-item{border-color:#d5af70}.demo-tacos .concept-story{background:#a92920;color:#fff2c3}.demo-tacos .story-copy h2{font:850 52px/1 Sora;letter-spacing:-.06em}.demo-tacos .story-copy h2 em{font-style:normal;font-weight:850;color:#ffd24c}.demo-tacos .story-image img{border:8px solid #ffd24c;border-radius:25px;transform:rotate(-5deg);height:350px}.demo-tacos .story-copy .concept-action{border-color:#fff2c3}.demo-tacos .story-signoff{font-family:Manrope;font-style:normal;font-weight:750}.demo-tacos .concept-footer{border-color:#bd8626}
.concept-hero-cafe h2{font-size:clamp(60px,6vw,88px)}.concept-hero-cafe h2 em{display:inline;margin-left:.15em}.concept-hero-cafe .concept-art{margin-top:32px}
.update-turnaround{padding:18px 22px;background:#fffaf0;border-left:4px solid #2d633d;border-radius:0 14px 14px 0;font-size:16px!important;line-height:1.75!important}.update-turnaround strong{display:block;margin-bottom:5px;color:#285238}
.gallery-guide{display:none}.showcase-scroll,.showcase-viewport{min-width:0}
/* An obvious, scroll-driven showcase with an ordinary grid as its fallback. */
@media(min-width:1100px) and (min-height:700px) and (prefers-reduced-motion:no-preference){
 .motion-ready .showcase-scroll{height:205vh;position:relative;content-visibility:visible}
 .motion-ready .showcase-viewport{position:sticky;top:105px;overflow:clip;padding:10px 4px 22px}
 .motion-ready .showcase-grid{display:flex;gap:32px;transform:translateX(var(--gallery-shift,0px));width:100%;align-items:flex-start}
 .motion-ready .showcase-card{flex:0 0 min(540px,45vw);min-width:0;translate:none;rotate:none}
 .motion-ready .showcase-card .card-window{height:310px}
 .motion-ready .gallery-guide{display:flex;align-items:center;gap:25px;justify-content:space-between;margin-bottom:22px;padding-inline:3px;font-size:16px;font-weight:750}
 .gallery-guide b{font-size:23px;margin-left:10px}.gallery-meter{height:4px;flex:1;max-width:220px;background:#e8dfc9;border-radius:3px;overflow:hidden}.gallery-meter i{display:block;width:100%;height:100%;background:#cf352d;transform:scaleX(var(--gallery-progress,0));transform-origin:left}
 .gallery-controls{display:flex;gap:9px}.gallery-controls button{width:40px;height:40px;border:1px solid #cbbd9c;background:#fff4cd;border-radius:50%;font-size:22px;line-height:1}.gallery-controls button:disabled{opacity:.4;cursor:default}
}
@media(max-width:900px){.concept-nav{padding:22px 30px}.concept-hero{padding:45px 35px 60px;min-height:0}.concept-hero h2{font-size:65px}.concept-art{height:350px}.concept-seal{width:95px;height:95px;font-size:17px}.concept-menu,.concept-story{padding:60px 35px}.concept-story{gap:35px}.story-copy h2{font-size:43px}.story-image img{height:330px}.concept-menu-item img{height:185px}.concept-ribbon{font-size:10px;gap:15px;letter-spacing:.07em;padding-inline:25px}.concept-menu-grid{gap:20px}.concept-menu-item h3{font-size:25px}.concept-hero-dessert{gap:30px}.concept-hero-dessert .concept-art{height:340px}.concept-hero-cafe .concept-art{height:320px}.concept-hero-cafe h2{font-size:77px}.coffee-postcard{width:155px}.coffee-postcard img{height:140px}.demo-cafe .concept-logo{font-size:32px}.demo-cafe .concept-nav{grid-template-columns:40px 1fr auto}.demo-cafe .concept-nav>div{gap:4px}.demo-cafe .concept-menu-item{grid-template-columns:140px 1fr auto;gap:0 25px}.demo-cafe .concept-menu-item img{height:135px}.demo-cafe .concept-menu-item h3{font-size:27px}.concept-site.demo-tacos .concept-hero h2{font-size:70px}.concept-hero-tacos .concept-art{height:330px}.demo-tacos .concept-ribbon{font-size:12px}.concept-hero-number{left:35px;bottom:20px}.demo-dessert .story-image img{height:330px}.concept-footer{padding:30px 35px}}
@media(max-width:680px){
 .demo-dialog{width:100%;max-width:100%;height:100dvh;max-height:100dvh;margin:0;border-radius:0}.demo-toolbar{padding:10px 18px;gap:12px}.demo-toolbar strong{font-size:12px}.demo-toolbar span{font-size:10px;max-width:250px}.concept-nav{padding:24px;flex-wrap:wrap;gap:14px}.concept-logo{font-size:34px}.concept-nav>div{gap:15px}.concept-nav button{font-size:13px;padding:5px 0;min-height:36px}
 .concept-hero{display:flex;flex-direction:column;gap:25px;padding:40px 25px 55px;text-align:left}.concept-hero-copy{width:100%}.concept-hero h2{font-size:clamp(54px,12vw,76px);line-height:1.03}.concept-hero .eyebrow{font-size:10px;letter-spacing:.1em}.concept-hero p:not(.eyebrow){font-size:16px;line-height:1.8;max-width:420px;margin-top:23px}.concept-action{margin-top:25px;font-size:13px;padding:14px 20px}.concept-art{height:300px;width:100%;margin-top:25px}.concept-main-photo{width:116%;height:100%}.concept-seal{width:90px;height:90px;right:0;top:-15px;font-size:17px}.concept-hero-number{left:25px;bottom:18px;font-size:9px}.concept-ribbon{gap:15px;padding:19px 22px;font-size:9px;letter-spacing:.04em;flex-wrap:wrap;justify-content:center}.concept-ribbon i{font-size:16px}.concept-ribbon i:last-child{display:none}
 .concept-menu{padding:50px 25px}.concept-menu>h2{font-size:43px}.concept-menu>.eyebrow{font-size:10px;max-width:270px}.concept-filters{gap:8px;margin-block:23px 28px;flex-wrap:wrap}.concept-filters button{font-size:13px;padding:9px 14px}.concept-menu-grid{grid-template-columns:1fr;gap:30px}.concept-menu-item img{height:235px;margin-bottom:20px}.concept-menu-item h3{font-size:29px}.concept-menu-item p{font-size:15px;min-height:0}.concept-menu-item strong{font-size:18px}.concept-story{grid-template-columns:1fr;padding:50px 25px;gap:35px}.story-image img{height:330px}.story-image p{font-size:22px;padding:16px 20px}.story-copy h2{font-size:45px}.story-copy>p:not(.eyebrow){font-size:16px}.concept-footer{padding:28px 25px;gap:20px;display:block}.concept-footer>button{margin-top:20px;font-size:13px}.concept-footer>p{font-size:12px;line-height:1.8}
 .demo-cafe .concept-nav{display:flex;justify-content:space-between}.demo-cafe .concept-nav:before{display:none}.demo-cafe .concept-logo{font-size:32px}.concept-hero-cafe{text-align:center}.concept-hero-cafe h2{font-size:59px}.concept-hero-cafe .concept-art{height:300px;margin-top:20px;margin-bottom:30px}.concept-hero-cafe .concept-main-photo{width:100%;border-radius:150px 150px 5px 5px}.concept-hero-cafe .concept-seal{left:-10px;top:0;width:85px;height:85px;font-size:16px}.coffee-postcard{width:123px;right:-10px;bottom:-30px;padding:7px}.coffee-postcard img{height:110px}.coffee-postcard span{font-size:13px;padding:8px 2px 3px}.demo-cafe .concept-menu-item{grid-template-columns:95px 1fr;gap:0 18px;padding-block:5px 25px}.demo-cafe .concept-menu-item img{height:120px;width:95px;grid-row:1/4}.demo-cafe .concept-menu-item h3{font-size:23px}.demo-cafe .concept-menu-item p{font-size:13px;line-height:1.6;margin-top:8px}.demo-cafe .concept-menu-item strong{grid-column:2;grid-row:3;font-size:22px;margin-top:12px}.demo-cafe .concept-story{padding-block:50px}
 .concept-hero-dessert .concept-hero-copy{order:1}.concept-hero-dessert .concept-art{order:2;height:330px;width:90%;margin-top:20px}.concept-hero-dessert h2{font-size:64px}.concept-hero-dessert .concept-main-photo{width:100%;height:100%}.concept-hero-dessert .concept-seal{right:-15px;top:-10px}.concept-hero-dessert{background:radial-gradient(ellipse at 50% 70%,#fff3e9 0 32%,transparent 32.2%)}.demo-dessert .concept-menu-grid{grid-template-columns:1fr}.demo-dessert .concept-menu-item img{height:280px}.demo-dessert .concept-story{grid-template-columns:1fr}.demo-dessert .story-image{order:1}.demo-dessert .story-copy{order:2}.demo-dessert .story-image img{height:330px}
 .concept-site.demo-tacos .concept-logo{font-size:25px!important}.concept-site.demo-tacos .concept-hero h2{font-size:clamp(52px,14vw,78px);line-height:1;letter-spacing:-.055em}.concept-hero-tacos .concept-art{height:310px;width:90%;margin-top:20px}.concept-hero-tacos .concept-main-photo{width:110%;height:100%;border-width:5px}.concept-hero-tacos .concept-seal{width:85px;height:85px;font-size:15px;top:-30px;right:-15px}.demo-tacos .concept-ribbon{font-size:10px}.demo-tacos .concept-menu>h2{font-size:38px}.demo-tacos .concept-menu-grid{grid-template-columns:1fr}.demo-tacos .concept-menu-item img{height:230px}.demo-tacos .story-copy h2{font-size:44px}.demo-tacos .story-image img{height:300px}
}
@media(max-width:680px){.concept-hero-cafe h2 em{display:block;margin-left:0}}
@media(prefers-reduced-motion:reduce){.concept-main-photo{translate:none!important;--concept-lift:0px!important}}
