@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap');
*{box-sizing:border-box}
body{margin:0;background:#fff;color:#111;font:14px Montserrat,Arial,sans-serif;line-height:1.5}
button,input{font:inherit}button,a,input,label{touch-action:manipulation}
header{height:88px;display:flex;justify-content:center;align-items:center;border-bottom:1px solid #ededed}
header img{display:block;width:180px;height:auto}
main{max-width:700px;margin:32px auto 60px;padding:0 24px}
.entry{border:1px solid #e2e2e2;border-radius:8px;padding:32px 36px;background:white;box-shadow:0 2px 10px #00000006}
fieldset{border:0;padding:0;margin:0 0 28px;min-width:0}
legend{font-size:19px;font-weight:500;margin-bottom:18px;letter-spacing:-.4px}
legend>span{font-size:13px;color:#666;margin-right:10px}
.bags{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.choice{position:relative;cursor:pointer;display:block}
.choice input{position:absolute;opacity:0;width:1px;height:1px}
.choice .box{display:block;padding:17px 12px;border:1px solid #cfcfcf;border-radius:4px;text-align:center;background:#fff}
.choice input:checked+.box{border:2px solid #111;padding:16px 11px;background:#f8f8f8}
.choice input:focus-visible+.box{outline:3px solid #777;outline-offset:3px}
.offices{display:grid;gap:12px}
.offices .box{text-align:left;padding:19px 20px}
.offices input:checked+.box{padding:18px 19px}
.office-name{font-size:17px;font-weight:600;display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.office-name>span:first-child{display:flex;align-items:center;gap:12px;flex-wrap:wrap}

.check{display:inline-grid;place-items:center;flex-shrink:0;border:1px solid #aaa;border-radius:50%;width:19px;height:19px;font-size:11px;color:transparent}
.choice input:checked+.box .check{background:#111;border-color:#111;color:#fff}
.address{font-size:12px;line-height:1.7;color:#666;display:block}
.office-benefits{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:12px}.availability{display:flex;gap:7px;align-items:center;font-size:11px;color:#333}
.primary{display:block;width:100%;border:1px solid #111;background:#111;color:#fff;padding:17px 24px;cursor:pointer;font-weight:500;border-radius:0}
.primary:disabled{background:#eee;border-color:#eee;color:#888;cursor:default}
.primary:hover:not(:disabled){background:#333}
.error{font-size:12px;color:#555;margin:18px 0 0}
.back{border:0;background:none;color:#222;padding:8px 0;cursor:pointer;text-decoration:underline;font-size:13px}
button:focus-visible,a:focus-visible{outline:3px solid #777;outline-offset:4px}
@media(max-width:600px){header{height:74px}header img{width:140px}main{margin:20px auto 35px;padding:0 18px}.entry{padding:22px 16px;box-shadow:none}legend{font-size:16px;margin-bottom:17px}legend>span{margin-right:7px}.bags{gap:10px}.bags .box{font-size:13px}.offices .box{padding:17px}.offices input:checked+.box{padding:16px}.office-name{font-size:16px}.office-name>span:first-child{gap:8px}.address{font-size:11px}fieldset{margin-bottom:25px}}

#office-map{height:230px;border-radius:4px;overflow:hidden;background:#f4f4f4;margin-bottom:16px}
.office-pin{position:relative;background:white;border:1px solid #aaa;box-shadow:0 2px 8px #0002;border-radius:20px;padding:8px 13px;font:500 12px Montserrat,Arial,sans-serif;display:flex;justify-content:center;align-items:center;white-space:nowrap;cursor:pointer}
.office-pin.chosen{background:#111;color:white;border-color:#111}
.pin-check{display:none;position:absolute;top:-8px;right:-6px;width:23px;height:23px;border:2px solid #fff;border-radius:50%;background:#111;color:#fff;place-items:center;box-shadow:0 1px 4px #0003;pointer-events:none}
.office-pin.chosen .pin-check{display:grid}
.preview-map .leaflet-tile-pane{filter:grayscale(1)}.preview-map .leaflet-control-attribution{font-size:9px}
.map-fallback{height:100%;display:grid;place-content:center;padding:18px;text-align:center;font-size:12px;color:#666}
@media(max-width:600px){#office-map{height:210px}.office-pin{font-size:11px;padding:7px 10px}}
