:root{
  --bg:#141210;
  --bg-2:#1a1714;
  --bg-3:#221d18;
  --panel:#1f1a16;
  --ink:#e9e3d7;
  --ink-soft:#b3aa99;
  --ink-dim:#7d7468;
  --gold:#b08d4c;
  --gold-soft:#c8a772;
  --gold-deep:#8a6f3c;
  --bamboo:#8c9168;
  --line:rgba(176,141,76,.26);
  --line-soft:rgba(233,227,215,.10);
  --serif: "Shippori Mincho", "Yu Mincho", "游明朝", "Hiragino Mincho ProN", serif;
  --serif-en: "Cormorant Garamond", "Shippori Mincho", serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--serif);
  background:var(--bg);
  color:var(--ink);
  line-height:1.95;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none;transition:color .4s, opacity .4s}

body::before{
  content:"";
  position:fixed;inset:0;
  pointer-events:none;
  z-index:1;
  background:radial-gradient(ellipse 130% 110% at 50% 38%, transparent 42%, rgba(0,0,0,.55) 100%);
}
body::after{
  content:"";
  position:fixed;inset:0;
  pointer-events:none;
  z-index:1;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.035 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  opacity:.5;
  mix-blend-mode:overlay;
}

::selection{background:rgba(176,141,76,.3);color:var(--ink)}

/* ====== Header ====== */
header{
  position:fixed;top:0;left:0;right:0;
  z-index:100;
  padding:1rem 3rem;
  display:flex;justify-content:space-between;align-items:center;
  background:rgba(20,18,16,.7);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid transparent;
  transition:background .5s, backdrop-filter .5s, border-color .5s, padding .5s;
}
header.scrolled{
  background:rgba(20,18,16,.92);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom-color:var(--line);
  padding:.7rem 3rem;
}
.logo{
  display:flex;align-items:center;gap:1.4rem;
  color:var(--ink);
  text-decoration:none;
}
.logo img{
  height: 66px;
  width:auto;
  display:block;
  transition: height .5s;
}
header.scrolled .logo img{
  height: 50px;
}
.logo .en{
  font-family:var(--serif-en);
  font-style:italic;
  font-weight:400;
  font-size:.78rem;
  letter-spacing:.18em;
  color:var(--gold);
  opacity:.85;
  padding-left:1rem;
  border-left:1px solid var(--line);
  line-height:1.4;
}

.main-nav{display:flex;align-items:center;gap:2rem}
.main-nav ul{
  list-style:none;
  display:flex;
  gap:2.4rem;
}
.main-nav a{
  font-family:var(--serif);
  font-size:.86rem;
  font-weight:400;
  letter-spacing:.16em;
  color:var(--ink-soft);
  position:relative;
  padding-bottom:.35rem;
}
.main-nav a::after{
  content:"";position:absolute;left:0;bottom:0;
  width:0;height:1px;
  background:linear-gradient(90deg,var(--gold),var(--gold-soft));
  transition:width .45s cubic-bezier(.6,0,.2,1);
}
.main-nav a:hover, .main-nav a.active{color:var(--ink)}
.main-nav a:hover::after, .main-nav a.active::after{width:100%}

.lang-switch{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.85rem;
  letter-spacing:.14em;
  color:var(--gold);
  border:1px solid var(--line);
  padding:.45rem .9rem;
  transition: color .4s, border-color .4s, background .4s;
}
.lang-switch:hover{
  color:var(--bg);
  background:var(--gold);
  border-color:var(--gold);
}

.ig-link{
  display:inline-flex;
  align-items:center;justify-content:center;
  color:var(--gold);
  padding:.35rem;
  transition: color .35s, transform .35s;
}
.ig-link svg{display:block}
.ig-link:hover{color:var(--gold-soft);transform:translateY(-2px)}
.nav-overlay .ig-link{
  margin-top:1.4rem;
  padding:.6rem;
}
.nav-overlay .ig-link svg{width:28px;height:28px}

.menu-btn{
  display:none;
  background:none;border:none;cursor:pointer;
  font-size:1.8rem;color:var(--gold);
  line-height:1;
  padding:.2rem .4rem;
}

/* ====== Mobile Nav Overlay ====== */
.nav-overlay{
  position:fixed;inset:0;
  background:rgba(20,18,16,.97);
  backdrop-filter:blur(20px);
  z-index:200;
  opacity:0;visibility:hidden;
  transition:opacity .45s, visibility .45s;
  display:flex;align-items:center;justify-content:center;
  flex-direction:column;
}
.nav-overlay.open{opacity:1;visibility:visible}
.nav-overlay nav{text-align:center}
.nav-overlay ul{list-style:none;margin-bottom:2.5rem}
.nav-overlay li{margin:1.2rem 0}
.nav-overlay a{
  font-family:var(--serif);
  font-size:1.3rem;
  letter-spacing:.18em;
  color:var(--ink);
  display:inline-block;
  padding:.4rem 0;
  border-bottom:1px solid transparent;
  transition:border-color .4s, color .4s;
}
.nav-overlay a:hover{color:var(--gold-soft);border-bottom-color:var(--gold)}
.nav-overlay .lang-switch{
  margin-top:1.5rem;
  font-size:.95rem;
}
.close-btn{
  position:absolute;top:1.6rem;right:1.6rem;
  background:none;border:none;cursor:pointer;
  font-size:2.2rem;color:var(--gold);
  line-height:1;
}

/* ====== Hero ====== */
.hero{
  min-height: 78vh;
  max-height: 860px;
  position:relative;
  display:grid;
  grid-template-columns: 1.05fr 1fr;
  align-items:start;
  padding: 13.5rem 0 4rem 0;
  overflow:hidden;
}
.hero-text{
  padding: 0 3rem 0 4.5rem;
  position:relative;
  z-index:3;
}
.hero-eyebrow{
  font-family:var(--serif-en);
  font-style:italic;
  font-weight:400;
  font-size:1.15rem;
  letter-spacing:.2em;
  color:var(--gold);
  margin-bottom:1.7rem;
  display:flex;align-items:center;gap:.95rem;
}
.hero-eyebrow::before{
  content:"";display:inline-block;
  width:48px;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold));
}
.hero h1{
  font-family:var(--serif);
  font-weight:500;
  font-size: clamp(2.2rem, 4vw, 3.6rem);
  line-height:1.36;
  letter-spacing:.05em;
  margin-bottom:2rem;
  color:var(--ink);
  text-shadow:0 2px 30px rgba(0,0,0,.5);
}
.hero h1 .accent{
  background:linear-gradient(180deg,var(--gold-soft),var(--gold-deep));
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  font-weight:600;
}
.hero h1 .small{
  display:block;font-size:.5em;letter-spacing:.2em;
  margin-top:.85rem;color:var(--ink-soft);font-weight:400;
}

.hero-lead{
  font-size:1rem;
  line-height:2.3;
  color:var(--ink-soft);
  max-width: 28em;
  margin-bottom:2.8rem;
}

.hero-meta{
  display:flex;align-items:center;gap:1.5rem;
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.92rem;
  color:var(--gold);
  letter-spacing:.06em;
}
.hero-meta .divider{width:1px;height:26px;background:var(--line)}

.hero-visual{
  position:relative;
  height: 78vh;
  max-height: 760px;
  align-self:stretch;
}
/* トップ写真のスライドショー（ゆっくりクロスフェード） */
.hero-visual img{
  position:absolute; inset:0; z-index:0;
  width:100%;height:100%;
  object-fit:cover;
  object-position: 62% center;
  filter: contrast(1.08) saturate(.9) brightness(.92);
  opacity:0;
  transition:opacity 1.6s ease-in-out;
}
.hero-visual img.is-active{ opacity:1; }
/* 2枚目（庭先で研ぐ）は顔が切れないように少し左寄りで表示 */
.hero-visual img:nth-of-type(2){ object-position: 46% center; }
@media (prefers-reduced-motion: reduce){
  .hero-visual img{ transition:none; }
}
.hero-visual::before{
  content:"";position:absolute;inset:0;z-index:2;
  background:
    radial-gradient(ellipse 80% 70% at 60% 45%, transparent 30%, rgba(20,18,16,.5) 100%),
    linear-gradient(90deg, var(--bg) 0%, rgba(20,18,16,.55) 16%, transparent 42%);
}
.hero-visual::after{
  content:"";position:absolute;inset:0;z-index:2;
  box-shadow:inset 0 0 160px 40px rgba(0,0,0,.6);
}

.vertical-cap{
  position:absolute;
  right:2.8rem; top:50%;
  transform:translateY(-50%);
  writing-mode:vertical-rl;
  font-family:var(--serif);
  font-size:.86rem;
  letter-spacing:.45em;
  color:var(--ink);
  z-index:4;
  font-weight:400;
  text-shadow:0 1px 14px rgba(0,0,0,.9);
}

.scroll-mark{
  display:none !important;
  position:absolute;
  left:1.75rem; bottom:2.4rem;
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.78rem;
  letter-spacing:.32em;
  color:var(--gold);
  display:flex;flex-direction:column;align-items:center;gap:.9rem;
  z-index:3;
}
.scroll-mark::after{
  content:"";width:1px;height:64px;
  background:linear-gradient(180deg,var(--gold),transparent);
  animation: scrollLine 2.6s ease-in-out infinite;
  transform-origin:top;
}
@keyframes scrollLine{
  0%,100%{transform:scaleY(.3);opacity:.3}
  50%{transform:scaleY(1);opacity:1}
}

/* ====== Page Hero (内ページ用の上部) ====== */
.page-hero{
  padding: 16rem 4rem 4rem;
  background: linear-gradient(180deg, var(--bg-2) 0%, var(--bg) 100%);
  border-bottom:1px solid var(--line);
  text-align:center;
  position:relative;
  z-index:2;
}
.page-hero .eyebrow{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.95rem;
  letter-spacing:.3em;
  color:var(--gold);
  margin-bottom:1.2rem;
}
.page-hero h1{
  font-family:var(--serif);
  font-weight:500;
  font-size: clamp(1.9rem, 3.4vw, 2.8rem);
  letter-spacing:.1em;
  line-height:1.5;
  color:var(--ink);
  text-shadow:0 2px 30px rgba(0,0,0,.5);
}
.page-hero .lead{
  max-width: 32em;
  margin: 1.6rem auto 0;
  font-size:.95rem;
  line-height:2.1;
  color:var(--ink-soft);
}

/* ====== Section共通 ====== */
section{position:relative;z-index:2;padding: 6.5rem 4rem}
.section-inner{max-width:1280px;margin:0 auto}
.section-num{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.92rem;
  letter-spacing:.32em;
  color:var(--gold);
  margin-bottom:1.3rem;
  display:flex;align-items:center;gap:.9rem;
}
.section-num::before{
  content:"";width:34px;height:1px;
  background:linear-gradient(90deg,var(--gold),transparent);
}
.section-title{
  font-family:var(--serif);
  font-weight:500;
  font-size: clamp(1.6rem, 2.6vw, 2.2rem);
  letter-spacing:.08em;
  line-height:1.6;
  margin-bottom:3rem;
  color:var(--ink);
}
.section-title .en{
  display:block;
  font-family:var(--serif-en);
  font-style:italic;
  font-weight:400;
  font-size:.46em;
  letter-spacing:.2em;
  color:var(--gold);
  margin-top:.7rem;
  opacity:.9;
}

/* ====== About ====== */
/* 日本語本文の改行を整える
   最優先：行末に1文字だけ残さない／可能なら「、」「。」で改行する */
/* 長い本文：最終行の孤立（1文字だけ）を防ぐ */
.about-text p, .contact-text p, .contact-cta p,
.proc-body p, .map-inner p, .story-text p {
  text-wrap: pretty;
}
/* 短い見出し・リード・キャプション：行を均等にして孤立を防ぐ
   （script.js が句読点に改行候補を追加し、「、」「。」で改行させる） */
.hero-lead, .page-hero .lead, .video-lead, .history-lead,
.footer-brand p, .cert-sub, .proc-sub, .makers figcaption,
.jg-cap, .archive-note, .video-credit, .video-cap {
  text-wrap: balance;
}
/* script.js が付与：句読点でのみ改行させる（はみ出す時はJSが自動解除） */
.jp-kuten-break { word-break: keep-all; line-break: strict; }

.about{
  background: linear-gradient(180deg, var(--bg) 0%, var(--bg-2) 100%);
  padding: 7rem 4rem;
}
.about-text{
  max-width: 40em;
  margin: 0 auto;
  text-align: center;
}
.about-text .section-num{justify-content:center}
.about-text .view-more{margin-top:1rem}
.about-text p{
  font-size:.96rem;
  line-height:2.35;
  margin-bottom:1.5rem;
  color:var(--ink-soft);
}
.about-text p:first-of-type{
  font-size:1.08rem;
  color:var(--ink);
  letter-spacing:.04em;
  line-height:2.15;
}
.about-image{
  position:relative;
  aspect-ratio: 4/4.6;
  max-width: 420px;
  margin: 0 auto;
}
.about-image img{
  width:100%;height:100%;object-fit:cover;
  filter:contrast(1.06) brightness(.9);
  box-shadow:0 30px 70px rgba(0,0,0,.6);
}
.about-image::before{
  content:"";position:absolute;
  top:-22px;left:-22px;right:32px;bottom:32px;
  border:1px solid var(--line);
  z-index:-1;
}
.about-image::after{
  content:"";position:absolute;inset:0;
  box-shadow:inset 0 0 90px 20px rgba(0,0,0,.5);
  pointer-events:none;
}
.about-image-cap{
  position:absolute;bottom:-2.7rem;right:0;
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.84rem;
  letter-spacing:.2em;
  color:var(--gold);
}

/* ====== Process ====== */
.process{
  background: var(--bg-2);
  color:var(--ink);
  padding: 7rem 4rem;
  position:relative;
}
.process > .section-num{justify-content:center}
.process > .section-title{text-align:center}
.process > *{max-width:1280px;margin-left:auto;margin-right:auto}
.process::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--line),transparent);
}
.process-intro{
  max-width: 37em;
  font-size:.96rem;
  line-height:2.35;
  color:var(--ink-soft);
  margin: 0 auto 4rem;
  text-align:center;
}

.process-steps{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top:1px solid var(--line-soft);
}
.step{
  padding: 2.4rem 1.8rem;
  border-right:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
  position:relative;
  transition:background .5s;
  display:flex;
  flex-direction:column;
}
.step::before{
  content:"";position:absolute;left:0;top:-1px;
  width:0;height:1px;
  background:linear-gradient(90deg,var(--gold),transparent);
  transition:width .6s cubic-bezier(.6,0,.2,1);
}
.step:hover{background:rgba(176,141,76,.05)}
.step:hover::before{width:100%}
.step:nth-child(3n){border-right:none}
.step:nth-child(3n+1){padding-left:0}
.step:nth-child(n+7){border-bottom:none}
.step-num{
  font-family:var(--serif-en);
  font-style:italic;
  font-weight:400;
  font-size:2.3rem;
  color:var(--gold);
  margin-bottom:1.6rem;
  letter-spacing:.05em;
}
.step h3{
  font-family:var(--serif);
  font-weight:500;
  font-size:1.3rem;
  letter-spacing:.14em;
  margin-bottom:.45rem;
  color:var(--ink);
}
.step .ja-sub{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.82rem;
  color:var(--gold);
  letter-spacing:.2em;
  margin-bottom:1.5rem;
  opacity:.8;
}
.step p{
  font-size:.9rem;
  line-height:2.1;
  color:var(--ink-soft);
}
.step-photo{
  margin-top:auto;
  padding-top:1.8rem;
  overflow:hidden;
}
.step-photo img{
  display:block;
  width:100%;
  aspect-ratio:16/10;
  object-fit:cover;
  border:1px solid var(--line-soft);
  filter:contrast(1.06) brightness(.9) saturate(.92);
  transition:transform .9s ease, filter .9s ease;
}
.step:hover .step-photo img{
  transform:scale(1.05);
  filter:contrast(1.06) brightness(1) saturate(1);
}

/* ====== Products ====== */
.products{
  background:var(--bg);
  display:grid;
  grid-template-columns: 300px 1fr;
  gap:4rem;
  align-items:start;
  max-width: 1280px;
  margin: 0 auto;
}
/* トップページのギャラリー抜粋：きれいに揃う3列グリッド（マソンリー無効化・読み込み前の潰れ防止） */
.products .works-gallery{
  columns:auto;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;
  max-width:none;
  margin:0;
}
.products .works-gallery figure{ margin:0; }
.products .works-gallery img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  height:auto;
  display:block;
}
@media (max-width:960px){
  .products .works-gallery{ grid-template-columns:repeat(2,1fr); gap:.8rem; }
}
.products-head{position:sticky;top:8rem}
.products-head p{
  font-size:.95rem;
  line-height:2.3;
  color:var(--ink-soft);
  margin-bottom:2rem;
}
.products-grid{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 2.4rem 1.2rem;
}
.product{
  cursor:pointer;
  transition:transform .55s cubic-bezier(.4,0,.2,1);
}
.product:hover{transform:translateY(-8px)}
.product-img{
  aspect-ratio: 1/1.15;
  overflow:hidden;
  margin-bottom:1.2rem;
  background:var(--bg-3);
  position:relative;
}
.product-img img{
  width:100%;height:100%;object-fit:cover;
  filter:contrast(1.05) brightness(.86) saturate(.92);
  transition:transform 1.3s cubic-bezier(.3,0,.2,1), filter .6s;
}
.product-img::after{
  content:"";position:absolute;inset:0;
  box-shadow:inset 0 0 80px 16px rgba(0,0,0,.55);
  background:radial-gradient(ellipse 90% 80% at 50% 38%, transparent 45%, rgba(0,0,0,.4) 100%);
  transition:opacity .6s;
}
.product:hover .product-img img{transform:scale(1.06);filter:contrast(1.05) brightness(1) saturate(1)}
.product:hover .product-img::after{opacity:.45}
.product-meta{
  display:flex;justify-content:space-between;align-items:baseline;
  margin-bottom:.65rem;
  border-bottom:1px solid var(--line-soft);
  padding-bottom:.65rem;
}
.product h4{
  font-family:var(--serif);
  font-weight:500;
  font-size:1rem;
  letter-spacing:.1em;
  color:var(--ink);
}
.product .ho{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.82rem;
  color:var(--gold);
  letter-spacing:.12em;
}
.product p{
  font-size:.87rem;
  color:var(--ink-soft);
  line-height:1.95;
}

/* ====== Quote ====== */
.quote-section{
  background: var(--bg-2);
  padding: 6rem 4rem;
  text-align:center;
  position:relative;
}
.quote-section::before, .quote-section::after{
  content:"";position:absolute;
  width:60px;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
  left:50%;transform:translateX(-50%);
}
.quote-section::before{top:3.5rem}
.quote-section::after{bottom:3.5rem}
.quote-mark{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:4.5rem;
  color:var(--gold);
  line-height:0;
  opacity:.3;
  margin-bottom:2.4rem;
  display:block;
}
.quote-section blockquote{
  font-family:var(--serif);
  font-weight:400;
  font-size: clamp(1.3rem, 2vw, 1.7rem);
  line-height:1.95;
  letter-spacing:.1em;
  max-width: 24em;
  margin: 0 auto 2rem;
  color:var(--ink);
}
.quote-section blockquote .em{
  background:linear-gradient(180deg,var(--gold-soft),var(--gold-deep));
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  font-weight:500;
}
.quote-section cite{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.9rem;
  letter-spacing:.28em;
  color:var(--gold);
  text-transform:uppercase;
}
.quote-section cite::before{content:"— "}

/* ====== Story ====== */
.story{
  display:grid;
  grid-template-columns: 1fr 1.05fr;
  gap: 4rem;
  align-items:center;
  background: var(--bg);
  max-width: 1240px;
  margin: 0 auto;
}
.story-image{
  aspect-ratio:5/5.4;
  overflow:hidden;
  position:relative;
  box-shadow:0 30px 80px rgba(0,0,0,.6);
  max-width: 480px;
}
.story-image img{
  width:100%;height:100%;object-fit:cover;
  filter:contrast(1.07) brightness(.88);
}
.story-image::after{
  content:"";position:absolute;inset:0;
  box-shadow:inset 0 0 110px 24px rgba(0,0,0,.55);
  pointer-events:none;
}
.story-image-num{
  position:absolute;top:1.6rem;left:1.6rem;
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.86rem;
  color:var(--ink);
  letter-spacing:.2em;
  background:rgba(20,18,16,.55);
  border:1px solid var(--line);
  padding:.45rem 1rem;
  backdrop-filter:blur(4px);
  z-index:2;
}
.story-text h3{
  font-family:var(--serif);
  font-weight:500;
  font-size: clamp(1.55rem, 2.5vw, 2.1rem);
  line-height:1.7;
  letter-spacing:.06em;
  margin-bottom:2.2rem;
  color:var(--ink);
}
.story-text p{
  font-size:.95rem;
  line-height:2.15;
  color:var(--ink-soft);
  margin-bottom:1.4rem;
}
.story-text .ornament{
  display:inline-block;width:46px;height:1px;
  background:linear-gradient(90deg,var(--gold),transparent);
  margin-bottom:1.6rem;
}

/* ====== Journal ====== */
.journal{
  background:var(--bg-2);
}
.journal > *{max-width:1280px;margin-left:auto;margin-right:auto}
.journal-head{
  display:flex;justify-content:space-between;align-items:flex-end;
  margin-bottom:3.5rem;
}
.view-more{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.95rem;
  letter-spacing:.18em;
  color:var(--gold);
  border-bottom:1px solid var(--line);
  padding-bottom:.35rem;
  transition:border-color .4s, color .4s;
}
.view-more:hover{color:var(--gold-soft);border-bottom-color:var(--gold-soft)}
.journal-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem 1.4rem;
}
.entry{cursor:pointer}
.entry-img{
  aspect-ratio:4/3;
  overflow:hidden;
  margin-bottom:1.5rem;
  position:relative;
}
.entry-img img{
  width:100%;height:100%;object-fit:cover;
  filter:contrast(1.05) brightness(.84) saturate(.9);
  transition:transform 1.1s cubic-bezier(.3,0,.2,1), filter .6s;
}
.entry-img::after{
  content:"";position:absolute;inset:0;
  box-shadow:inset 0 0 70px 14px rgba(0,0,0,.5);
}
.entry:hover .entry-img img{transform:scale(1.05);filter:contrast(1.05) brightness(1) saturate(1)}
.entry .date{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.84rem;
  color:var(--gold);
  letter-spacing:.18em;
  margin-bottom:.65rem;
}
.entry h4{
  font-family:var(--serif);
  font-weight:500;
  font-size:1.08rem;
  line-height:1.8;
  letter-spacing:.05em;
  margin-bottom:.7rem;
  color:var(--ink);
  transition:color .4s;
}
.entry:hover h4{color:var(--gold-soft)}
.entry .tag{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.78rem;
  letter-spacing:.16em;
  color:var(--ink-dim);
}

/* ====== Contact ====== */
.contact-cta{
  background:var(--bg);
  color:var(--ink);
  text-align:center;
  padding: 7rem 4rem;
  position:relative;
}
.contact-cta::before{
  content:"";position:absolute;inset:2rem;
  border:1px solid var(--line);
  pointer-events:none;
}
.contact-cta::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse 55% 60% at 50% 42%, rgba(176,141,76,.08), transparent 70%);
  pointer-events:none;
}
.contact-cta > div{position:relative;z-index:1}
.contact-cta .small-en{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:1rem;
  letter-spacing:.3em;
  color:var(--gold);
  margin-bottom:1.9rem;
}
.contact-cta h2{
  font-family:var(--serif);
  font-weight:500;
  font-size: clamp(1.8rem, 2.8vw, 2.4rem);
  letter-spacing:.1em;
  line-height:1.6;
  margin-bottom:1.8rem;
  color:var(--ink);
  text-shadow:0 2px 30px rgba(0,0,0,.5);
}
.contact-cta p{
  font-size:.95rem;
  line-height:2.15;
  color:var(--ink-soft);
  max-width:30em;
  margin:0 auto 2.6rem;
}
.btn{
  display:inline-block;
  font-family:var(--serif);
  font-size:.9rem;
  letter-spacing:.26em;
  padding: 1.1rem 2.6rem;
  border:1px solid var(--gold);
  color:var(--gold-soft);
  background:transparent;
  cursor:pointer;
  transition: color .45s;
  position:relative;
  overflow:hidden;
}
.btn::before{
  content:"";position:absolute;
  inset:0;
  background:linear-gradient(120deg,var(--gold-soft),var(--gold-deep));
  transform:translateY(101%);
  transition:transform .55s cubic-bezier(.7,0,.3,1);
  z-index:-1;
}
.btn:hover{color:var(--bg)}
.btn:hover::before{transform:translateY(0)}

/* お問合せページ 家紋エンブレム */
.contact-emblem{ text-align:center; padding: 4.5rem 1.6rem 3rem; }
.contact-emblem img{
  width:min(200px, 42vw); height:auto; display:block; margin:0 auto;
  box-shadow:0 20px 46px rgba(0,0,0,.5);
}
@media (max-width:960px){ .contact-emblem{ padding:2.5rem 1.6rem 2rem; } .contact-emblem img{ width:min(150px,42vw); } }

/* お問合せページ用 */
.contact-page{
  padding: 5rem 4rem;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  max-width: 1200px;
  margin: 0 auto;
}
.contact-info{
  background: var(--bg-3);
  padding: 3rem;
  border:1px solid var(--line);
  border-radius:2px;
}
.contact-info h3{
  font-family:var(--serif);
  font-weight:500;
  font-size:1.3rem;
  letter-spacing:.1em;
  margin-bottom:1.8rem;
  color:var(--ink);
}
.contact-info dl{
  display:grid;
  grid-template-columns: 6em 1fr;
  gap: 1rem 1.5rem;
  font-size:.95rem;
  line-height:2;
}
.contact-info dt{
  font-family:var(--serif-en);
  font-style:italic;
  color:var(--gold);
  letter-spacing:.1em;
}
.contact-info dd{
  color:var(--ink-soft);
  min-width:0;
  overflow-wrap:anywhere;
}
.contact-info a{color:var(--gold-soft)}
.contact-info a:hover{color:var(--gold)}
.contact-text h2{
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(1.8rem,3vw,2.4rem);
  letter-spacing:.08em;
  line-height:1.6;
  margin-bottom:2rem;
  color:var(--ink);
}
.contact-text p{
  font-size:1rem;
  line-height:2.3;
  color:var(--ink-soft);
  margin-bottom:1.4rem;
}

/* ====== Footer ====== */
footer{
  background:var(--bg-2);
  padding: 4rem 4rem 2.2rem;
  position:relative;z-index:2;
  border-top:1px solid var(--line);
}
footer > *{max-width:1280px;margin-left:auto;margin-right:auto}
.footer-grid{
  display:grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 3rem;
  margin-bottom:3.2rem;
}
.footer-brand .logo-block{
  margin-bottom:1.6rem;
}
.footer-brand .logo-block img{
  height: 62px;
  width:auto;
  display:block;
  opacity:.95;
}
.footer-brand p{
  font-size:.87rem;
  line-height:2.1;
  color:var(--ink-soft);
  margin-bottom:1.6rem;
  max-width: 22em;
}
.footer-brand .addr{
  font-family:var(--serif);
  font-size:.86rem;
  line-height:2;
  color:var(--ink-soft);
  letter-spacing:.04em;
}
footer h5{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.84rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  margin-bottom:1.5rem;
  color:var(--gold);
}
footer ul{list-style:none}
footer li{
  font-family:var(--serif);
  font-size:.9rem;
  letter-spacing:.06em;
  margin-bottom:.75rem;
  color:var(--ink-soft);
}
footer li a:hover{color:var(--gold-soft)}
.footer-bottom{
  border-top:1px solid var(--line-soft);
  padding-top:2.2rem;
  display:flex;justify-content:space-between;align-items:center;
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.78rem;
  color:var(--ink-dim);
  letter-spacing:.14em;
}
.footer-bottom .social a{margin-left:1.6rem}
.footer-bottom .social a:hover{color:var(--gold-soft)}

/* ====== Feature Image (大判ワイド画像) ====== */
.feature-image{
  position:relative;
  z-index:2;
  margin: 0;
  padding: 0 4rem 4rem;
  background: var(--bg);
}
.feature-image.on-dark{ background: var(--bg-2); }
.feature-image .frame{
  aspect-ratio: 16/6;
  overflow:hidden;
  position:relative;
  box-shadow: 0 30px 80px rgba(0,0,0,.6);
  max-width: 1200px;
  margin: 0 auto;
}
.feature-image.portrait .frame{
  aspect-ratio: 3/4;
  max-width: 440px;
}
.feature-image .frame img{
  width:100%;height:100%;object-fit:cover;
  filter: contrast(1.08) brightness(.88) saturate(.92);
}
.feature-image .frame::after{
  content:"";position:absolute;inset:0;
  box-shadow:inset 0 0 140px 28px rgba(0,0,0,.6);
  pointer-events:none;
}
.feature-image .cap{
  position:absolute;
  bottom:1.4rem; right:1.6rem;
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.8rem;
  letter-spacing:.22em;
  color:var(--ink);
  background:rgba(20,18,16,.55);
  border:1px solid var(--line);
  padding:.4rem 1rem;
  backdrop-filter:blur(4px);
  z-index:3;
}
@media (max-width: 960px){
  .feature-image{padding: 0 1.6rem 3.5rem}
  .feature-image .frame{aspect-ratio: 4/3}
  .feature-image.portrait .frame{aspect-ratio: 3/4; max-width: 320px}
  .feature-image .cap{bottom:4.5rem;right:1.6rem;font-size:.78rem}
}

/* ====== Video (YouTube 埋め込み) ====== */
/* ====== 職人ページ 工房を支える手 ====== */
.makers{ background:var(--bg-2); padding: 6rem 4rem; }
.makers-inner{ max-width:1000px; margin:0 auto; }
.makers-grid{ display:grid; grid-template-columns:1fr 1fr; gap:2.6rem; margin-top:3rem; }
.makers figure{ margin:0; }
.makers-img{ aspect-ratio:4/3; overflow:hidden; border:1px solid var(--line-soft); box-shadow:0 22px 50px rgba(0,0,0,.45); }
.makers-img img{ width:100%; height:100%; object-fit:cover; filter:contrast(1.04) brightness(.94); transition:transform .9s ease; }
.makers figure:hover .makers-img img{ transform:scale(1.04); }
.makers figcaption{ margin-top:1.1rem; text-align:center; font-family:var(--serif); font-size:1.1rem; letter-spacing:.18em; color:var(--ink); }
.makers figcaption span{ display:block; margin-top:.4rem; font-size:.78rem; letter-spacing:.14em; color:var(--gold); }
@media (max-width:960px){ .makers{ padding:4rem 1.6rem; } .makers-grid{ grid-template-columns:1fr; gap:2.4rem; } }

.video-section{
  background:var(--bg);
  padding: 0 4rem 7rem;
}
.video-inner{
  max-width:1000px;
  margin:0 auto;
  text-align:center;
}
.video-section .section-num{
  margin-bottom:1.2rem;
}
.video-section h2{
  font-family:var(--serif);
  font-weight:400;
  font-size:1.55rem;
  letter-spacing:.16em;
  color:var(--ink);
  margin-bottom:.9rem;
}
.video-section .video-lead{
  font-size:.88rem;
  line-height:2;
  color:var(--ink-soft);
  margin-bottom:2.6rem;
}
.video-embed{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
  border:1px solid var(--line);
  box-shadow:0 30px 80px rgba(0,0,0,.6);
  background:var(--bg-2);
  cursor:pointer;
}
.video-embed img,
.video-embed iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}
.video-embed img{
  object-fit:cover;
  filter:contrast(1.05) brightness(.66) saturate(.9);
  transition:filter .7s ease, transform .9s ease;
}
.video-embed:hover img{
  filter:contrast(1.05) brightness(.8) saturate(1);
  transform:scale(1.03);
}
.video-embed .play{
  position:absolute;
  top:50%; left:50%;
  transform:translate(-50%,-50%);
  width:84px; height:84px;
  border-radius:50%;
  border:1px solid var(--line);
  background:rgba(20,18,16,.55);
  backdrop-filter:blur(4px);
  display:grid;
  place-items:center;
  transition:background .5s ease, border-color .5s ease;
  pointer-events:none;
}
.video-embed:hover .play{
  background:rgba(176,141,76,.22);
  border-color:var(--gold-soft);
}
.video-embed .play svg{
  margin-left:5px;
  color:var(--gold-soft);
}
.video-credit{
  margin-top:1.2rem;
  font-size:.76rem;
  letter-spacing:.1em;
  color:var(--ink-dim);
}
.video-credit a{color:var(--ink-soft);text-decoration:none;border-bottom:1px solid var(--line)}
.video-credit a:hover{color:var(--gold-soft)}
.video-row{
  display:grid; grid-template-columns:1fr 1fr; gap:1.4rem;
  margin-top:1.6rem;
}
.video-row .video-item{ display:flex; flex-direction:column; }
.video-row .video-embed{ box-shadow:0 18px 50px rgba(0,0,0,.5); }
.video-row .video-embed .play{ width:64px; height:64px; }
.video-row .video-cap{
  margin-top:.7rem; font-size:.72rem; letter-spacing:.08em;
  color:var(--ink-dim); text-align:center;
}
.video-row .video-cap a{ color:var(--ink-soft); text-decoration:none; border-bottom:1px solid var(--line); }
.video-row .video-cap a:hover{ color:var(--gold-soft); }
@media (max-width: 960px){
  .video-section{padding:0 1.6rem 4.5rem}
  .video-section h2{font-size:1.25rem}
  .video-embed .play{width:64px;height:64px}
  .video-row{ grid-template-columns:1fr; gap:1rem; }
}

/* ====== Journal grouped gallery ====== */
.jg-group{ max-width:1120px; margin:0 auto 3.4rem; }
.jg-cap{
  font-family:var(--serif); font-weight:500;
  font-size:1.05rem; letter-spacing:.14em; color:var(--gold-soft);
  margin:0 0 1.2rem; padding-bottom:.6rem;
  border-bottom:1px solid var(--line);
}
.jg-grid{ display:flex; flex-wrap:wrap; gap:1rem; }
.jg-grid figure{ flex:0 1 236px; max-width:236px; margin:0; overflow:hidden; border:1px solid var(--line-soft); }
.jg-grid img{
  width:100%; aspect-ratio:1/1; object-fit:cover; display:block;
  filter:contrast(1.04) brightness(.94);
  transition:transform .8s ease;
}
.jg-grid figure:hover img{ transform:scale(1.05); }
@media (max-width:960px){
  .jg-grid{ gap:.6rem; }
  .jg-grid figure{ flex:0 1 calc(50% - .3rem); max-width:calc(50% - .3rem); }
}

/* ====== Works Gallery (masonry) ====== */
.works-gallery-section{ background:var(--bg); padding: 1rem 4rem 7rem; }
.works-gallery{
  max-width:1120px; margin:0 auto;
  columns: 3; column-gap: 1.2rem;
}
.works-gallery figure{
  margin:0 0 1.2rem; break-inside:avoid; overflow:hidden;
  border:1px solid var(--line-soft);
}
.works-gallery img{
  width:100%; display:block;
  filter:contrast(1.04) brightness(.94) saturate(.96);
  transition:transform .9s ease, filter .9s ease;
}
.works-gallery figure:hover img{ transform:scale(1.04); filter:contrast(1.04) brightness(1) saturate(1); }
@media (max-width:960px){
  .works-gallery-section{ padding:1rem 1.6rem 4.5rem; }
  .works-gallery{ columns:2; column-gap:.8rem; }
  .works-gallery figure{ margin-bottom:.8rem; }
}
@media (max-width:520px){
  .works-gallery{ columns:1; }
}

/* ====== Certified (伝統工芸士) ====== */
.cert-section{ background:var(--bg-2); padding:6rem 4rem; text-align:center; }
.cert-inner{ max-width:900px; margin:0 auto; }
.cert-title{ font-family:var(--serif); font-weight:500; font-size:1.6rem; letter-spacing:.18em; color:var(--ink); margin:.6rem 0 1rem; }
.cert-sub{ font-size:.9rem; line-height:2; color:var(--ink-soft); max-width:34em; margin:0 auto 2.6rem; }
.cert-imgs{ display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; max-width:600px; margin:0 auto; }
.cert-imgs figure{ margin:0; }
.cert-imgs img{ width:100%; aspect-ratio:3/4; object-fit:contain; background:var(--bg-3); display:block; border:1px solid var(--line); padding:.4rem; }
@media(max-width:960px){ .cert-section{ padding:4rem 1.6rem; } .cert-imgs{ gap:.8rem; } }

/* ====== Process (7 steps list + photo band) ====== */
.proc-head{ text-align:center; margin-bottom:3.2rem; }
.proc-title{
  font-family:var(--serif); font-weight:500;
  font-size:clamp(1.7rem,3vw,2.3rem); letter-spacing:.16em;
  color:var(--ink); margin:.5rem 0 .8rem;
}
.proc-sub{ font-size:.9rem; letter-spacing:.1em; color:var(--ink-soft); margin:0; }
.proc-list{
  list-style:none; max-width:940px; margin:0 auto; padding:0;
  display:grid; grid-template-columns:1fr 1fr; gap:0 3.5rem;
}
.proc-list li{
  display:grid; grid-template-columns:auto 1fr; gap:1.2rem; align-items:baseline;
  padding:1.3rem 0; border-bottom:1px solid var(--line-soft);
}
.proc-no{
  font-family:var(--serif-en); font-style:italic; font-weight:400;
  font-size:1.5rem; color:var(--gold); line-height:1;
}
.proc-body h3{
  font-family:var(--serif); font-weight:500; font-size:1.08rem;
  letter-spacing:.12em; color:var(--ink); margin:0 0 .5rem;
}
.proc-body p{ font-size:.86rem; line-height:1.95; color:var(--ink-soft); margin:0; }
.process-gallery-section{ background:var(--bg); padding:0 4rem 7rem; }
.home-process{ background:var(--bg); padding: 2rem 4rem 7rem; text-align:center; }
.home-process-head{ max-width:640px; margin:0 auto 3rem; }
.home-process-head .section-title{ margin-bottom:1.4rem; }
.home-process-head p{ color:var(--ink-soft); line-height:2.2; font-size:.95rem; margin:0 0 1.8rem; }
@media (max-width:960px){ .home-process{ padding:1rem 1.6rem 4.5rem; } }

/* ====== Intro splash (トップページのオープニング) ====== */
.intro-splash{
  position:fixed; inset:0; z-index:3000;
  background:#0c0b0a;
  display:flex; align-items:center; justify-content:center;
  animation: introOut 1s ease 2.2s forwards;
}
.intro-splash img{
  width:min(66vw, 520px); height:auto;
  opacity:0;
  animation: introIn 1.6s cubic-bezier(.22,.61,.36,1) .3s forwards;
}
@keyframes introIn{
  from{ opacity:0; transform:translateY(14px) scale(.97); filter:blur(6px); }
  to{ opacity:1; transform:none; filter:blur(0); }
}
@keyframes introOut{
  to{ opacity:0; visibility:hidden; }
}
@media (max-width:960px){ .intro-splash img{ width:82vw; } }
@media (prefers-reduced-motion: reduce){
  .intro-splash{ animation:introOut .4s ease 1s forwards; }
  .intro-splash img{ animation:introIn .6s ease forwards; }
}
.proc-gallery-band{
  max-width:1180px; margin:0 auto;
  display:grid; grid-template-columns:repeat(5,1fr); gap:1rem;
}
.proc-gallery-band figure{ margin:0; overflow:hidden; }
.proc-gallery-band img{
  width:100%; aspect-ratio:3/4; object-fit:cover; display:block;
  border:1px solid var(--line-soft);
  filter:contrast(1.05) brightness(.9);
  transition:transform .9s ease;
}
.proc-gallery-band figure:hover img{ transform:scale(1.04); }
@media (max-width:960px){
  .proc-list{ grid-template-columns:1fr; gap:0; max-width:none; }
  .process-gallery-section{ padding:0 1.6rem 4.5rem; }
  .proc-gallery-band{ grid-template-columns:1fr 1fr; gap:.6rem; }
}

/* ====== Map (アクセス地図) ====== */
.map-section{
  background:var(--bg);
  padding: 0 4rem 6rem;
}
.map-inner{
  max-width:1000px;
  margin:0 auto;
  text-align:center;
}
.map-section .section-num{
  margin-bottom:1.2rem;
}
.map-section h2{
  font-family:var(--serif);
  font-weight:400;
  font-size:1.4rem;
  letter-spacing:.16em;
  color:var(--ink);
  margin-bottom:2rem;
}
.map-frame{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
  border:1px solid var(--line);
  box-shadow:0 30px 80px rgba(0,0,0,.5);
  background:var(--bg-2);
}
.map-frame iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}
.map-link{
  margin-top:1.2rem;
  font-size:.82rem;
  letter-spacing:.08em;
}
.map-link a{
  color:var(--ink-soft);
  text-decoration:none;
  border-bottom:1px solid var(--line);
  padding-bottom:2px;
}
.map-link a:hover{color:var(--gold-soft)}
@media (max-width: 960px){
  .map-section{padding:0 1.6rem 4.5rem}
  .map-frame{aspect-ratio:4/5}
}

/* ====== Visit Gallery (Journal下部) ====== */
.visit-gallery-section{
  background: var(--bg);
  padding: 6rem 4rem;
  border-top: 1px solid var(--line);
  position:relative;
  z-index:2;
}
.visit-gallery-inner{max-width: 1200px; margin: 0 auto;}
.visit-gallery-head{text-align:center; margin-bottom: 4rem;}
.visit-gallery-head .lead{
  max-width:34em;
  margin:1.2rem auto 0;
  font-size:.95rem;
  line-height:2.1;
  color:var(--ink-soft);
}
.visit-gallery-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.4rem 1.6rem;
}
.visit-gallery-grid figure{margin:0;position:relative}
.visit-gallery-grid .img{
  aspect-ratio: 3/2;
  overflow:hidden;
  background: var(--bg-3);
  position:relative;
}
.visit-gallery-grid .img img{
  width:100%;height:100%;object-fit:cover;
  filter: contrast(1.04) brightness(.92) saturate(.92);
  transition: transform 1.1s cubic-bezier(.3,0,.2,1), filter .5s;
}
.visit-gallery-grid .img::after{
  content:"";position:absolute;inset:0;
  box-shadow: inset 0 0 60px 14px rgba(0,0,0,.45);
  pointer-events:none;
}
.visit-gallery-grid figure:hover .img img{transform:scale(1.04);filter:contrast(1.04) brightness(1) saturate(1)}
.visit-gallery-grid figcaption{
  font-family: var(--serif);
  font-size: .9rem;
  letter-spacing: .04em;
  color: var(--ink-soft);
  margin-top: .8rem;
  text-align: center;
}
@media (max-width: 720px){
  .visit-gallery-section{padding: 4rem 1.6rem}
  .visit-gallery-grid{grid-template-columns: 1fr; gap: 1.6rem}
}

/* ====== Family Section (家族＋お子さん) ====== */
.family-section{
  background: var(--bg-2);
  padding: 6rem 4rem;
  position:relative;
  z-index:2;
}
.family-section-inner{
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.8rem;
  align-items: start;
}
.family-section figure{margin:0;position:relative}
.family-section .family-img{
  overflow:hidden;
  position:relative;
  box-shadow: 0 20px 50px rgba(0,0,0,.5);
  background: var(--bg-3);
}
.family-section .family-img img{
  width:100%;height:100%;object-fit:cover;
  filter: contrast(1.05) brightness(.95) saturate(.95);
}
.family-section .family-img::after{
  content:"";position:absolute;inset:0;
  box-shadow: inset 0 0 80px 16px rgba(0,0,0,.5);
  pointer-events:none;
}
.family-section .main-portrait .family-img,
.family-section .child-portrait .family-img{aspect-ratio: 4/5}
.family-section figcaption{
  font-family: var(--serif-en);
  font-style: italic;
  font-size: .82rem;
  letter-spacing: .2em;
  color: var(--gold);
  margin-top: .9rem;
  text-align: center;
}
@media (max-width: 720px){
  .family-section{padding: 4rem 1.6rem}
  .family-section-inner{
    grid-template-columns: 1fr;
    gap: 2.4rem;
    max-width: 360px;
  }
}

/* ====== History (Timeline + Archive Gallery) ====== */
.history{
  background: var(--bg);
  padding: 7rem 4rem;
}
.history-inner{max-width: 1100px; margin: 0 auto;}
.history-lead{
  max-width: 38em;
  margin: 0 auto 5rem;
  text-align:center;
  font-size:1rem;
  line-height:2.2;
  color:var(--ink-soft);
}

.timeline{
  position:relative;
  margin: 4rem 0 6rem;
  padding-left: 2.4rem;
}
.timeline::before{
  content:"";
  position:absolute;
  top: .8rem;
  bottom: .8rem;
  left: 0;
  width:1px;
  background: linear-gradient(180deg, var(--gold) 0%, var(--gold-deep) 40%, transparent 100%);
}
.timeline-item{
  position:relative;
  padding: 0 0 3rem 2.4rem;
}
.timeline-item:last-child{padding-bottom:0}
.timeline-item::before{
  content:"";
  position:absolute;
  left: -.42rem;
  top: 1rem;
  width: 9px;height: 9px;
  border-radius:50%;
  background: var(--gold);
  box-shadow: 0 0 0 4px rgba(176,141,76,.18);
}
.timeline-era{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.92rem;
  letter-spacing:.22em;
  color:var(--gold);
  margin-bottom:.5rem;
}
.timeline-year{
  font-family:var(--serif);
  font-weight:500;
  font-size:1.15rem;
  letter-spacing:.06em;
  color:var(--ink);
  margin-bottom:.9rem;
}
.timeline-item h3{
  font-family:var(--serif);
  font-weight:500;
  font-size:1.2rem;
  letter-spacing:.08em;
  color:var(--ink);
  margin-bottom:.7rem;
}
.timeline-item p{
  font-family:var(--serif);
  font-size:.94rem;
  line-height:2.1;
  color:var(--ink-soft);
}

/* Archive Gallery (古い写真) */
.archive-section{
  background: var(--bg-2);
  padding: 7rem 4rem;
  border-top: 1px solid var(--line);
}
.archive-inner{max-width: 1200px; margin: 0 auto;}
.archive-head{text-align:center; margin-bottom: 4rem;}
.archive-note{
  font-family:var(--serif);
  font-size:.84rem;
  color:var(--ink-dim);
  margin-top:1.6rem;
  font-style: italic;
  letter-spacing:.04em;
}
.archive-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.4rem;
}
.archive-grid figure{
  margin:0;
  position:relative;
}
.archive-grid .archive-img{
  aspect-ratio: 1/1;
  overflow:hidden;
  background: var(--bg-3);
  position:relative;
}
.archive-grid .archive-img img{
  width:100%;height:100%;object-fit:cover;
  filter: contrast(1.06) brightness(.92) sepia(.12) saturate(.85);
  transition: transform 1.2s cubic-bezier(.3,0,.2,1), filter .6s;
}
.archive-grid .archive-img::after{
  content:"";position:absolute;inset:0;
  box-shadow: inset 0 0 60px 12px rgba(0,0,0,.55);
  pointer-events:none;
}
.archive-grid figure:hover .archive-img img{transform:scale(1.04);filter:contrast(1.06) brightness(1) sepia(.05) saturate(1)}
.archive-grid figcaption{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.78rem;
  letter-spacing:.18em;
  color:var(--ink-dim);
  margin-top:.7rem;
  text-align:center;
}

@media (max-width: 960px){
  .history{padding: 4.5rem 1.6rem}
  .history-lead{margin-bottom:3rem}
  .timeline{padding-left:1.6rem}
  .timeline-item{padding-left:1.6rem;padding-bottom:2.2rem}
  .archive-section{padding: 4.5rem 1.6rem}
  .archive-grid{grid-template-columns: repeat(2, 1fr); gap:1rem}
}

/* ====== reveal animations ====== */
.reveal{
  opacity:0;transform:translateY(36px);
  transition:opacity 1.2s cubic-bezier(.3,0,.2,1), transform 1.2s cubic-bezier(.3,0,.2,1);
}
.reveal.in{opacity:1;transform:translateY(0)}

/* ====== Responsive ====== */
@media (max-width: 960px){
  header{padding:1.1rem 1.3rem}
  header.scrolled{padding:.9rem 1.3rem}
  .main-nav{display:none}
  .menu-btn{display:block}
  .logo img{height: 52px}
  header.scrolled .logo img{height: 40px}
  .logo .en{display:none}

  section{padding: 5.5rem 1.6rem}
  .process{padding: 6.5rem 1.6rem}
  .quote-section{padding:5.5rem 1.6rem}
  .contact-cta{padding: 7.5rem 1.6rem}
  .contact-page{padding: 5.5rem 1.6rem;grid-template-columns:1fr;gap:3rem}
  /* スマホ：本文を中央寄せにして、上の見出し部分と揃える（左寄り解消） */
  .contact-text{text-align:center}
  .page-hero{padding: 11rem 1.6rem 4rem}
  footer{padding: 3.5rem 1.6rem 2rem}

  /* モバイル：写真を上・文字を下に分けて配置
     （職人さんをアップにしない／文字が顔にかからない） */
  .hero{
    display:flex;
    flex-direction:column;
    position:relative;
    min-height:0;
    max-height:none;
    overflow:visible;
    /* 固定ヘッダー（約88px）の下から写真を始める（頭・掛軸が隠れないように） */
    padding:92px 0 0;
    background:var(--bg);
  }
  .hero-visual{
    position:relative; inset:auto;
    width:100%; height:auto;
    aspect-ratio: 1567 / 1045;  /* 写真と同じ比率の枠（スライド切替用） */
    order:0;
  }
  /* 写真は切り取らず、全体をそのままの比率で表示（工房全体が写る距離感） */
  .hero-visual img{ height:100%; object-fit:contain; object-position:center; }
  .hero-visual img:nth-of-type(2){ object-position:center; }
  .hero-visual::before{
    background:
      linear-gradient(180deg, rgba(20,18,16,.30) 0%, transparent 26%, transparent 74%, rgba(20,18,16,.55) 100%);
  }
  .hero-visual::after{ display:none; }
  /* 文字は写真の下に、下地（濃色）の上に配置 */
  .hero-text{
    position:relative; left:auto; right:auto; bottom:auto;
    z-index:3;
    order:1;
    background:var(--bg);
    padding: 2.4rem 1.6rem 2.8rem;
  }
  .hero-eyebrow{ margin-bottom:.7rem; font-size:.96rem; }
  .hero h1{ line-height:1.18; margin-bottom:.85rem; }
  .hero h1 .small{ margin-top:.5rem; }
  .hero-lead{ line-height:1.55; margin-bottom:1rem; max-width:none; }
  .hero-meta{ gap:.55rem; }
  .scroll-mark{display:none}
  .vertical-cap{right:1.1rem;font-size:.74rem}

  .about{grid-template-columns:1fr;gap:3.5rem;padding:4.5rem 1.6rem}
  .about-image::before{display:none}
  .about-image-cap{bottom:-2.2rem}

  .process-steps{grid-template-columns:1fr;border-top:none}
  .step{
    border-right:none;
    border-bottom:1px solid var(--line-soft);
    padding: 2.6rem 0 !important;
  }
  .step:last-child{border-bottom:none}

  .products{grid-template-columns:1fr;gap:3rem}
  .products-head{position:static}
  .products-grid{grid-template-columns: repeat(2, 1fr);gap: 2rem 1.6rem}

  .story{grid-template-columns:1fr;gap:3rem}

  .journal-grid{grid-template-columns:1fr;gap:2.8rem}
  .journal-head{flex-direction:column;align-items:flex-start;gap:1.6rem}

  .footer-grid{grid-template-columns:1fr 1fr;gap:2.6rem}
  .footer-brand .logo-block img{height: 56px}
  .footer-bottom{flex-direction:column;gap:1rem;text-align:center}
  .footer-bottom .social a{margin:0 .85rem}
}

@media (max-width: 480px){
  .products-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .hero-meta{flex-wrap:wrap;gap:.85rem}
  .hero-meta .divider{display:none}
  .contact-cta::before{inset:1.2rem}
}