:root{
    --bg:#f6f2ea;
    --bg-alt:#efe9dd;
    --ink:#2c2823;
    --ink-soft:#5c554b;
    --line:#d8cfbf;
    --accent:#7c2f39;      /* muted plum */
    --accent-soft:#a86a72;
    --maxw:920px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--bg);
    color:var(--ink);
    font-family:"Noto Serif JP","Cormorant Garamond",serif;
    font-weight:400;
    line-height:2!important;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;}

  /* ---- Header ---- */
  header.site{
    position:sticky;top:0;z-index:50;
    background:rgba(246,242,234,.9);
    backdrop-filter:blur(8px);
    border-bottom:1px solid var(--line);
  }
  .bar{
    max-width:var(--maxw);margin:0 auto;
    display:flex;align-items:center;justify-content:space-between;
    padding:18px 24px;
  }
  .logo{
    font-size:19px;letter-spacing:.18em;font-weight:500;
    text-decoration:none;color:var(--ink);
  }
  .logo small{display:block;font-size:10px;letter-spacing:.35em;color:var(--ink-soft);margin-top:2px;font-family:"Cormorant Garamond",serif;}
  nav.site a{
    text-decoration:none;color:var(--ink-soft);
    font-family:"Cormorant Garamond",serif;
    font-size:14px;letter-spacing:.22em;text-transform:uppercase;
    margin-left:26px;transition:color .25s;
  }
  nav.site a:hover{color:var(--accent);}
  @media(max-width:680px){
    nav.site{display:none;}
    .bar{justify-content:center;}
  }

  /* ---- Hero ---- */
  .hero-story{
    max-width:var(--maxw);margin:0 auto;
    padding:76px 24px 44px;
    text-align:center;
  }
  .eyebrow{
    font-family:"Cormorant Garamond",serif;
    font-size:15px;letter-spacing:.4em;text-transform:uppercase;
    color:var(--accent-soft);margin-bottom:22px;
    display: block;
  }

  .eyebrow::before {content: none;}
  .hero-story h1{
    font-weight:500;font-size:clamp(28px,5vw,44px);
    line-height:1.55;margin:0 0 20px;letter-spacing:.06em;
  }
  .hero-story .sub{color:var(--ink-soft);font-size:15px;letter-spacing:.05em;margin-block-start: 1em;margin-block-end: 1em;}
  .hero-story .sub-en{
    font-family:"Cormorant Garamond",serif;font-style:italic;
    font-size:18px;color:var(--accent-soft);margin-top:10px;letter-spacing:.02em;margin-block-end: 1em;
  }

  /* ---- Spec / data ---- */
  .specs{
    max-width:var(--maxw);margin:0 auto 12px;
    padding:0 24px;
  }
  dl.data{
    display:grid;grid-template-columns:180px 1fr;gap:0;
    border-top:1px solid var(--line);margin:0;
  }
  dl.data dt,dl.data dd{
    border-bottom:1px solid var(--line);
    padding:14px 8px;margin:0;font-size:15px;
  }
  dl.data dt{color:var(--ink-soft);letter-spacing:.08em;font-weight: 400;}
  dl.data dt span{display:block;font-family:"Cormorant Garamond",serif;font-size:12px;letter-spacing:.14em;color:var(--accent-soft);text-transform:uppercase;}
  figure br {display: none;}

  @media(max-width:600px){
    dl.data{grid-template-columns:1fr;}
    dl.data dt{border-bottom:none;padding-bottom:0;}
    dl.data dd{padding-top:4px;}
  }
  /* ---- Content sections ---- */
  main{max-width:var(--maxw);margin:0 auto;padding:0 24px 40px;}
  section.chapter{padding:56px 0;border-top:1px solid var(--line);}
  section.chapter .eyebrow{text-align:left;margin-bottom:10px;}
  section.chapter h2{
    font-weight:500;font-size:clamp(22px,3.4vw,30px);
    letter-spacing:.08em;margin:0 0 8px;line-height: 2;
  }
  section.chapter h2 .en{
    display:block;font-family:"Cormorant Garamond",serif;font-style:italic;
    font-weight:400;font-size:19px;color:var(--accent-soft);letter-spacing:.03em;margin-top:6px;margin-bottom: 0;padding-left: 0;text-transform: inherit;
  }
  .jp{font-size:16px;line-height:2.2;margin:26px 0 0;}
  .en{font-family:"Cormorant Garamond",serif;font-size:17px;line-height:1.9;color:var(--ink-soft);margin:20px 0 0;letter-spacing:.01em;}
  .en::before{
    content:"English"!important;display:block;
    font-size:11px;letter-spacing:.3em;text-transform:uppercase;
    color:var(--accent-soft);margin-bottom:8px;font-style:normal;
    width: auto!important;
    height: auto!important;
    background: none!important;
    position: static!important;
  }
  .note{font-size:13px;color:var(--ink-soft);margin-top:16px;line-height:1.9;}

  figure{margin:34px 0 0;}
  figure img{width:100%;border-radius:2px;}
  figcaption{font-size:12.5px;color:var(--ink-soft);margin-top:9px;letter-spacing:.03em;}
  .ph{
    width:100%;aspect-ratio:16/9;background:var(--bg-alt);
    border:1px solid var(--line);display:flex;align-items:center;justify-content:center;
    color:var(--accent-soft);font-family:"Cormorant Garamond",serif;font-style:italic;font-size:15px;letter-spacing:.12em;
  }

  .source{
    font-size:13px;color:var(--ink-soft);line-height:1.9;
    border-left:2px solid var(--line);padding-left:16px;margin-top:34px;
  }


  /* ---- pager / footer ---- */
  .pager{
    max-width:var(--maxw);margin:0 auto;padding:44px 24px;
    display:flex;justify-content:center;gap:14px;flex-wrap:wrap;
  }
  .pager a{
    text-decoration:none;font-family:"Cormorant Garamond",serif;
    font-size:14px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);
    border:1px solid var(--line);padding:12px 26px;transition:.25s;
  }
  .pager a:hover{border-color:var(--accent-soft);color:var(--accent);}
  .pager a.primary{background:var(--ink);color:var(--bg);border-color:var(--ink);}
  .pager a.primary:hover{background:var(--accent);border-color:var(--accent);color:#fff;}

  footer.site{border-top:1px solid var(--line);text-align:center;padding:44px 24px;color:var(--ink-soft);}
  footer.site .brand{font-size:16px;letter-spacing:.14em;color:var(--ink);margin-bottom:10px;}
  footer.site .small{font-family:"Cormorant Garamond",serif;font-size:13px;letter-spacing:.06em;line-height:1.9;}