*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--leaf:#2d5a27;--light:#e8f0e4;--gold:#8b7355;--font-min:'Shippori Mincho',serif;--font:'Noto Sans JP',sans-serif}
body{font-family:var(--font);background:var(--light);color:#1a2e18}
img{max-width:100%;display:block;object-fit:cover}
a{color:var(--leaf)}
.step-nav{position:fixed;right:1rem;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:.5rem;z-index:10}
.step-nav a{text-decoration:none;color:var(--leaf);font-size:.85rem;padding:.4rem .8rem;background:#fff;border-radius:4px;writing-mode:vertical-rl}
.step-nav a.active{background:var(--leaf);color:#fff}
.tea-hero{padding:4rem 2rem 2rem;text-align:center;background:linear-gradient(180deg,#fff 0%,var(--light) 100%)}
.tea-hero h1{font-family:var(--font-min);font-size:2.5rem;color:var(--leaf)}
.tea-hero p{font-family:var(--font-min);font-size:1.3rem;margin-top:.5rem;line-height:1.5}
.timeline-shop{max-width:800px;margin:0 auto;padding:2rem 3rem 2rem 1.5rem;border-left:4px solid var(--leaf)}
.step-row{display:grid;grid-template-columns:60px 1fr 1fr;gap:1.5rem;align-items:center;margin-bottom:4rem;position:relative}
.step-row::before{content:'';position:absolute;left:-1.65rem;top:0;width:16px;height:16px;background:var(--leaf);border-radius:50%;border:3px solid var(--light)}
.step-row.reverse{direction:rtl}
.step-row.reverse > *{direction:ltr}
.step-num{font-family:var(--font-min);font-size:2rem;color:var(--gold);font-weight:600}
.step-row img{border-radius:8px;aspect-ratio:4/3}
.step-body h2{font-family:var(--font-min);font-size:1.2rem;margin-bottom:.5rem}
.step-body button{background:var(--leaf);color:#fff;border:none;padding:.6rem 1.5rem;margin-top:.75rem;cursor:pointer;border-radius:2px}
.legal-tea{padding:2rem;font-size:.88rem;max-width:700px;margin:0 auto 3rem}
.legal-tea h3,.legal-tea h4{color:var(--leaf);margin-top:1rem}
@media(max-width:700px){
  .step-nav{position:static;transform:none;flex-direction:row;flex-wrap:wrap;justify-content:center;padding:1rem;writing-mode:horizontal-tb}
  .step-nav a{writing-mode:horizontal-tb}
  .timeline-shop{border-left:none;padding:1rem}
  .step-row{grid-template-columns:1fr;direction:ltr!important}
  .step-row::before{display:none}
}