:root{--ink:#383238;--line:#d9d9d9;--closed:#fbe1e6;--event:#f8e1cc;--shop:#dce9f8;--knit:#e9e0f5;--workshop:#d8efe4}
*{box-sizing:border-box}
body{margin:0;background:#fff;color:var(--ink);font-family:Futura,"Futura PT","Century Gothic","Avenir Next","Yu Gothic","Hiragino Kaku Gothic ProN",sans-serif;font-weight:300}
main{width:min(100%,980px);min-height:100vh;margin:auto;padding:clamp(28px,6vw,72px) clamp(18px,5vw,64px) 40px}
.site-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:30px}
.site-heading>div{width:clamp(112px,17vw,142px)}
.site-heading p{margin:0;font-size:10px;letter-spacing:.2em}
.site-heading .shop-title{letter-spacing:.34em;word-spacing:0;white-space:nowrap}
.site-heading h1{margin:5px 0 0;font-size:clamp(16px,2.5vw,22px);font-weight:300;line-height:1;letter-spacing:.14em}
.site-heading .shop-hours{text-align:right;font-size:10px;line-height:1.8;letter-spacing:.12em}
.irregular-holiday{color:#c85a62}
.months{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,4vw,40px)}
.month-card{border:1px solid var(--line);background:#fff;padding:clamp(15px,3vw,28px)}
.month-heading{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid var(--line);padding-bottom:12px}
.month-heading span{font-size:11px;letter-spacing:.15em}
.month-heading h2{margin:0;font-weight:500;font-size:clamp(40px,6vw,56px);line-height:.8;letter-spacing:.08em}
.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);text-align:center}
.weekdays{padding:15px 0 9px;font-size:8px;font-weight:500;letter-spacing:.05em;opacity:.55}
.dates{row-gap:7px}
.dates span{display:grid;place-items:center;justify-self:center;width:76%;max-width:34px;aspect-ratio:1;font-size:clamp(11px,2vw,14px);border-radius:50%}
.dates .closed{background:var(--closed);font-weight:500}
.dates .event{background:var(--event);font-weight:500}
.dates .shop{background:var(--shop);font-weight:500}
.dates .knit{background:var(--knit);font-weight:500}
.dates .workshop{background:var(--workshop);font-weight:500}
footer{border-bottom:1px solid var(--line);margin-top:30px;padding-bottom:18px;font-size:11px}
.legends{display:flex;flex-wrap:wrap;gap:12px 22px;align-items:center}
.legend{display:flex;align-items:center;gap:8px;font-weight:500;white-space:nowrap}
.legend i{width:12px;height:12px;border-radius:50%}
.legend.closed i{background:var(--closed)}
.legend.event i{background:var(--event)}
.legend.shop i{background:var(--shop)}
.legend.knit i{background:var(--knit)}
.legend.workshop i{background:var(--workshop)}

@media(max-width:640px){.months{grid-template-columns:1fr}
.month-card{padding:18px}
.month-heading h2{font-size:46px}
.dates span{font-size:13px}
}