html{scroll-padding-top:95px}.projects{padding:2rem 2.4vw 4rem}.projects .section-heading--line{display:block;padding-bottom:1.5rem}.projects .section-heading h1{margin:.65rem 0 0;font-size:clamp(2rem,3.5vw,3.2rem);line-height:1.15}.project-group{padding-top:2.5rem}.period{font-size:clamp(2.5rem,4vw,4.5rem);line-height:1.1}.project-open strong{font-size:clamp(1.5rem,2vw,2.1rem);line-height:1.25;letter-spacing:-.02em}.project-dialog .dialog-copy h2{line-height:1.15}.site-head nav a.active{background:var(--acid);color:#111}.site-head nav a.active::after{display:none}@media(max-width:700px){.projects{padding-inline:1rem}.project-tools{top:63px}.project-group{gap:1.2rem}.project-grid{gap:2rem}.period{font-size:2.5rem}}

.project-grid--three{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem;padding-top:2rem}
.project-grid--three .card-image img,.project-grid--three .card-image--type{aspect-ratio:1.34/1}
.card-image--type{display:flex;align-items:center;justify-content:center;padding:1.5rem;color:#111;background:#d9ff37}
.card-image--type>span{font-size:clamp(2.5rem,3vw,3.5rem);font-weight:900;line-height:1.05;letter-spacing:-.05em}
.card-image--tea{background:#d9c7ef;color:#221b38}
.card-image--tea>span{font-size:clamp(3rem,4vw,4.5rem);line-height:1.08;text-align:center}
.card-slogan{display:block;margin-top:.7rem;color:var(--muted);font-size:.88rem;line-height:1.5}
.card-note{display:block;margin-top:.7rem;color:var(--muted);font-size:.88rem;line-height:1.5}
.hello-dot{color:#ef382b;font-size:.5em;vertical-align:middle}
.dialog-image .dialog-type-cover{display:flex;align-items:center;justify-content:center;min-height:100%;padding:2rem;background:#d9ff37;font-size:clamp(2.5rem,5vw,5rem);font-weight:900;line-height:1.1}
.dialog-image .dialog-type-cover--tea{background:#d9c7ef;color:#221b38}
.dialog-image .dialog-type-cover[hidden],.dialog-image img[hidden]{display:none}
.project-dialog .dialog-en[hidden],.project-dialog .dialog-slogan[hidden],.project-dialog .dialog-link[hidden]{display:none}
.project-dialog .dialog-slogan{margin:.8rem 0 1.1rem;font-size:1.1rem;font-weight:700;line-height:1.55}
.project-dialog .dialog-link{align-self:flex-start;margin-top:1.3rem;padding-bottom:.2rem;border-bottom:1px solid currentColor;color:#5040cd;font-weight:700;text-decoration:none}
.project-dialog .dialog-link:hover,.project-dialog .dialog-link:focus-visible{color:#ec392d}
.project-dialog--longform[open]{grid-template-columns:minmax(280px,.8fr) minmax(0,1.45fr)}
.project-dialog--longform .dialog-copy{justify-content:flex-start;max-height:calc(100vh - 2rem);overflow-y:auto;padding:2.4rem 3rem 3rem}
.project-dialog--longform .dialog-copy h2{font-size:clamp(2.7rem,4.8vw,5rem)}
.dialog-description{font-size:1rem;line-height:1.78}
.dialog-description p{margin:0 0 1.15rem}
.dialog-description p:last-child{margin-bottom:0}
.dialog-outcome{display:grid;grid-template-columns:6rem 1fr;gap:1rem;margin-top:1.8rem!important;padding-top:1.1rem;border-top:3px solid var(--ink)}
.dialog-outcome strong{font-size:.8rem;letter-spacing:.08em}
.dialog-outcome span{font-weight:700}
.dialog-booklets{margin:2rem 0 0;padding:1rem 0 0;border-top:1px solid #999}
.dialog-booklets img{display:block;width:100%;background:#fff}
.dialog-booklets figcaption{margin-top:.55rem;color:var(--muted);font-size:.75rem;letter-spacing:.06em}
@media(max-width:900px){.project-grid--three{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.project-grid--three{grid-template-columns:1fr;gap:2rem}.project-dialog--longform[open]{display:block}.project-dialog--longform .dialog-image{height:34vh}.project-dialog--longform .dialog-image img{width:100%;height:100%;min-height:0}.project-dialog--longform .dialog-copy{max-height:none;padding:1.6rem}.dialog-outcome{grid-template-columns:1fr;gap:.45rem}}
