.monthly-compass{padding:clamp(3rem,8vw,7rem) max(5vw,calc((100vw - 1180px)/2));background:#efe8d8;color:#0a352d;border-block:1px solid rgba(145,111,48,.28)}.monthly-compass__heading{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(16rem,.7fr);gap:2rem;align-items:end}.monthly-compass__heading h2{font:500 clamp(2.25rem,5vw,4.8rem)/1.08 var(--serif);margin:.5rem 0}.monthly-compass__heading>p:last-child{font-size:1.05rem;line-height:1.9}.monthly-compass__metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(145,111,48,.34);border:1px solid rgba(145,111,48,.34);margin:3rem 0}.monthly-compass__metrics article{display:grid;gap:.35rem;background:#f8f2e6;padding:1.5rem}.monthly-compass__metrics strong{font:500 clamp(2.3rem,5vw,4rem)/1 var(--serif);color:#b14d3e}.monthly-compass__metrics span{letter-spacing:.08em}.monthly-compass__chapters,.monthly-compass__milestones,.monthly-compass__reminder{margin-top:3rem}.monthly-compass__month{color:#b14d3e;font-weight:700;letter-spacing:.12em}.monthly-compass__chapters>div{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.monthly-compass__chapters article{min-height:11rem;padding:1.4rem;border:1px solid rgba(145,111,48,.42);background:#f8f2e6;display:flex;flex-direction:column;justify-content:space-between}.monthly-compass__chapters h4{font:500 1.45rem/1.4 var(--serif);margin:0}.monthly-compass__chapters a{color:#0a352d;font-weight:700}.monthly-compass__milestones>div{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem}.monthly-compass__milestones article{display:grid;gap:.3rem;padding:1rem;border-top:3px solid #aa9d83;background:rgba(255,255,255,.42)}.monthly-compass__milestones article.is-achieved{border-color:#b14d3e}.monthly-compass__milestones span{color:#b14d3e}.monthly-compass__milestones small{color:#65756e}.monthly-compass__reminder{padding:1.5rem;border:1px solid rgba(145,111,48,.42);background:#0a352d;color:#f8f2e6}.monthly-compass__reminder input{min-height:3rem;padding:.6rem;margin:.5rem .75rem .5rem 0}.monthly-compass__reminder button{margin:.35rem .5rem .35rem 0}@media(max-width:760px){.monthly-compass__heading{grid-template-columns:1fr}.monthly-compass__chapters>div,.monthly-compass__milestones>div{grid-template-columns:1fr}.monthly-compass__metrics{grid-template-columns:repeat(3,1fr)}.monthly-compass__metrics article{padding:1rem}.monthly-compass__metrics strong{font-size:2.1rem}}