/* Visual pauses and progressive detail in the editorial middle chapters. */
.collection-photo { aspect-ratio: 2.8 / 1; margin-bottom: 2.5rem; }
.collection-photo img { object-position: center 59%; }
.knowledge .heading-row > p { color: #cbd9e3; }
.knowledge-points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-items: start; }
.knowledge-point { background: #12385d; border: 1px solid #ffffff26; }
.knowledge-point:nth-child(2), .knowledge-point:nth-child(3) { background: #0b2948; }
.knowledge-point[open] { background: var(--paper); color: var(--ink); }
.knowledge-point summary, .dish-item summary, .heritage-detail summary, .era-card summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 1.2rem; }
.knowledge-point summary::-webkit-details-marker, .dish-item summary::-webkit-details-marker, .heritage-detail summary::-webkit-details-marker, .era-card summary::-webkit-details-marker { display: none; }
.knowledge-point summary { padding: 1.8rem; min-height: 150px; }
.point-number { font: clamp(3rem, 5vw, 4.6rem)/1 var(--serif); color: #acc3d4; flex: none; }
.knowledge-point[open] .point-number { color: #698496; }
.knowledge-point h3 { font-size: clamp(1.3rem, 2.1vw, 1.8rem); line-height: 1.55; flex: 1; min-width: 0; }
.expand-mark { display: inline-flex; align-items: center; justify-content: center; width: 1.8rem; height: 1.8rem; border: 1px solid currentColor; border-radius: 50%; flex: none; font: 1.3rem/1 Arial, sans-serif; opacity: .7; }
.expand-mark::before { content: '+'; }
details[open] > summary .expand-mark::before { content: '−'; }
.point-body { padding: 0 1.8rem 1.8rem; }
.point-body p, .point-body .source-link { color: var(--muted); }
.dish-menu { border-top: 1px solid var(--line); }
.dish-item { border-bottom: 1px solid var(--line); }
.dish-item summary { padding: 1.4rem 0; min-height: 88px; }
.dish-item h3 { font-size: 1.4rem; line-height: 1.5; flex: 1; }
.dish-item .ordinal { font-size: 1.5rem; }
.dish-item p { padding: 0 0 1.5rem 3rem; color: var(--muted); }
.dish-item[open] summary { color: var(--ink2); }
.dashi-visual { padding: 2.5rem; margin-top: 4rem; background: var(--mist); }
.dashi-visual h3 { font-size: 2rem; line-height: 1.5; flex: 1; }
.dashi-visual .heading-row { gap: 2.5rem; margin-bottom: 2rem; }
.dashi-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; list-style: none; margin: 0; padding: 0; }
.dashi-steps li { position: relative; border-top: 2px solid #7893a4; padding-top: 1rem; }
.dashi-steps li:not(:last-child)::after { content: '→'; position: absolute; inset-inline-end: -1.6rem; top: 1.3rem; font-size: 1.5rem; color: #627f91; }
.step-number { display: block; font: 3.8rem/1.2 var(--serif); color: #476980; margin-bottom: 1rem; }
.dashi-steps p { font-size: 1.125rem; line-height: 1.75; }
.dashi-visual .source-link { color: var(--muted); }
.history { background: var(--paper); padding-top: 1rem; }
.heritage-feature { display: grid; grid-template-columns: 1.15fr 1fr; gap: 6%; align-items: center; padding-block: 1rem 3rem; }
.heritage-art { aspect-ratio: 1; display: flex; align-items: center; }
.heritage-art img { object-fit: contain; width: 100%; height: 100%; mix-blend-mode: multiply; }
.heritage-copy { min-width: 0; }
.heritage-copy .history-heading { margin-bottom: .5rem; }
.heritage-year { font: clamp(6rem, 12vw, 10rem)/1 var(--serif); letter-spacing: -.07em; color: #294f6d; margin: 1.2rem 0 1.7rem; }
.heritage-detail { border-top: 1px solid var(--line); }
.heritage-detail summary { min-height: 64px; padding-block: 1rem; }
.heritage-detail h4 { font-size: 1.15rem; line-height: 1.65; flex: 1; }
.heritage-detail p { padding-bottom: 1.3rem; color: var(--muted); }
.japan-timeline { padding: 2.5rem; background: var(--ink); color: var(--paper); }
.era-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; align-items: start; }
.era-card { position: relative; border-top: 1px solid #87a4ba; padding-top: 1.25rem; }
.era-card::before { content: ''; position: absolute; top: -5px; inset-inline-start: 0; width: 9px; height: 9px; background: #cfbd97; border-radius: 50%; }
.era-card summary { align-items: flex-start; flex-wrap: wrap; gap: .7rem; }
.era-number { color: #b8cdda; font: 2.5rem/1.2 var(--serif); width: 100%; }
.era-card h4 { flex: 1; font-size: 1.2rem; line-height: 1.65; }
.era-card p { color: #d0dde6; margin-top: 1rem; }
.history .japan-timeline .source-link { color: #c1d3df; margin-top: 1.5rem; }
.history-note { line-height: 1.8; }
html[dir='rtl'] .dish-item p { padding-right: 3rem; padding-left: 0; }
html[dir='rtl'] .dashi-steps li:not(:last-child)::after { content: '←'; }
@media (max-width: 1000px) {
 .knowledge-point summary { padding: 1.3rem; gap: 1rem; }
 .point-number { font-size: 3rem; }
 .point-body { padding: 0 1.3rem 1.3rem; }
 .serving-layout { grid-template-columns: 1fr 1fr; }
 .dish-item h3 { font-size: 1.25rem; }
}
@media (max-width: 760px) {
 .collection-photo { aspect-ratio: 1.4; margin-bottom: 1.8rem; }
 .knowledge-points { grid-template-columns: 1fr; gap: .8rem; }
 .knowledge-point summary { min-height: 105px; }
 .knowledge-point h3 { font-size: 1.3rem; }
 .serving-layout, .heritage-feature { grid-template-columns: 1fr; gap: 1.8rem; }
 .serving-photo { aspect-ratio: 1.15; }
 .dish-item summary { padding-block: 1.1rem; min-height: 74px; }
 .dashi-visual { margin-top: 2.5rem; padding: 1.5rem; }
 .dashi-visual h3 { font-size: 1.6rem; }
 .dashi-steps { grid-template-columns: 1fr; gap: 1.25rem; }
 .dashi-steps li { display: grid; grid-template-columns: 3.8rem 1fr; gap: 1rem; align-items: center; padding-top: 1.25rem; }
 .step-number { font-size: 2.8rem; margin: 0; }
 .dashi-steps p { font-size: 1rem; }
 .dashi-steps li:not(:last-child)::after { display: none; }
 .heritage-feature { padding-bottom: 2rem; }
 .heritage-art { aspect-ratio: 1.5; }
 .heritage-year { font-size: 6.5rem; }
 .japan-timeline { padding: 1.7rem; }
 .era-grid { grid-template-columns: 1fr; gap: 1.5rem; }
 .era-card summary { flex-wrap: nowrap; }
 .era-number { width: auto; flex: none; font-size: 1.8rem; }
 .era-card h4 { font-size: 1.05rem; }
}
@media print {
 .knowledge-point, .japan-timeline { background: white; color: black; }
 .knowledge-point .point-body, .dish-item > p, .heritage-detail > p, .era-card > p { display: block !important; }
 .expand-mark { display: none; }
}