.visual-stories{border-top:1px solid var(--line);margin-top:70px}.visual-stories>.section-heading{margin-bottom:48px}.visual-stories h2{font-size:clamp(32px,4vw,48px);line-height:1.4}.visual-story-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:70px;align-items:start}.story-stage{position:sticky;top:95px}.story-stage-frame{aspect-ratio:3/2;position:relative;overflow:hidden;background:#e6ecdf;border:1px solid #d1ddc3;border-radius:12px}.story-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.035);transition:opacity .44s ease,transform .8s ease}.story-art.is-current{opacity:1;transform:scale(1)}.art-stamp{position:absolute;bottom:18px;left:18px;background:var(--ink);color:var(--green);padding:6px 12px;border-radius:100px;font:13px/1.5 Georgia}.story-stage-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:18px;font-size:14px}.art-zoom{border:0;background:none;white-space:nowrap;text-decoration:underline;text-underline-offset:4px;padding:8px;font-size:14px}.story-switches{display:flex;gap:8px;margin-top:20px}.story-switches button{border:1px solid #cad6bb;background:transparent;border-radius:100px;padding:9px 14px;font-size:13px;transition:background .25s,color .25s}.story-switches button[aria-pressed=true]{background:var(--ink);color:var(--green);border-color:var(--ink)}.art-credit{font-size:12px;color:var(--muted);line-height:1.8}.story-chapter{min-height:78vh;padding:30px 0 100px;border-bottom:1px solid var(--line);scroll-margin-top:110px}.story-chapter:last-child{padding-bottom:30px;min-height:65vh;border-bottom:0}.story-index{font:13px/1.6 Georgia;letter-spacing:2px;color:#5e773f}.story-chapter h3{font-size:32px;line-height:1.5;letter-spacing:-.5px;margin:25px 0}.story-chapter>p{font-size:17px;line-height:2;color:#4e5948}.story-idea{padding:20px 23px;background:#e9f0df;border-left:3px solid #a5c87a;border-radius:0 9px 9px 0;margin:25px 0}.story-idea strong{display:block;font-size:13px;color:#547637;letter-spacing:1px;margin-bottom:7px}.story-chapter details{padding:18px 0}.story-chapter details p{font-size:16px}.story-source{display:inline-block;font-size:14px;text-decoration:underline;text-underline-offset:5px;margin-top:22px}.story-mobile-art{display:none}.scroll-enter{animation:scrollEnter .48s cubic-bezier(.18,.65,.3,1) both}@keyframes scrollEnter{from{opacity:.65;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.motion-toggle{position:fixed;left:18px;bottom:20px;z-index:21;border:1px solid #cad6bd;background:#f7f9f1ee;border-radius:100px;padding:11px 15px;font-size:12px;color:#526442;backdrop-filter:blur(10px)}.motion-toggle[aria-pressed=true]{background:var(--ink);color:var(--green)}.image-dialog{max-width:min(1100px,94vw);width:94vw;border:1px solid #b6c69f;padding:18px;border-radius:14px;background:var(--paper);color:var(--ink);max-height:92vh;box-shadow:0 30px 100px #0005}.image-dialog::backdrop{background:#121b12bd;backdrop-filter:blur(8px)}.image-dialog img{display:block;width:100%;max-height:72vh;object-fit:contain}.dialog-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;gap:20px}.dialog-top h2{font-size:18px;margin:0}.dialog-top button{border:1px solid #bccbab;background:none;border-radius:100px;padding:8px 16px;font:inherit;font-size:14px}.image-dialog p{font-size:13px;color:var(--muted);margin:10px 0 0}.case-illustrated{margin:0 0 30px}.case-illustrated img{width:100%;height:240px;object-fit:cover;border-radius:12px;display:block}.case-illustrated figcaption{font-size:13px;color:var(--muted);line-height:1.8;margin-top:10px}.large-text .story-chapter>p{font-size:20px}.motion-off *,.motion-off *::before,.motion-off *::after{animation:none!important;transition:none!important}.motion-off{scroll-behavior:auto!important}@media(max-width:1000px){.visual-story-layout{gap:32px}.story-chapter h3{font-size:28px}.story-stage{top:85px}.story-stage-footer{align-items:flex-start;flex-direction:column;gap:0}.story-switches{flex-wrap:wrap;gap:6px}.story-switches button{padding:8px 11px}.motion-toggle{bottom:21px}}@media(max-width:800px),(max-height:620px){.visual-stories{margin-top:45px}.visual-stories>.section-heading{margin-bottom:24px}.visual-story-layout{display:block}.story-stage{display:none}.story-chapter,.story-chapter:last-child{min-height:0;padding:25px 0 40px}.story-mobile-art{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:10px;margin:18px 0 25px}.story-chapter h3{font-size:28px;margin:20px 0}.story-chapter>p{font-size:16px}.story-chapter h3 br{display:none}.motion-toggle{left:12px;bottom:16px;padding:10px 12px}.case-illustrated img{height:200px}.image-dialog{padding:12px}.image-dialog img{max-height:65vh}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.story-art,.scroll-enter{transition:none!important;animation:none!important;transform:none}.motion-toggle{display:none}}
/* Reading rhythm and shared art controls. */
.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:18px 26px}
.case-heading h1,.story-chapter h3{text-wrap:balance}
.visual-entry{display:inline-flex;align-items:center;gap:15px;padding:12px 0;font-size:14px;text-decoration:underline;text-underline-offset:6px}
.visual-entry span{color:#66883d}
.visual-stories>.section-heading{margin-bottom:18px}
.visual-stories>.art-credit{margin:0 0 36px;max-width:48em}
.story-stage{top:90px}
.story-stage-frame{box-shadow:0 14px 35px #34412612}
.story-stage-footer{border-bottom:1px solid var(--line);padding-bottom:12px;min-height:64px}
.story-switches{gap:8px}
.story-switches button{min-height:44px;flex:1;padding:9px 10px}
.story-index{display:inline-flex;align-items:center;gap:10px;letter-spacing:1.6px}
.story-index:before{content:'';width:7px;height:7px;border-radius:50%;background:#bdc8ae;transition:background .3s}
.is-reading .story-index:before{background:#52772c;box-shadow:0 0 0 5px #dfeacb}
.story-chapter{padding-top:34px;padding-bottom:80px}
.story-chapter>p{max-width:31em}
.story-chapter h3{font-size:clamp(26px,2.55vw,35px);font-weight:650;line-height:1.55}
.story-chapter details{border-top:1px solid var(--line);border-bottom:0;padding:18px 0 0}
.story-chapter details p{line-height:1.9;margin-top:14px}
.story-chapter summary{font-size:15px;align-items:center;min-height:32px}
.story-source{font-size:13px;line-height:1.8;padding:8px 0}
.art-zoom,.mobile-art-zoom,.dialog-top button,.motion-toggle{min-height:44px}
.mobile-art-zoom{display:none}
.art-open{overflow:hidden;scrollbar-gutter:stable}
.image-dialog{overscroll-behavior:contain}
.image-dialog[open]{animation:artDialogIn .18s ease-out}
@keyframes artDialogIn{from{opacity:.65;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.case-illustrated img{height:auto;aspect-ratio:3/2;object-fit:contain}
.review-date{color:#596b48;font-size:12px;letter-spacing:.5px;margin:22px 0 12px}
.large-text .story-chapter>p,.large-text .story-chapter details p,.large-text .case-example{font-size:20px!important}
.reading-tools button{min-width:44px;min-height:44px}
.source-list li{scroll-margin-top:20px}
@media(min-width:801px) and (min-height:621px){
  .story-stage-frame{max-height:calc(100svh - 280px)}
  .story-art{object-fit:contain}
  .visual-story-layout{gap:clamp(30px,5vw,70px)}
}
@media(max-width:800px),(max-height:620px){
  .visual-stories>.art-credit{margin-bottom:20px}
  .mobile-art-zoom{display:block;margin:-15px 0 18px;padding:5px 0;background:none;border:0;font-size:13px;text-decoration:underline;text-underline-offset:5px}
  .story-chapter h3{font-size:28px;line-height:1.55}
  .story-chapter,.story-chapter:last-child{padding-bottom:42px}
  .story-mobile-art{margin-top:22px}
}
@media(max-width:700px){
  .case-heading h1{font-size:30px;line-height:1.55}
  .hero-actions{gap:8px 22px}
  .visual-entry{font-size:13px}
  .motion-toggle{bottom:max(16px,env(safe-area-inset-bottom));left:12px}
  .reading-tools{bottom:max(12px,env(safe-area-inset-bottom))}
  .step-navigation{flex-wrap:wrap}
  .case-footer{padding-bottom:110px}
}
@media(max-width:360px){
  .reading-tools output{display:none}
  .hero-copy .eyebrow{flex-wrap:wrap}
  .brand-en{margin-left:0}
}