@font-face{font-family:Manrope;src:url(manrope-regular.ttf) format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Manrope;src:url(manrope-extrabold.ttf) format('truetype');font-weight:600 900;font-display:swap}
.example-banner{position:sticky;top:0;z-index:1000;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;min-height:83px;padding:11px 28px;background:#20221f;color:#f4f3ed;font:400 12px/1.5 Manrope,Arial,sans-serif;border-bottom:2px solid #f4512a;box-sizing:border-box;isolation:isolate}
.example-banner a{color:#f4f3ed;text-decoration:none;letter-spacing:0}
.example-banner .demo-back{justify-self:start;display:inline-flex;align-items:center;gap:10px;border:1px solid #77786c;padding:10px 15px;min-height:44px;border-radius:3px;font-size:12px;font-weight:800;white-space:nowrap}
.example-banner .demo-back:hover{background:#35372e}
.example-banner .demo-context{margin:0;text-align:center;color:#f4f3ed;font:inherit;display:grid;gap:2px}
.example-banner .demo-context>strong{color:#ffa78e;font-size:8px;line-height:1.5;letter-spacing:.12em;font-weight:800}
.example-banner .demo-context>span{font-size:13px;font-weight:800;line-height:1.4}.demo-context i{font:inherit;font-weight:400;color:#ced0c3}.example-banner .demo-context>small{font-size:10px;color:#c1c5b6;line-height:1.5}
.demo-controls{display:flex;gap:18px;align-items:center;justify-content:flex-end}.example-banner .demo-home{font-size:11px;line-height:1.5;padding:11px 0;white-space:nowrap}.demo-home:hover{text-decoration:underline}.demo-home>span{margin-left:5px}
.demo-switcher{position:relative;color:#f4f3ed;font:400 12px/1.5 Manrope,Arial,sans-serif;text-align:left}.demo-switcher>summary{list-style:none;display:flex;align-items:center;gap:17px;cursor:pointer;min-height:44px;padding:10px 15px;background:#f4f3ed;color:#20221f;border-radius:3px;font-weight:800;font-size:12px;white-space:nowrap;letter-spacing:0}.demo-switcher>summary::-webkit-details-marker{display:none}.demo-switcher>summary>span{font-size:15px}.demo-switcher[open]>summary{background:#e6e6d9}
.demo-switch-menu{position:absolute;top:calc(100% + 12px);right:0;width:340px;max-width:calc(100vw - 32px);max-height:65dvh;overflow:auto;background:#f7f6ef;color:#20221f;border:1px solid #d7d9cb;box-shadow:0 15px 35px #0004;padding:14px;border-radius:4px}
.demo-switch-menu>p{padding:2px 10px 12px;margin:0;color:#6a705d;font:800 9px/1.5 Manrope,Arial,sans-serif;letter-spacing:.1em}.example-banner .demo-switch-menu>a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px;border-bottom:1px solid #e0e2d5;color:#20221f;min-height:56px;white-space:normal}.demo-switch-menu>a>span{display:grid;gap:3px}.demo-switch-menu strong{font-size:13px;letter-spacing:0;font-weight:800}.demo-switch-menu small{font-size:10px;color:#6b725f}.demo-switch-menu b{font-size:10px;color:#6b725f;font-weight:400}.demo-switch-menu>a:hover,.demo-switch-menu>a[aria-current]{background:#e8eadf}.example-banner .demo-switch-menu>.switch-all{font-size:11px;font-weight:800;border:0;min-height:42px;padding-bottom:0}
.example-banner a:focus-visible,.example-banner summary:focus-visible{outline:3px solid #ffa78e;outline-offset:3px}
.demo-exit-panel{background:#eeede4;color:#20221f;border-top:3px solid #f4512a;padding:40px 32px 25px;font:400 13px/1.7 Manrope,Arial,sans-serif}.demo-exit-inner{max-width:1250px;margin:auto}.demo-exit-cta{display:flex;justify-content:space-between;align-items:center;gap:30px;padding-bottom:32px}.demo-exit-cta>div>p{font:800 9px/1.5 Manrope,Arial,sans-serif;letter-spacing:.1em;color:#706d5d;margin:0 0 12px}.demo-exit-cta h2{font:800 30px/1.2 Manrope,Arial,sans-serif;color:#20221f;letter-spacing:-.04em;margin:0 0 10px}.demo-exit-cta>div>span{color:#5f6453;font-size:13px}.demo-exit-cta>a{display:flex;justify-content:space-between;gap:35px;align-items:center;min-height:48px;padding:12px 22px;background:#20221f;color:#f4f3ed;border-radius:3px;font-size:12px;font-weight:800;text-decoration:none;white-space:nowrap}.demo-exit-cta>a:hover{background:#3a3e32}.demo-exit-inner>nav{display:flex;align-items:center;justify-content:space-between;gap:25px;padding-top:22px;border-top:1px solid #cdd0c2}.demo-exit-inner>nav>a{color:#30362a;font-size:12px;font-weight:800;text-decoration:none;line-height:1.5;padding-block:8px}.demo-exit-inner>nav>a:hover{text-decoration:underline}.demo-exit-inner>nav>span{font-size:10px;color:#737968;white-space:nowrap}.demo-exit-panel a:focus-visible{outline:3px solid #ae3818;outline-offset:5px}
.demo-skip{position:fixed;left:16px;top:8px;transform:translateY(-200%);z-index:1100;background:#20221f;color:white;padding:12px 18px;font:700 13px Manrope,Arial,sans-serif}
.demo-skip:focus{transform:none}
.demo-noscript{padding:20px;background:#fff0dd;color:#20221f;font:400 14px/1.7 Manrope,Arial,sans-serif;text-align:center}
body[data-demo-site] .demo-header{position:relative;top:auto}
body[data-demo-site] .demo-legal{max-width:600px}
body[data-demo-site] .demo-form input,body[data-demo-site] .demo-form select,body[data-demo-site] .demo-form textarea{color-scheme:light}
@media(max-width:1050px){.example-banner{grid-template-columns:auto 1fr auto;padding-inline:20px;gap:18px}.example-banner .demo-home{font-size:10px}.demo-controls{gap:12px}.example-banner .demo-context>span{font-size:12px}.demo-switcher>summary{padding-inline:12px;gap:10px}}
@media(max-width:760px){html{scroll-padding-top:135px}.example-banner{grid-template-columns:auto 1fr;gap:9px 14px;padding:9px 16px 10px}.example-banner .demo-context{grid-column:1/-1;grid-row:2;display:flex;justify-content:center;align-items:center;gap:7px;flex-wrap:wrap}.example-banner .demo-context>strong{font-size:7px}.example-banner .demo-context>span{font-size:11px}.example-banner .demo-context>small{font-size:9px}.demo-context i{font-size:10px}.example-banner .demo-back{font-size:11px;padding:9px 11px;gap:8px;min-height:42px}.demo-controls{gap:13px}.demo-switcher>summary{font-size:11px;min-height:42px;padding:9px 11px;gap:10px}.example-banner .demo-home{font-size:10px}.demo-exit-panel{padding:32px 23px 20px}.demo-exit-cta{flex-direction:column;align-items:start;gap:20px;padding-bottom:25px}.demo-exit-cta h2{font-size:29px}.demo-exit-inner>nav{flex-wrap:wrap;gap:15px;justify-content:space-between}.demo-exit-inner>nav>span{width:100%;order:3;text-align:center;font-size:9px}.demo-exit-inner>nav>a{font-size:10px}.demo-header nav{gap:12px!important}.demo-header nav a{font-size:10px!important}}
@media(max-width:450px){.example-banner{padding-inline:12px;gap:8px}.demo-controls{gap:10px}.example-banner .demo-home{font-size:9px}.demo-home>span{display:none}.demo-switcher>summary{font-size:10px;gap:7px;padding-inline:9px}.example-banner .demo-back{font-size:10px;padding-inline:10px}.example-banner .demo-context>small{width:100%;font-size:8px}.example-banner .demo-context{gap:3px 7px}.demo-switch-menu{width:310px}.demo-exit-cta>div>span{font-size:12px}}
