.city-example.city-example-interactive{background:#fff;border:1px solid #deded8;border-radius:4px;padding:0;display:block;overflow:hidden}.city-example-intro{grid-template-columns:1fr 1fr;gap:10px 7%;padding:38px 38px 28px;display:grid}.city-example-intro>.eyebrow{color:#b33d08;grid-column:1/-1;align-items:center;gap:9px;display:flex}.city-example-intro h2{letter-spacing:-.045em;margin:12px 0 0;font-size:clamp(29px,3.1vw,46px);line-height:1.1}.city-example-intro>p{color:#595955;align-self:center;margin:12px 0 0}.city-example-badge{color:#676762;grid-column:1/-1;align-items:center;gap:8px;margin-top:13px;font-size:11px;display:flex}.city-example-badge>span{background:#f56624;border-radius:50%;width:7px;height:7px}.city-example-workspace{border-top:1px solid #deded8;grid-template-columns:minmax(230px,.8fr) minmax(0,1.2fr);display:grid}.city-example-controls{border-right:1px solid #deded8;padding:28px 32px}.city-example-controls-head{justify-content:space-between;align-items:center;gap:14px;display:flex}.city-example-controls-head h3{margin:0;font-size:18px}.city-example-controls-head>button{color:#656560;cursor:pointer;background:0 0;border:0;align-items:center;gap:5px;padding:8px 0;font-size:11px;display:flex}.city-example-control{border-bottom:1px solid #e5e5e0;grid-template-columns:1fr 106px;align-items:center;gap:13px 15px;padding:22px 0;font-size:13px;display:grid}.city-example-control>div{background:#fff;border:1px solid #cececa;border-radius:3px;align-items:center;padding-right:10px;display:flex}.city-example-control input[type=number]{width:100%;min-width:0;font:inherit;background:0 0;border:0;padding:9px 6px 9px 10px;font-weight:650}.city-example-control input[type=range]{accent-color:#f56624;cursor:pointer;grid-column:1/-1;width:100%;height:20px}.city-example-control>div>span{color:#777;font-size:11px}.city-example-gate{color:#676762;gap:12px;display:flex;margin:24px 0 0!important;font-size:12px!important;line-height:1.65!important}.city-example-gate>svg{color:#c2460e;flex-shrink:0;margin-top:3px}.city-example-gate strong{color:#272723;margin-bottom:4px;font-weight:650;display:block}.city-example-plan-head{color:#696963;border-bottom:1px solid #e8e8e3;justify-content:space-between;align-items:center;gap:12px;padding:18px 24px;font-size:11px;display:flex}.city-example-plan-head>span:first-child{color:#171717;align-items:center;gap:8px;font-weight:600;display:flex}.city-example-visual{background:#fafaf8;min-width:0}.city-example-visual>svg{width:100%;height:auto;max-height:360px;display:block}.city-example-calculation{color:#fff;background:#171717;min-height:200px;padding:26px 30px}.city-example-calculation>span{color:#efefea;font-size:12px}.city-example-calculation>strong{letter-spacing:-.05em;color:#ff823f;margin:12px 0;font-size:clamp(35px,4vw,56px);line-height:1.1;display:block}.city-example-calculation>p{color:#f6f6f0;margin:12px 0!important;font-size:13px!important;line-height:1.5!important}.city-example-calculation>small{color:#c9c9c3;max-width:380px;font-size:11px;line-height:1.6;display:block}.city-example-bottom{border-top:1px solid #deded8;justify-content:space-between;align-items:center;gap:28px;padding:26px 32px;display:flex}.city-example-bottom>div{max-width:560px}.city-example-bottom p{color:#5d5d58;margin:0 0 7px!important;font-size:12px!important;line-height:1.65!important}.city-example-bottom small{color:#6a6a64;font-size:11px;line-height:1.6;display:block}.city-example-bottom>.button{cursor:pointer;flex-shrink:0;gap:16px;min-height:48px;font-size:12px}.city-example-status{color:#3f3f39;padding:0 32px 20px;margin:0!important;font-size:12px!important}.city-example-status:empty{display:none}.city-example-control:focus-within>div{border-color:#ef5d19}.city-example-controls-head>button:hover{color:#bd4109}:is(.city-example-interactive button:focus-visible,.city-example-interactive input:focus-visible){outline-offset:4px;outline:2px solid #ef5d19}@media (min-width:761px) and (prefers-reduced-motion:no-preference){.city-example-bottom>.button{transition:transform .18s,background-color .18s}.city-example-bottom>.button:hover{transform:translateY(-2px)}}@media (max-width:760px){.city-example-intro{grid-template-columns:1fr;gap:10px;padding:26px 24px}.city-example-intro>.eyebrow,.city-example-badge{grid-column:auto}.city-example-workspace{grid-template-columns:1fr}.city-example-controls{border-bottom:1px solid #deded8;border-right:0;padding:24px}.city-example-control{padding:16px 0}.city-example-visual>svg{max-height:310px}.city-example-bottom{flex-direction:column;align-items:stretch;gap:18px;padding:24px}.city-example-bottom>.button{justify-content:center}.city-example-status{padding:0 24px 20px}.city-example-calculation{padding:24px}.city-example-plan-head{padding:17px 24px}.city-example-interactive .city-example-intro h2{font-size:32px}}@media (max-width:360px){.city-example-intro,.city-example-controls,.city-example-bottom,.city-example-calculation{padding:20px}.city-example-plan-head{padding:15px 20px;font-size:10px}.city-example-interactive .city-example-intro h2{font-size:29px}.city-example-controls-head h3{font-size:16px}}