:root{
  --accent:        #b88a5e;
  --accent-soft:   rgba(184,138,94,.12);
  --bg:            #ffffff;
  --bg-soft:       #f7f5f1;
  --bg-deep:       #1a1816;
  --text:          #1a1816;
  --text-muted:    #6b6661;
  --text-faint:    #a8a39d;
  --border:        #ebe7df;
  --border-soft:   #f1ede5;

  --font-gothic: "Noto Sans JP","Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
  --font-mincho: "Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;
  --font-latin:  "Inter","Noto Sans JP","Helvetica Neue",Arial,sans-serif;

  --font-body: var(--font-gothic);
  --font-head: var(--font-gothic);
  --font-en:   "Inter","Helvetica Neue",Arial,sans-serif;

  --container: 1240px;
  --header-h:  76px;

  --ease: cubic-bezier(.4,0,.2,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg); color:var(--text);
  font-family:var(--font-body);
  font-size:15px; line-height:1.8;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
button{font-family:inherit; cursor:pointer; border:0; background:none; color:inherit}
input,textarea,select{font:inherit; color:inherit}

/* ── Utility ────────────────────────────────────────────── */
.container{max-width:var(--container); margin:0 auto; padding:0 32px}
.eyebrow{
  font-family:var(--font-en);
  font-size:11px; font-weight:500;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--accent);
  display:inline-flex; align-items:center; gap:14px;
}
.eyebrow::before{
  content:""; width:28px; height:1px; background:var(--accent); display:inline-block;
}
.section-title{
  font-family:var(--font-head);
  font-size:clamp(28px,3.6vw,44px);
  font-weight:600;
  letter-spacing:.04em;
  line-height:1.3;
  margin-top:14px;
}

/* scroll fade-ins */
.reveal{opacity:0; transform:translateY(28px); transition:opacity .9s var(--ease), transform .9s var(--ease)}
.reveal.in{opacity:1; transform:none}
.reveal[data-delay="1"]{transition-delay:.08s}
.reveal[data-delay="2"]{transition-delay:.16s}
.reveal[data-delay="3"]{transition-delay:.24s}
.reveal[data-delay="4"]{transition-delay:.32s}

/* ── Header ─────────────────────────────────────────────── */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  height:var(--header-h);
  display:flex; align-items:center;
  transition:background .35s var(--ease), backdrop-filter .35s var(--ease), border-color .35s var(--ease), color .35s var(--ease);
  border-bottom:1px solid transparent;
}
.site-header .container{display:flex; align-items:center; justify-content:space-between; width:100%}
.site-header.solid{
  background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom-color:var(--border);
}
.site-header.on-hero{ color:#fff }
.site-header.on-hero.solid{ color:var(--text) }

.brand{
  font-family:var(--font-en);
  font-size:22px; font-weight:600; letter-spacing:.02em;
  display:flex; align-items:center; gap:10px;
}
.brand::before{
  content:""; width:10px; height:10px; border-radius:50%;
  background:var(--accent); display:inline-block;
  transition:transform .4s var(--ease);
}
.brand:hover::before{ transform:scale(1.3) }

.nav{display:flex; align-items:center; gap:36px}
.nav a{
  font-size:13px; font-weight:500; letter-spacing:.04em;
  position:relative; padding:6px 0;
  transition:color .25s var(--ease);
}
.nav a:not(.icon-link)::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:1px;
  background:currentColor; transform:scaleX(0); transform-origin:left;
  transition:transform .35s var(--ease);
}
.nav a:not(.icon-link):hover::after{ transform:scaleX(1) }

.icon-link{
  display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px; border-radius:50%;
  transition:background .25s var(--ease), transform .25s var(--ease);
}
.icon-link:hover{ background:var(--accent-soft); transform:translateY(-1px) }
.icon-link svg{ width:20px; height:20px; display:block }
.icon-link.ig{ overflow:visible }
.icon-link.ig:hover{ background:transparent; transform:translateY(-1px) scale(1.06) }

/* ── Hero ───────────────────────────────────────────────── */
.hero{ position:relative; min-height:100vh; overflow:hidden }
.hero__media{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  transform:scale(1.05);
}
.hero__media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(15,12,10,.42) 0%, rgba(15,12,10,.30) 45%, rgba(15,12,10,.65) 100%);
}
.hero__inner{
  position:relative; z-index:2;
  min-height:100vh;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:0 0 96px;
  color:#fff;
}
.hero__title{
  font-family:var(--font-head);
  font-weight:500;
  font-size:clamp(40px,7vw,92px);
  letter-spacing:.04em;
  line-height:1.18;
  margin-top:28px;
  max-width:14ch;
}
.hero__title em{ font-style:normal; color:var(--accent); }
.hero__scroll{
  position:absolute; right:32px; bottom:40px; z-index:2;
  display:flex; align-items:center; gap:10px;
  font-family:var(--font-en);
  font-size:10px; font-weight:500; letter-spacing:.28em;
  color:rgba(255,255,255,.78);
  writing-mode:vertical-rl;
}
.hero__scroll::after{
  content:""; width:1px; height:64px; background:rgba(255,255,255,.5);
  position:relative; overflow:hidden;
}
.hero__scroll-line{
  position:absolute; right:0; bottom:0; width:1px; height:64px;
  overflow:hidden;
}
.hero__scroll-line::after{
  content:""; position:absolute; left:0; top:-64px; width:1px; height:64px;
  background:#fff;
  animation:scrollLine 2.2s var(--ease) infinite;
}
@keyframes scrollLine{
  0%{top:-64px} 60%{top:64px} 100%{top:64px}
}

/* ── Sections shared ────────────────────────────────────── */
section.block{ padding:140px 0; position:relative }
section.block.alt{ background:var(--bg-soft) }
.block-head{ margin-bottom:80px; max-width:720px }
.block-head .lead{
  margin-top:24px; color:var(--text-muted);
  font-size:15px; line-height:2.0; max-width:54ch;
}

/* ── Business ───────────────────────────────────────────── */
.biz-list{ display:flex; flex-direction:column; gap:140px }
.biz-item{
  display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center;
}
.biz-item.reverse{ direction:rtl }
.biz-item.reverse > *{ direction:ltr }
.biz-media{
  position:relative; aspect-ratio:5 / 6; overflow:hidden;
  border-radius:4px;
}
.biz-media img{
  width:100%; height:100%; object-fit:cover;
  transition:transform 1.6s var(--ease);
}
.biz-item:hover .biz-media img{ transform:scale(1.04) }
.biz-body .eyebrow{ margin-bottom:18px }
.biz-title{
  font-family:var(--font-head);
  font-size:clamp(28px,3.2vw,40px);
  font-weight:600;
  letter-spacing:.04em;
  margin-bottom:8px;
}
.biz-title-en{
  font-family:var(--font-en);
  font-size:13px; font-weight:500; letter-spacing:.22em;
  color:var(--text-faint); text-transform:uppercase;
  margin-bottom:32px;
}
.biz-desc{
  color:var(--text-muted);
  font-size:15px; line-height:2.0;
  max-width:44ch;
}
.biz-desc + .biz-desc{ margin-top:1.2em }
.biz-meta{
  margin-top:36px; padding-top:28px;
  border-top:1px solid var(--border);
  display:flex; gap:48px; flex-wrap:wrap;
}
.biz-meta dt{
  font-family:var(--font-en); font-size:10px;
  font-weight:500; letter-spacing:.2em; text-transform:uppercase;
  color:var(--text-faint); margin-bottom:6px;
}
.biz-meta dd{ font-size:14px; color:var(--text); font-weight:500 }

/* ── News ───────────────────────────────────────────────── */
#news{ padding-top:0 }
.news-head{
  margin-bottom:56px;
  opacity:0; transform:translateY(24px);
  transition:opacity .8s var(--ease), transform .8s var(--ease);
}
.news-head.in{ opacity:1; transform:none }

.news-list{ border-top:1px solid var(--border) }
.news-item{
  display:grid; grid-template-columns:130px 1fr; gap:40px;
  padding:30px 4px; border-bottom:1px solid var(--border);
  align-items:start;
  opacity:0; transform:translateY(20px);
  transition:opacity .7s var(--ease), transform .7s var(--ease);
}
.news-item.in{ opacity:1; transform:none }
.news-item--more{ display:none }

.news-date{
  font-family:var(--font-en);
  font-size:13px; font-weight:500; letter-spacing:.06em;
  color:var(--text-faint); padding-top:3px;
}
.news-meta{ display:flex; flex-direction:column; align-items:flex-start; gap:10px }
.news-cat{
  font-size:11px; font-weight:600; letter-spacing:.08em;
  color:var(--accent); background:var(--accent-soft);
  padding:4px 11px; border-radius:999px; white-space:nowrap;
}
.news-title{
  font-size:17px; font-weight:600; letter-spacing:.02em;
  line-height:1.6; color:var(--text);
}
.news-title--link{
  display:inline-flex; align-items:center; gap:7px;
  transition:color .25s var(--ease);
}
.news-extlink-icon{
  width:14px; height:14px; flex:none;
  opacity:.55; transition:opacity .25s var(--ease);
}
.news-title--link:hover{ color:var(--accent) }
.news-title--link:hover .news-extlink-icon{ opacity:1 }
.news-text{
  margin-top:10px;
  color:var(--text-muted);
  font-size:14.5px; line-height:1.95;
  white-space:pre-line;
  max-width:60ch;
}

.news-more-wrap{ text-align:center; margin-top:52px }
.news-more{
  display:inline-flex; align-items:center; gap:10px;
  font-size:13px; font-weight:600; letter-spacing:.08em;
  color:var(--text);
  padding:15px 34px; border:1px solid var(--border); border-radius:2px;
  transition:border-color .3s var(--ease), color .3s var(--ease), background .3s var(--ease);
}
.news-more:hover{ border-color:var(--accent); color:var(--accent); background:var(--accent-soft) }
.news-more[hidden]{ display:none }

/* ── About ──────────────────────────────────────────────── */
.about-grid{
  display:grid; grid-template-columns:1fr 1.4fr; gap:80px;
  align-items:start;
}
.about-table{
  width:100%; border-top:1px solid var(--border);
}
.about-table .row{
  display:grid; grid-template-columns:200px 1fr;
  padding:28px 4px;
  border-bottom:1px solid var(--border);
  align-items:start;
}
.about-table dt{
  font-size:13px; font-weight:600; letter-spacing:.06em;
  color:var(--text);
}
.about-table dt small{
  display:block; font-family:var(--font-en); font-size:10px; font-weight:500;
  letter-spacing:.2em; text-transform:uppercase; color:var(--text-faint);
  margin-top:6px;
}
.about-table dd{
  font-size:15px; color:var(--text); line-height:1.8;
}
.about-table dd .sub{ display:block; color:var(--text-muted); font-size:13px; margin-top:4px }

/* ── Contact ────────────────────────────────────────────── */
.contact-wrap{
  display:grid; grid-template-columns:1fr 1.3fr; gap:96px;
  align-items:start;
}
.contact-side .lead{
  color:var(--text-muted); font-size:15px; line-height:2.0;
  margin-top:24px; max-width:34ch;
}
.contact-side .meta{
  margin-top:48px; padding-top:32px; border-top:1px solid var(--border);
  display:flex; flex-direction:column; gap:24px;
}
.contact-side .meta div{ font-size:14px }
.contact-side .meta dt{
  font-family:var(--font-en); font-size:10px; font-weight:500;
  letter-spacing:.22em; text-transform:uppercase; color:var(--text-faint);
  margin-bottom:6px;
}

form.contact{ display:flex; flex-direction:column; gap:28px }
.field label{
  display:flex; align-items:center; gap:10px;
  font-size:12px; font-weight:600; letter-spacing:.08em;
  color:var(--text); margin-bottom:10px;
}
.field label .req{
  font-family:var(--font-en); font-size:9px; font-weight:600;
  letter-spacing:.14em; padding:3px 7px; border-radius:999px;
  background:var(--accent-soft); color:var(--accent);
}
.field input, .field textarea{
  width:100%;
  border:0; border-bottom:1px solid var(--border);
  padding:12px 2px;
  background:transparent;
  font-size:15px; color:var(--text);
  transition:border-color .25s var(--ease);
  outline:none;
}
.field textarea{ resize:vertical; min-height:140px }
.field input:focus, .field textarea:focus{ border-bottom-color:var(--accent) }
.field.optional label .req{
  background:transparent; color:var(--text-faint);
  border:1px solid var(--border);
}

.field .error-msg{
  display:none;
  font-size:12px; color:#c44d4d; margin-top:6px;
}
.field.has-error .error-msg{ display:block }
.field.has-error input,
.field.has-error textarea{ border-bottom-color:#c44d4d }

.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:32px }

button.submit{
  align-self:flex-start; margin-top:16px;
  display:inline-flex; align-items:center; gap:14px;
  padding:18px 32px; background:var(--text); color:#fff;
  font-size:13px; font-weight:600; letter-spacing:.1em;
  border-radius:2px;
  transition:background .3s var(--ease), transform .3s var(--ease), gap .3s var(--ease);
}
button.submit:hover{ background:var(--accent); gap:22px }
button.submit .arrow{ width:18px; height:1px; background:#fff; position:relative; transition:width .3s var(--ease) }
button.submit .arrow::after{
  content:""; position:absolute; right:-1px; top:-3px;
  width:8px; height:8px; border-top:1px solid #fff; border-right:1px solid #fff;
  transform:rotate(45deg);
}
button.submit:hover .arrow{ width:26px }

/* ── Form success message ───────────────────────────────── */
.form-success{
  display:none;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:80px 32px;
  gap:16px;
}
.form-success.show{ display:flex }
.form-success h3{
  font-size:20px;
  font-weight:600;
  color:var(--text);
}
.form-success p{
  color:var(--text-muted);
  font-size:14px;
  line-height:1.8;
}

/* ── Footer ─────────────────────────────────────────────── */
footer.site-footer{
  background:var(--bg-deep); color:rgba(255,255,255,.78);
  padding:100px 0 36px;
}
.footer-top{
  display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:48px;
  padding-bottom:80px; border-bottom:1px solid rgba(255,255,255,.1);
}
.footer-brand{
  font-family:var(--font-en); font-size:32px; font-weight:600; color:#fff;
  letter-spacing:.02em; margin-bottom:18px;
}
.footer-tag{ font-size:13px; line-height:1.9; color:rgba(255,255,255,.6); max-width:30ch }
.footer-col h4{
  font-family:var(--font-en); font-size:11px; font-weight:500;
  letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.5);
  margin-bottom:20px;
}
.footer-col ul{ list-style:none; display:flex; flex-direction:column; gap:12px }
.footer-col a{ font-size:14px; color:rgba(255,255,255,.85); transition:color .25s var(--ease) }
.footer-col a:hover{ color:var(--accent) }
.footer-bottom{
  display:flex; justify-content:center; align-items:center;
  padding-top:36px; font-size:11px; color:rgba(255,255,255,.45);
  font-family:var(--font-en); letter-spacing:.08em;
}

/* ── Hamburger & Mobile Menu ─────────────────────────────── */
.hamburger{
  display:none;
  flex-direction:column; justify-content:center; align-items:center;
  width:40px; height:40px; gap:5px;
  position:relative; z-index:200;
}
.hamburger span{
  display:block; width:20px; height:1.5px;
  background:currentColor;
  transition:transform .3s var(--ease), opacity .3s var(--ease);
}
.hamburger.open span:nth-child(1){ transform:translateY(6.5px) rotate(45deg) }
.hamburger.open span:nth-child(2){ opacity:0 }
.hamburger.open span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg) }

.mobile-menu{
  position:fixed; inset:0; z-index:90;
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden;
  transition:opacity .35s var(--ease), visibility .35s var(--ease);
}
.mobile-menu.open{ opacity:1; visibility:visible }
.site-header.menu-open{ color:var(--text) }
.site-header.menu-open .brand::before{ background:var(--accent) }
.mobile-menu__nav{
  display:flex; flex-direction:column; align-items:center; gap:36px;
}
.mobile-menu__nav a{
  font-size:18px; font-weight:500; letter-spacing:.06em;
  color:var(--text);
  transition:color .25s var(--ease);
}
.mobile-menu__nav a:hover{ color:var(--accent) }

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 960px){
  section.block{ padding:56px 0 }
  .biz-item{ grid-template-columns:1fr; gap:32px }
  .biz-item.reverse{ direction:ltr }
  .biz-list{ gap:72px }
  .biz-media{ aspect-ratio:4 / 3 }
  .biz-meta{ gap:24px 32px }
  .news-item{ grid-template-columns:1fr; gap:10px; padding:24px 2px }
  .news-meta{ flex-direction:row; align-items:center; gap:12px }
  .news-date{ padding-top:0 }
  .news-head{ margin-bottom:40px }
  .about-grid{ grid-template-columns:1fr; gap:48px }
  .about-table .row{ grid-template-columns:140px 1fr; padding:20px 2px }
  .contact-wrap{ grid-template-columns:1fr; gap:40px }
  .contact-side .lead{ max-width:none }
  .form-row{ grid-template-columns:1fr; gap:28px }
  button.submit{ align-self:stretch; justify-content:center }
  .footer-top{ grid-template-columns:1fr; gap:32px; padding-bottom:48px }
  .footer-col ul{ flex-direction:row; flex-wrap:wrap; gap:8px 20px }
  .footer-col{ border-bottom:1px solid rgba(255,255,255,.08); padding-bottom:20px }
  .footer-col:last-child{ border-bottom:none; padding-bottom:0 }
  .nav{ display:none }
  .hamburger{ display:flex }
  .container{ padding:0 20px }
  .hero__scroll{ display:none }
  .hero__inner{ padding-bottom:140px }
}
