:root{
  --gold:#b78624;
  --gold-light:#d8ad52;
  --ink:#19150e;
  --paper:#fffdf9;
  --line:#dfc38a;
  --black:#080807;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  background:var(--paper);
  font-family:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  line-height:1.8;
  letter-spacing:.03em;
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,textarea{font:inherit}

/* Header — clean white background; logo stays fully inside the header */
.site-header{
  height:110px;
  padding:0 clamp(24px,4vw,64px) 0 clamp(238px,19vw,292px);
  display:flex;
  align-items:center;
  justify-content:flex-end;
  background:#fff;
  position:relative;
  z-index:30;
  box-shadow:0 2px 12px rgba(0,0,0,.06);
}
.brand{
  position:absolute;
  left:clamp(30px,4.5vw,74px);
  top:50%;
  width:190px;
  height:104px;
  z-index:35;
  display:flex;
  align-items:center;
  justify-content:center;
  transform:translateY(-50%);
}
.brand-logo{
  width:184px;
  height:100px;
  object-fit:contain;
  filter:none;
}
.site-nav{
  display:flex;
  align-items:center;
  gap:clamp(26px,3vw,48px);
  font-family:Georgia,"Times New Roman",serif;
  font-size:15px;
}
.site-nav a{position:relative;padding:31px 0 25px}
.site-nav a::after{
  content:"";position:absolute;left:0;right:0;bottom:16px;height:2px;
  background:var(--gold);transform:scaleX(0);transition:.25s
}
.site-nav a:hover::after,.site-nav a.active::after{transform:scaleX(1)}
.language{font-size:14px;white-space:nowrap}
.menu-button{display:none;border:0;background:none;width:42px;height:42px}
.menu-button span{display:block;height:1px;background:#111;margin:10px 0}

/* Hero — brighter image while retaining the dark copy panel */
.hero{
  position:relative;
  min-height:560px;
  height:calc(100vh - 110px);
  max-height:720px;
  background:var(--black);
  overflow:hidden;
}
.hero-image{
  position:absolute;
  inset:0;
  background:url("hero-sakura-plate.jpg") 59% center/cover no-repeat;
  filter:brightness(1.18) saturate(1.04) contrast(1.02);
  transform:scale(1.01);
}
.hero-shade{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,#070707 0%,#070707 21%,rgba(7,7,7,.88) 33%,rgba(7,7,7,.25) 55%,rgba(7,7,7,.02) 78%),
    linear-gradient(0deg,rgba(0,0,0,.10),rgba(0,0,0,0) 45%);
}
.hero-copy{
  position:absolute;
  left:clamp(68px,6vw,112px);
  top:51%;
  transform:translateY(-50%);
  color:#fff;
  z-index:2;
}
.hero h1{
  margin:0;
  font-weight:400;
  font-size:clamp(42px,4.8vw,70px);
  line-height:1.55;
  letter-spacing:.08em;
  text-shadow:0 2px 14px rgba(0,0,0,.36);
}
.hero-ornament{margin-top:24px;width:310px;height:18px;position:relative}
.hero-ornament::before,.hero-ornament::after{
  content:"";position:absolute;top:8px;height:1px;background:var(--gold);width:43%
}
.hero-ornament::before{left:0}.hero-ornament::after{right:0}
.hero-ornament span,.hero-ornament span::before,.hero-ornament span::after{
  position:absolute;width:9px;height:9px;border:1px solid var(--gold);transform:rotate(45deg)
}
.hero-ornament span{left:50%;top:4px;margin-left:-5px}
.hero-ornament span::before{content:"";left:-11px;top:10px}
.hero-ornament span::after{content:"";left:10px;top:-11px}

.section{padding:26px clamp(28px,5vw,72px)}
.section-inner{max-width:1460px;margin:0 auto}
.section-label{
  margin:0 0 10px;color:var(--gold);
  font-family:Georgia,"Times New Roman",serif;font-size:20px;letter-spacing:.05em
}
.section-label::after{
  content:"";display:inline-block;width:42px;height:1px;margin-left:14px;
  vertical-align:middle;background:var(--gold)
}
.section-label.centered{text-align:center}
.section-label.centered::after{display:none}

/* About — wider text column to prevent awkward wrapping */
.about{padding-top:30px;padding-bottom:18px}
.about-grid{
  display:grid;
  grid-template-columns:minmax(0,66%) minmax(260px,34%);
  align-items:center;
  min-height:300px
}
.about-copy{padding-right:54px;max-width:980px}
.about h2{
  margin:8px 0 14px;
  font-weight:400;
  font-size:clamp(28px,2.7vw,42px);
  line-height:1.5
}
.about p{
  font-size:16px;
  margin:8px 0;
  line-height:1.9;
  word-break:normal;
  overflow-wrap:anywhere;
}
.about-decoration{height:280px;background:url("about-gold-decoration.jpg") center/contain no-repeat}

.business{padding-top:8px;padding-bottom:24px;border-top:1px solid #ead8b3}
.business-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.business-card{padding:0 42px 10px;text-align:center;border-right:1px solid var(--line)}
.business-card:last-child{border-right:0}
.business-card h3{font-size:20px;margin:8px 0 6px;line-height:1.55}
.business-card p{
  font-size:14px;
  margin:0 auto;
  line-height:1.85;
  max-width:270px;
}
.icon{width:64px;height:64px;margin:0 auto;color:var(--gold);position:relative}
.icon-vase::before{
  content:"";position:absolute;left:19px;top:4px;width:27px;height:54px;
  border:3px solid currentColor;border-radius:7px 7px 15px 15px;
  clip-path:polygon(20% 0,80% 0,80% 15%,100% 30%,88% 100%,12% 100%,0 30%,20% 15%)
}
.icon-globe{border:2px solid currentColor;border-radius:50%}
.icon-globe::before{
  content:"";position:absolute;left:20px;right:20px;top:5px;bottom:5px;
  border-left:2px solid currentColor;border-right:2px solid currentColor;border-radius:50%
}
.icon-globe::after{
  content:"";position:absolute;left:5px;right:5px;top:30px;height:2px;background:currentColor;
  box-shadow:0 -13px 0 rgba(183,134,36,.65),0 13px 0 rgba(183,134,36,.65)
}
.icon-box::before{
  content:"";position:absolute;left:13px;top:15px;width:39px;height:36px;
  border:2px solid currentColor;transform:skewY(-12deg)
}
.icon-box::after{
  content:"";position:absolute;left:32px;top:15px;width:2px;height:36px;
  background:currentColor;transform:rotate(-12deg)
}

/* Company — expanded table; business content remains three clean lines */
.company{padding-top:8px;padding-bottom:24px;border-top:1px solid #ead8b3}
.company-grid{
  display:grid;
  grid-template-columns:minmax(620px,60%) minmax(280px,40%);
  gap:28px;
  align-items:center
}
.company-table{
  margin:0;
  width:100%;
  background:#090909;
  color:#fff;
  border:1px solid var(--gold);
  font-size:16px;
}
.company-table div{
  display:grid;
  grid-template-columns:150px minmax(0,1fr);
  border-bottom:1px solid rgba(183,134,36,.65)
}
.company-table div:last-child{border-bottom:0}
.company-table dt,.company-table dd{padding:9px 18px;line-height:1.7}
.company-table dt{
  color:var(--gold-light);
  border-right:1px solid rgba(183,134,36,.65);
  white-space:nowrap;
}
.company-table dd{margin:0;overflow-wrap:anywhere}
.company-table dd br{display:block}
.map-decoration{
  height:300px;
  background:url("japan-map.png") center/contain no-repeat
}

.contact{padding-top:8px;padding-bottom:12px;border-top:1px solid #ead8b3}
.contact-grid{display:grid;grid-template-columns:30% 70%;gap:38px;align-items:center}
.contact-copy{font-size:18px;line-height:1.7}
.contact-form{display:grid;gap:12px}
.honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.contact-form input,.contact-form textarea{
  width:100%;padding:14px 16px;border:1px solid #d6d6d6;background:#fff;color:#222;border-radius:3px
}
.contact-form textarea{resize:vertical}
.contact-form button{
  width:330px;max-width:100%;justify-self:center;border:0;border-radius:3px;
  padding:13px 24px;color:#fff;cursor:pointer;
  background:linear-gradient(90deg,#b47b12,#d09a2b,#b47b12)
}

.site-footer{background:#070707;color:#e7d5a6;padding:18px clamp(28px,5vw,70px)}
.footer-inner{max-width:1460px;margin:auto;display:grid;grid-template-columns:1.4fr 1fr auto;gap:30px;align-items:center}
.footer-brand{display:flex;align-items:center;gap:16px}
.footer-brand img{width:76px;height:76px;object-fit:contain}
.footer-brand strong{color:#d7a63d;font-size:18px;font-weight:400}
.footer-brand p{margin:0;font-size:12px}
.copyright{font-size:12px;text-align:center}
.site-footer a{color:#d7a63d;text-decoration:underline}

.reveal{opacity:0;transform:translateY(18px);transition:.7s ease}
.reveal.visible{opacity:1;transform:none}

@media(max-width:1080px){
  .site-header{padding-left:220px}
  .brand{left:24px;width:170px;height:100px}
  .brand-logo{width:166px;height:96px}
  .site-nav{gap:24px;font-size:14px}
  .company-grid{grid-template-columns:minmax(520px,58%) 42%}
}
@media(max-width:900px){
  .site-header{height:78px;padding:0 18px;justify-content:space-between}
  .brand{position:static;width:142px;height:78px;transform:none}
  .brand-logo{width:142px;height:76px;filter:none}
  .menu-button{display:block;z-index:25}
  .site-nav{
    position:fixed;inset:0;background:rgba(255,255,255,.98);
    flex-direction:column;justify-content:center;gap:18px;
    opacity:0;visibility:hidden;transition:.25s
  }
  .site-nav.open{opacity:1;visibility:visible}
  .site-nav a{padding:10px}
  .hero{height:650px;min-height:0}
  .hero-image{background-position:61% center;filter:brightness(1.13) saturate(1.03)}
  .hero-shade{background:linear-gradient(90deg,rgba(0,0,0,.82),rgba(0,0,0,.25))}
  .hero-copy{left:28px;right:20px;top:50%}
  .hero h1{font-size:42px}
  .about-grid,.company-grid,.contact-grid{grid-template-columns:1fr}
  .about-copy{padding-right:0}
  .about-decoration{display:none}
  .pc-br{display:none}
  .business-grid{grid-template-columns:1fr}
  .business-card{border-right:0;border-bottom:1px solid var(--line);padding:26px 16px}
  .business-card:last-child{border-bottom:0}
  .company-grid{gap:20px}
  .map-decoration{height:250px}
  .contact-grid{gap:10px}
  .form-row{grid-template-columns:1fr}
  .footer-inner{grid-template-columns:1fr;text-align:center}
  .footer-brand{justify-content:center}
}
@media(max-width:540px){
  .hero{height:580px}
  .hero-image{background-position:64% center}
  .hero h1{font-size:36px}
  .hero-ornament{width:230px}
  .section{padding-left:20px;padding-right:20px}
  .section-label{font-size:19px}
  .about h2{font-size:29px}
  .about p{font-size:14px}
  .company-table{font-size:13px}
  .company-table div{grid-template-columns:92px minmax(0,1fr)}
  .company-table dt,.company-table dd{padding:8px 10px}
  .footer-brand{align-items:flex-start}
  .footer-brand img{width:60px;height:60px}
}
