/* =========================================================
   つきじ治作 — history ページ固有スタイル（抽出元: history/index.html の <style>）
   body名前空間: page-history / url(): css/pages/基準 ../../images/
   ========================================================= */
/* Unified dark navy — match top page palette */
:root{
  --ink:#1a2638;
  --ink-2:#1a2638;
}
html, body, body.is-day{
  background-color:#1a2638 !important;
  color:var(--mute);
}
.header.is-scrolled{background:rgba(26,38,56,.85);}

.sp-hero{position:relative;height:480px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:48px;overflow:hidden;background:#1a2638;}
.sp-hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5;}
.sp-hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(26,38,56,.2) 0%,rgba(26,38,56,.88) 100%);}
.sp-hero__title{position:relative;z-index:2;text-align:center;}
.sp-hero__title h1{font-family:var(--serif-display);font-size:clamp(24px,3vw,36px);font-weight:500;letter-spacing:.2em;color:var(--mute);margin:0 0 8px;}
.sp-hero__title .en{font-family:var(--en-serif);font-size:clamp(11px,1.2vw,14px);letter-spacing:.35em;text-transform:uppercase;color:var(--gold);font-style:italic;}
.sp-breadcrumb{padding:16px clamp(24px,8vw,120px);font-family:var(--serif);font-size:11px;letter-spacing:.15em;color:rgba(232,226,212,.4);}
.sp-breadcrumb a{color:rgba(232,226,212,.4);text-decoration:none;transition:color .3s;}
.sp-breadcrumb a:hover{color:var(--gold);}
.sp-breadcrumb span{margin:0 8px;}
.sp-content{max-width:1440px;margin:0 auto;padding:60px clamp(24px,8vw,120px) 100px;}
.sp-content h2{font-family:var(--serif-display);font-size:clamp(18px,2vw,24px);font-weight:500;letter-spacing:.15em;color:var(--mute);margin:56px 0 24px;padding-bottom:12px;border-bottom:.5px solid rgba(216,184,122,.25);}
.sp-content h2:first-child{margin-top:0;}
.sp-content h3{font-family:var(--serif);font-size:clamp(14px,1.5vw,18px);font-weight:500;letter-spacing:.12em;color:var(--mute);margin:40px 0 16px;}
.sp-content p{font-family:var(--serif);font-size:14px;line-height:2.2;letter-spacing:.06em;color:rgba(232,226,212,.7);margin:0 0 20px;}

/* Section images */
.sp-content img{max-width:100%;display:block;}
.section-img{width:100%;aspect-ratio:16/7;object-fit:cover;margin:0 0 32px;opacity:.9;}
.section-duo{display:grid;grid-template-columns:auto 1fr;gap:24px;margin:0 0 32px;align-items:start;}
.section-duo img{height:clamp(300px,34vw,460px);object-fit:cover;display:block;}
.section-duo img:first-child{width:auto;max-width:100%;}
.section-duo img:last-child{width:100%;}
@media(max-width:640px){
  .section-duo{grid-template-columns:1fr;}
  .section-duo img{width:100%;height:auto;}
}

/* Timeline */
.timeline{position:relative;padding-left:40px;margin:0 0 48px;}
.timeline::before{content:"";position:absolute;left:8px;top:8px;bottom:8px;width:.5px;background:rgba(216,184,122,.2);}
.timeline__item{position:relative;padding:0 0 40px;}
.timeline__item:last-child{padding-bottom:0;}
.timeline__item::before{content:"";position:absolute;left:-36px;top:8px;width:9px;height:9px;border:.5px solid var(--gold);background:#1a2638;border-radius:50%;}
.timeline__year{font-family:var(--en-serif);font-size:clamp(12px,1.3vw,15px);letter-spacing:.2em;color:var(--gold);font-style:italic;margin:0 0 4px;}
.timeline__era{font-family:var(--serif);font-size:11px;letter-spacing:.15em;color:rgba(232,226,212,.4);margin-left:8px;}
.timeline__title{font-family:var(--serif);font-size:clamp(14px,1.5vw,17px);font-weight:500;letter-spacing:.1em;color:var(--mute);margin:8px 0 12px;line-height:1.8;}
.timeline__text{font-family:var(--serif);font-size:13px;line-height:2.2;letter-spacing:.06em;color:rgba(232,226,212,.6);}

/* ---------- Brand intro (above timeline) ---------- */
.ji-intro{padding:0 0 clamp(64px,8vh,96px);}
.ji-intro__inner{max-width:1120px;margin:0 auto;}

.ji-intro__head{text-align:center;margin:0 auto 72px;}
.ji-intro__en{
  font-family:var(--en-serif);font-style:italic;
  font-size:11px;letter-spacing:.35em;text-transform:uppercase;
  color:var(--gold);
}
.sp-content .ji-intro__h{
  font-family:var(--serif-display);font-weight:500;
  font-size:clamp(22px,2.6vw,32px);letter-spacing:.22em;
  line-height:1.7;color:var(--mute);
  margin:18px 0 0;padding:0;
  border:none;
}
.sp-content .ji-intro__lead{
  margin:28px auto 0;max-width:44em;
  word-break:auto-phrase;
  font-family:var(--serif);
  font-size:14px;line-height:2.1;letter-spacing:.1em;
  color:rgba(232,226,212,.78);
  text-align:center;
}

.ji-intro__features{
  list-style:none;padding:0;margin:0;
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:40px 32px;
}
@media(max-width:900px){.ji-intro__features{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.ji-intro__features{grid-template-columns:1fr;gap:32px;}}

.ji-feature{
  display:flex;flex-direction:column;
  padding:32px 4px 0;
  border-top:.5px solid rgba(216,184,122,.35);
}
.ji-feature__meta{
  display:flex;align-items:center;gap:14px;
  margin:0 0 14px;
}
.ji-feature__num{
  font-family:var(--en-body);font-style:italic;font-weight:500;
  font-size:13px;letter-spacing:.06em;color:var(--gold);
}
.ji-feature__en{
  font-family:var(--en-serif);font-style:italic;
  font-size:11px;letter-spacing:.3em;text-transform:uppercase;
  color:rgba(232,226,212,.5);
  position:relative;padding-left:18px;
}
.ji-feature__en::before{
  content:"";position:absolute;left:0;top:50%;
  width:10px;height:.5px;background:rgba(216,184,122,.5);
}
.sp-content .ji-feature__title{
  font-family:var(--serif-display);font-weight:500;
  font-size:clamp(15px,1.5vw,18px);letter-spacing:.15em;line-height:1.7;
  color:var(--mute);margin:0 0 12px;
}
.sp-content .ji-feature__text{
  font-family:var(--serif);
  font-size:13px;line-height:2.05;letter-spacing:.06em;
  color:rgba(232,226,212,.62);margin:0;
}

/* 「江戸の料亭文化」「栄枯盛衰そして現在」セクションの画像は非表示 */
.section-img{display:none !important;}