:root {
    --black: #080808;
    --silver: #a8a090;
    --silver-light: #c8bfb0;
    --silver-dim: #6a6258;
    --white: #f0ede8;
  }
  *, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
  html { scroll-behavior:smooth; }
  body { background:var(--black); color:var(--white); font-family:'Cormorant Garamond','Noto Serif JP',serif; overflow-x:hidden; }

  /* NAV */
  #mainNav {
    position:fixed; top:0; left:0; right:0; z-index:100;
    display:flex; align-items:center; justify-content:space-between;
    padding:20px 48px;
    background:linear-gradient(to bottom,rgba(8,8,8,.9) 0%,transparent 100%);
    transition:background .4s, padding .4s;
  }
  #mainNav.scrolled { background:rgba(8,8,8,.96); border-bottom:1px solid rgba(168,160,144,.12); padding:14px 48px; }
  .nav-logo { height:52px; opacity:.95; transition:opacity .3s; flex-shrink:0;  }
  .nav-logo:hover { opacity:1; }
  .nav-links { display:flex; flex-direction:row; align-items:center; gap:36px; list-style:none; }
  .nav-links a { font-family:'Cinzel',serif; font-size:10px; letter-spacing:.22em; color:var(--silver); text-decoration:none; position:relative; transition:color .3s; }
  .nav-links a::after { content:''; position:absolute; bottom:-4px; left:0; width:0; height:1px; background:var(--silver-light); transition:width .3s; }
  .nav-links a:hover { color:var(--white); }
  .nav-links a:hover::after { width:100%; }

  /* HERO */
  #hero {
    position:relative; height:100vh;
    display:flex; align-items:center; justify-content:center;
    overflow:hidden;
  }
  .hero-bg {
    position:absolute; inset:0;
    background-image:url('img/image_01.jpg');
    background-size:cover; background-position:center 30%;
  }
  .hero-overlay {
    position:absolute; inset:0;
    background:linear-gradient(to bottom, rgba(8,8,8,.3) 0%, rgba(8,8,8,.5) 40%, rgba(8,8,8,.85) 75%, rgba(8,8,8,.98) 100%);
  }
  .hero-grid {
    position:absolute; inset:0; z-index:1;
    background:
      linear-gradient(to right,transparent 49.85%,rgba(168,160,144,.03) 49.85%,rgba(168,160,144,.03) 50.15%,transparent 50.15%),
      linear-gradient(to bottom,transparent 49.85%,rgba(168,160,144,.03) 49.85%,rgba(168,160,144,.03) 50.15%,transparent 50.15%);
  }
  .hero-content {
    position:relative; z-index:2; text-align:center;
    animation:fadeUp 1.8s ease forwards;
  }
  @keyframes fadeUp { from{opacity:0;transform:translateY(28px)} to{opacity:1;transform:translateY(0)} }
  .hero-eyebrow { font-family:'Cinzel',serif; font-size:10px; letter-spacing:.55em; color:rgba(168,160,144,.7); margin-bottom:36px; animation:fadeUp 1.8s .3s ease both; }
  .hero-logo-wrap { margin-bottom:40px; display:inline-block; position:relative; animation:fadeUp 1.8s .4s ease both; }
  .hero-logo-wrap::before { content:''; position:absolute; inset:-50px; background:radial-gradient(ellipse,rgba(168,160,144,.07) 0%,transparent 70%); }
  .hero-logo { width:230px; filter:drop-shadow(0 0 40px rgba(168,160,144,.2)); animation:logoPulse 5s ease-in-out infinite; }
  @keyframes logoPulse { 0%,100%{filter:drop-shadow(0 0 28px rgba(168,160,144,.12))} 50%{filter:drop-shadow(0 0 55px rgba(168,160,144,.28))} }
  .hero-title { font-family:'Cinzel',serif; font-size:clamp(34px,5vw,60px); letter-spacing:.2em; color:var(--white); font-weight:400; animation:fadeUp 1.8s .55s ease both; }
  .hero-philosophy { font-family:'Noto Serif JP',serif; font-size:clamp(14px,1.6vw,19px); letter-spacing:.35em; color:rgba(168,160,144,.85); margin-top:20px; font-weight:200; animation:fadeUp 1.8s .7s ease both; }
  .hero-scroll { position:absolute; bottom:44px; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:10px; opacity:.4; animation:fadeUp 2s 1.2s ease both; }
  .hero-scroll span { font-family:'Cinzel',serif; font-size:9px; letter-spacing:.45em; color:var(--silver); }
  .scroll-line { width:1px; height:48px; background:linear-gradient(to bottom,var(--silver),transparent); animation:scrollAnim 2.2s ease-in-out infinite; }
  @keyframes scrollAnim { 0%{transform:scaleY(0);transform-origin:top} 50%{transform:scaleY(1);transform-origin:top} 51%{transform-origin:bottom} 100%{transform:scaleY(0);transform-origin:bottom} }

  /* COMMON */
  section { position:relative; z-index:2; }
  .section-label { font-family:'Cinzel',serif; font-size:9px; letter-spacing:.55em; color:var(--silver-dim); display:block; margin-bottom:14px; }
  .section-title { font-family:'Cinzel',serif; font-size:clamp(24px,3vw,38px); letter-spacing:.15em; color:var(--white); font-weight:400; }
  .section-line { width:52px; height:1px; margin:20px auto 0; background:linear-gradient(to right,transparent,var(--silver),transparent); }
  .section-header { text-align:center; margin-bottom:76px; }
  .hr-deco { border:none; border-top:1px solid rgba(168,160,144,.09); max-width:1100px; margin:0 auto; }
  .reveal { opacity:0; transform:translateY(34px); transition:opacity .9s ease,transform .9s ease; }
  .reveal.visible { opacity:1; transform:translateY(0); }
  .d1{transition-delay:.12s} .d2{transition-delay:.24s} .d3{transition-delay:.36s}

  /* PHILOSOPHY */
  #philosophy { padding:150px 0; background:var(--black); }
  .philosophy-inner { max-width:860px; margin:0 auto; padding:0 40px; text-align:center; }
  .blade-main { font-family:'Noto Serif JP',serif; font-size:clamp(30px,5vw,54px); font-weight:200; letter-spacing:.3em; color:var(--white); margin-bottom:16px; }
  .blade-main em { font-style:normal; color:var(--silver-light); border-bottom:1px solid rgba(168,160,144,.4); }
  .blade-en { font-family:'Cinzel',serif; font-size:10px; letter-spacing:.6em; color:var(--silver-dim); display:block; margin-bottom:60px; }
  .deco-line { display:flex; align-items:center; gap:18px; margin:0 auto 56px; max-width:300px; }
  .deco-line::before,.deco-line::after { content:''; flex:1; height:1px; background:linear-gradient(to right,transparent,rgba(168,160,144,.3)); }
  .deco-line::after { background:linear-gradient(to left,transparent,rgba(168,160,144,.3)); }
  .deco-line span { width:6px; height:6px; background:var(--silver-dim); transform:rotate(45deg); display:block; flex-shrink:0; }
  .philosophy-desc { font-size:15px; line-height:2.5; color:var(--silver); font-weight:300; letter-spacing:.06em; }

  /* ABOUT */
  #about { padding:150px 0; background:linear-gradient(180deg,#080808 0%,#0e0c0a 50%,#080808 100%); }
  .about-grid { max-width:1100px; margin:0 auto; padding:0 60px; display:grid; grid-template-columns:1fr; gap:90px; align-items:center; max-width:700px; }
  .about-logo-display { width:100%; max-width:380px; display:block; margin:0 auto;  }
  .about-text h2 { font-family:'Cinzel',serif; font-size:clamp(24px,3vw,36px); letter-spacing:.1em; color:var(--white); font-weight:400; margin-bottom:8px; }
  .about-en { font-size:10px; letter-spacing:.45em; color:var(--silver-dim); font-family:'Cinzel',serif; margin-bottom:38px; display:block; }
  .about-text p { font-size:15px; line-height:2.3; color:var(--silver); font-weight:300; letter-spacing:.05em; margin-bottom:18px; }
  .service-list { margin-top:40px; padding-top:32px; border-top:1px solid rgba(168,160,144,.12); display:flex; flex-direction:column; gap:14px; }
  .service-item { display:flex; align-items:center; gap:16px; font-family:'Cinzel',serif; font-size:12px; letter-spacing:.2em; color:var(--silver-light); }
  .service-item::before { content:''; width:18px; height:1px; background:var(--silver-dim); flex-shrink:0; }

  /* COMPANY */
  #company { padding:150px 0; background:var(--black); }
  .company-table { max-width:800px; margin:0 auto; padding:0 60px; }
  .company-row { display:grid; grid-template-columns:200px 1fr; border-bottom:1px solid rgba(168,160,144,.09); padding:26px 0; align-items:center; transition:background .3s; }
  .company-row:first-child { border-top:1px solid rgba(168,160,144,.09); }
  .company-row:hover { background:rgba(168,160,144,.02); }
  .company-label { font-family:'Cinzel',serif; font-size:9px; letter-spacing:.35em; color:var(--silver-dim); }
  .company-value { font-size:16px; color:var(--silver-light); letter-spacing:.07em; font-weight:300; }
  .company-value.large { font-family:'Cinzel',serif; font-size:20px; letter-spacing:.14em; color:var(--white); }
  .company-value a { color:var(--silver-light); text-decoration:none; transition:color .3s; }
  .company-value a:hover { color:var(--white); }

  /* MESSAGE */
  #message { padding:150px 0; background:linear-gradient(180deg,#080808 0%,#0a0908 100%); }
  .message-inner { max-width:1100px; margin:0 auto; padding:0 60px; display:grid; grid-template-columns:340px 1fr; gap:90px; align-items:start; }
  .portrait-frame { width:100%; aspect-ratio:3/4; background:linear-gradient(135deg,#1c1915 0%,#0d0b09 100%); border:1px solid rgba(168,160,144,.13); display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
  .portrait-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center top; }
  .portrait-frame::before { content:''; position:absolute; top:14px; right:14px; bottom:14px; left:14px; border:1px solid rgba(168,160,144,.06); }
  .portrait-initials { font-family:'Cinzel',serif; font-size:68px; color:rgba(168,160,144,.06); letter-spacing:.1em; }
  .portrait-plate { position:absolute; bottom:-1px; left:-1px; right:-1px; background:linear-gradient(to top,rgba(8,8,8,.97) 60%,transparent); padding:46px 26px 24px; text-align:center; }
  .portrait-plate h3 { font-family:'Cinzel',serif; font-size:16px; letter-spacing:.2em; color:var(--white); font-weight:400; margin-bottom:6px; }
  .portrait-plate span { font-size:10px; letter-spacing:.35em; color:var(--silver-dim); font-family:'Cinzel',serif; }
  .msg-h2 { font-family:'Cinzel',serif; font-size:clamp(22px,2.5vw,32px); letter-spacing:.12em; color:var(--white); font-weight:400; margin-bottom:8px; line-height:1.5; }
  .msg-sub { font-size:10px; letter-spacing:.45em; color:var(--silver-dim); font-family:'Cinzel',serif; margin-bottom:46px; display:block; }
  .msg-p { font-size:15px; line-height:2.5; color:var(--silver); font-weight:300; letter-spacing:.06em; margin-bottom:20px; }
  .msg-sign { margin-top:52px; padding-top:28px; border-top:1px solid rgba(168,160,144,.1); display:flex; justify-content:flex-end; }
  .sign-title { font-family:'Cinzel',serif; font-size:9px; letter-spacing:.38em; color:var(--silver-dim); margin-bottom:9px; display:block; }
  .sign-en { font-family:'Cormorant Garamond',serif; font-size:26px; font-style:italic; color:var(--silver-light); letter-spacing:.08em; font-weight:300; }
  .sign-jp { font-size:15px; color:var(--silver); letter-spacing:.18em; margin-top:5px; font-family:'Noto Serif JP',serif; font-weight:200; }

  /* CONTACT */
  #contact { padding:150px 0; background:var(--black); text-align:center; }
  .contact-inner { max-width:560px; margin:0 auto; padding:0 40px; }
  .contact-inner > p { font-size:15px; line-height:2.3; color:var(--silver); margin-bottom:18px; letter-spacing:.06em; }
  .contact-items { margin:46px 0 56px; display:flex; flex-direction:column; gap:18px; }
  .contact-item { display:flex; align-items:center; justify-content:center; gap:18px; }
  .ci-label { font-family:'Cinzel',serif; font-size:9px; letter-spacing:.4em; color:var(--silver-dim); min-width:56px; text-align:right; }
  .ci-val { font-size:16px; color:var(--silver-light); letter-spacing:.07em; }
  .ci-val a { color:inherit; text-decoration:none; transition:color .3s; }
  .ci-val a:hover { color:var(--white); }
  .ci-div { width:1px; height:14px; background:rgba(168,160,144,.3); }

  /* FOOTER */
  footer { background:#040404; border-top:1px solid rgba(168,160,144,.09); padding:76px 60px 38px; z-index:2; position:relative; }
  .footer-inner { max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr 1fr; gap:56px; margin-bottom:56px; }
  .footer-brand img { height:52px; margin-bottom:16px; opacity:.82; display:block;  }
  .footer-brand p { font-size:11px; color:var(--silver-dim); line-height:1.9; letter-spacing:.06em; }
  .footer-nav h4,.footer-info h4 { font-family:'Cinzel',serif; font-size:8px; letter-spacing:.5em; color:var(--silver-dim); margin-bottom:20px; }
  .footer-nav ul { list-style:none; display:flex; flex-direction:column; gap:12px; }
  .footer-nav a { font-family:'Cinzel',serif; font-size:11px; letter-spacing:.22em; color:var(--silver); text-decoration:none; transition:color .3s; }
  .footer-nav a:hover { color:var(--white); }
  .footer-info p { font-size:12px; color:var(--silver); line-height:2.1; letter-spacing:.06em; }
  .footer-info a { color:var(--silver); text-decoration:none; transition:color .3s; }
  .footer-info a:hover { color:var(--white); }
  .footer-bottom { max-width:1100px; margin:0 auto; padding-top:28px; border-top:1px solid rgba(168,160,144,.07); display:flex; justify-content:space-between; align-items:center; }
  .footer-bottom p { font-family:'Cinzel',serif; font-size:8px; letter-spacing:.3em; color:var(--silver-dim); }

  @media(max-width:900px){
    #mainNav{padding:20px 24px;} #mainNav.scrolled{padding:13px 24px;}
    .nav-links{gap:20px;}
    .about-grid,.message-inner{grid-template-columns:1fr;gap:56px;padding:0 28px;}
    .footer-inner{grid-template-columns:1fr;gap:36px;}
    .footer-bottom{flex-direction:column;gap:10px;}
    .company-table{padding:0 28px;}
    .contact-item{flex-direction:column;gap:8px;} .ci-div{display:none;}
  }