:root{
  --black:#11100c;
  --deep:#060606;
  --paper:#f5f3ee;
  --white:#fff;
  --glow:#fffdf4;
  --halo:#f3e9ce;
  --pad:clamp(22px,4.1vw,72px);
  --ease:cubic-bezier(.22,.72,.24,1);
  --serif:"Noto Serif CJK JP","Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP",serif;
  --sans:"Noto Sans CJK JP","Helvetica Neue","Hiragino Sans","Yu Gothic","YuGothic",Arial,sans-serif;
}
*{box-sizing:border-box}
html{background:#000;scroll-behavior:smooth}
body{margin:0;background:#000;color:#fff;font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video,canvas,svg{display:block}
a{color:inherit;text-decoration:none}
button{font:inherit}
::selection{background:#fff;color:#000}
.noise{
  position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.027;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.78'/%3E%3C/svg%3E");
  mix-blend-mode:soft-light
}
.header{
  position:fixed;z-index:120;left:0;right:0;top:0;height:84px;padding:12px var(--pad);
  display:flex;align-items:center;justify-content:space-between;color:#fff;
  opacity:0;transform:translateY(-7px);transition:opacity .8s 3.25s var(--ease),transform .8s 3.25s var(--ease);
  mix-blend-mode:difference
}
body.ready .header{opacity:1;transform:none}
.headerLogo{width:70px;height:70px;object-fit:contain}
.nav{display:flex;gap:clamp(22px,2.8vw,48px);align-items:center}
.nav a{font-size:9px;letter-spacing:.15em;text-transform:uppercase;opacity:.82;position:relative}
.nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-7px;height:1px;background:#fff;transition:right .4s var(--ease)}
.nav a:hover:after{right:0}

/* HERO */
.hero{
  min-height:100svh;position:relative;background:var(--black);overflow:hidden;display:grid;align-items:center;
}
.heroGrid{
  position:absolute;inset:0;opacity:0;transition:opacity .9s 1.72s var(--ease);
  background-image:linear-gradient(rgba(255,255,255,.026) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.026) 1px,transparent 1px);
  background-size:8.5vw 8.5vw;
  mask-image:linear-gradient(to right,transparent 0,rgba(0,0,0,.55) 48%,rgba(0,0,0,.85) 100%)
}
body.ready .heroGrid{opacity:1}
.heroAxisV,.heroAxisH{
  position:absolute;z-index:3;background:rgba(255,247,218,.22);transform-origin:center;
}
.heroAxisV{left:63%;top:54%;width:1px;height:0;transform:translateY(-50%);transition:height .8s 1.65s var(--ease)}
.heroAxisH{left:63%;top:54%;height:1px;width:0;transform:translateX(-50%);transition:width .9s 1.78s var(--ease)}
body.ready .heroAxisV{height:118vh}
body.ready .heroAxisH{width:118vw}

.heroGlow{
  position:absolute;z-index:4;left:63%;top:54%;width:7px;height:7px;border-radius:50%;background:#fff;
  transform:translate(-50%,-50%) scale(.1);opacity:0;
  box-shadow:0 0 10px 3px var(--glow),0 0 85px 28px rgba(243,233,206,.22),0 0 200px 68px rgba(243,233,206,.05);
  transition:opacity .55s .55s ease,transform .7s .55s var(--ease)
}
body.ready .heroGlow{opacity:1;transform:translate(-50%,-50%) scale(1)}
.heroRings{position:absolute;z-index:2;left:63%;top:54%;width:min(46vw,700px);aspect-ratio:1;transform:translate(-50%,-50%);opacity:0;transition:opacity 1.2s 1.75s ease}
body.ready .heroRings{opacity:.58}
.heroRings i{position:absolute;inset:calc(var(--i)*5.1%);border:1px solid rgba(255,255,255,.055);border-radius:50%}
.heroRings:before,.heroRings:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.08);border-radius:50%}
.heroRings:before{inset:16%;border-top-color:rgba(255,239,194,.20)}
.heroRings:after{inset:33%;border-left-color:rgba(255,239,194,.18)}

.heroCoreLogo{
  position:absolute;z-index:8;left:63%;top:54%;width:clamp(115px,9vw,170px);height:clamp(115px,9vw,170px);object-fit:contain;
  transform:translate(-50%,-50%) scale(.94);opacity:0;
  transition:opacity .72s 1.05s var(--ease),transform .82s 1.05s var(--ease);
  mix-blend-mode:screen
}
body.ready .heroCoreLogo{opacity:.97;transform:translate(-50%,-50%) scale(1)}
.heroCoreLogoAura{
  position:absolute;z-index:5;left:63%;top:54%;width:clamp(150px,12vw,230px);height:clamp(150px,12vw,230px);
  transform:translate(-50%,-50%);border-radius:50%;opacity:0;transition:opacity .9s 1.05s ease;
  background:radial-gradient(circle,rgba(255,249,226,.10),rgba(243,233,206,.035) 38%,transparent 72%)
}
body.ready .heroCoreLogoAura{opacity:1}

.heroInner{position:relative;z-index:10;width:min(1540px,100%);margin:auto;padding:120px var(--pad) 100px}
.heroCopy{max-width:min(760px,53vw)}
.heroKicker{margin:0 0 30px;color:#7b7b74;font-size:9px;letter-spacing:.18em;text-transform:uppercase;opacity:0;transform:translateY(7px);transition:opacity .8s 3.15s var(--ease),transform .8s 3.15s var(--ease)}
body.ready .heroKicker{opacity:1;transform:none}
.hero h1{
  margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(58px,6.1vw,102px);line-height:1.16;letter-spacing:.005em;
  opacity:0;clip-path:inset(0 100% 0 0);transition:opacity .15s 2.45s linear,clip-path 1.05s 2.45s var(--ease)
}
body.ready .hero h1{opacity:1;clip-path:inset(0 0 0 0)}
.heroLead{
  margin:32px 0 0;max-width:580px;color:#9b9b94;font-family:var(--serif);font-size:clamp(14px,1.05vw,17px);line-height:2.02;letter-spacing:.02em;
  opacity:0;transform:translateY(8px);transition:opacity .85s 3.2s var(--ease),transform .85s 3.2s var(--ease)
}
body.ready .heroLead{opacity:1;transform:none}
.heroMeta{
  position:absolute;z-index:10;left:var(--pad);right:var(--pad);bottom:28px;display:flex;justify-content:space-between;
  color:#6a6a64;font-size:9px;letter-spacing:.16em;text-transform:uppercase;opacity:0;transition:opacity .8s 3.6s ease
}
body.ready .heroMeta{opacity:1}
.scrollHint{display:flex;align-items:center;gap:12px}
.scrollHint i{display:block;width:56px;height:1px;background:#706f68;position:relative}
.scrollHint i:after{content:"";position:absolute;right:0;top:-2px;width:5px;height:5px;border-radius:50%;background:#fffdf4}

/* BRIDGE — total blackout, no visible movement of the core */
.bridge{height:54vh;background:#000;position:relative;display:grid;place-items:center}
.bridge:before{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,var(--black),#000 45%,#000)}
.bridgeText{position:relative;z-index:2;font-size:9px;letter-spacing:.18em;color:#292929;opacity:.7}

/* PHILOSOPHY */
.philo{height:720vh;background:#000;position:relative}
.philoSticky{height:100svh;position:sticky;top:0;overflow:hidden;background:#000;isolation:isolate}
.scene{position:absolute;inset:-1px;opacity:0;will-change:opacity,transform;overflow:hidden}
.sceneMedia{position:absolute;inset:-3%;width:106%;height:106%;object-fit:cover;filter:brightness(.62) contrast(1.09) saturate(.7)}
.scenePhoto .sceneMedia{filter:grayscale(.65) brightness(.54) contrast(1.18)}
.sceneMaterial .sceneMedia{filter:grayscale(.9) brightness(.62) contrast(1.16)}
.sceneDigital video{position:absolute;inset:-4%;width:108%;height:108%;object-fit:cover;filter:brightness(.48) contrast(1.18) saturate(.45)}
.sceneShade{position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,rgba(0,0,0,0) 0 10%,rgba(0,0,0,.08) 25%,rgba(0,0,0,.48) 76%,rgba(0,0,0,.73) 100%)}
.scenePhoto:after{
  content:"";position:absolute;inset:0;background:
  linear-gradient(115deg,rgba(0,0,0,.75) 0 24%,transparent 53%),
  radial-gradient(circle at 50% 50%,transparent 0 17%,rgba(0,0,0,.36) 78%)
}
.canvasScene{position:absolute;inset:0;width:100%;height:100%}
.organicWash{
  position:absolute;inset:0;background:
  radial-gradient(ellipse at 50% 50%,rgba(255,249,230,.055),transparent 17%),
  radial-gradient(ellipse at 37% 58%,rgba(154,180,189,.07),transparent 37%),
  radial-gradient(ellipse at 68% 41%,rgba(181,154,116,.055),transparent 38%)
}
.materialSplit{
  position:absolute;left:50%;top:0;bottom:0;width:1px;background:rgba(255,255,255,.1)
}
.prism{
  position:absolute;inset:0;overflow:hidden;background:#020304
}
.prismBeam{
  position:absolute;left:50%;top:50%;width:75vw;height:18vw;transform-origin:left center;transform:translateY(-50%) rotate(var(--r));
  clip-path:polygon(0 48%,100% 0,100% 100%,0 52%);
  background:linear-gradient(90deg,rgba(255,255,255,.15),rgba(255,91,76,.22) 18%,rgba(255,217,91,.18) 34%,rgba(102,225,255,.20) 54%,rgba(166,118,255,.18) 72%,transparent 100%);
  filter:blur(.4px);opacity:.56;mix-blend-mode:screen
}
.prismShard{
  position:absolute;left:50%;top:50%;width:clamp(90px,9vw,170px);height:clamp(170px,16vw,300px);
  transform:translate(-50%,-50%) rotate(23deg);border:1px solid rgba(255,255,255,.24);
  clip-path:polygon(50% 0,100% 77%,57% 100%,0 72%);
  background:linear-gradient(135deg,rgba(255,255,255,.04),rgba(91,207,255,.12),rgba(255,149,90,.08),rgba(255,255,255,.02));
  box-shadow:inset 0 0 55px rgba(255,255,255,.055)
}
.digitalPanels{position:absolute;inset:0;perspective:1100px;opacity:.5}
.panel{
  position:absolute;border:1px solid rgba(255,255,255,.12);background:rgba(4,4,4,.68);box-shadow:0 28px 80px rgba(0,0,0,.45);
  backdrop-filter:blur(5px);overflow:hidden
}
.panel:before{content:"";position:absolute;inset:12px;background:linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px);background-size:32px 32px}
.panel.a{width:25vw;height:30vh;left:8vw;top:15vh;transform:rotateY(12deg) rotateZ(-5deg)}
.panel.b{width:27vw;height:35vh;right:8vw;bottom:11vh;transform:rotateY(-13deg) rotateZ(4deg)}
.panel.c{width:22vw;height:25vh;right:12vw;top:10vh;transform:rotateY(-8deg) rotateZ(-2deg)}

.philoDim{position:absolute;inset:0;z-index:40;pointer-events:none;background:#000;opacity:0}
.philoCoreAura{
  position:absolute;z-index:70;left:50%;top:50%;width:clamp(190px,15vw,290px);height:clamp(190px,15vw,290px);
  transform:translate(-50%,-50%);border-radius:50%;
  background:radial-gradient(circle,rgba(255,250,230,.12),rgba(243,233,206,.045) 32%,transparent 72%);
  pointer-events:none
}
.philoGlow{
  position:absolute;z-index:72;left:50%;top:50%;width:8px;height:8px;border-radius:50%;background:#fff;transform:translate(-50%,-50%);
  box-shadow:0 0 12px 3px var(--glow),0 0 95px 30px rgba(243,233,206,.25),0 0 240px 90px rgba(243,233,206,.055);
  pointer-events:none
}
.philoLogo{
  position:absolute;z-index:74;left:50%;top:50%;width:clamp(118px,9.5vw,175px);height:clamp(118px,9.5vw,175px);
  object-fit:contain;transform:translate(-50%,-50%);mix-blend-mode:screen;pointer-events:none
}
.philoRing{
  position:absolute;z-index:68;left:50%;top:50%;width:min(38vw,600px);aspect-ratio:1;transform:translate(-50%,-50%);pointer-events:none;opacity:.4
}
.philoRing i{position:absolute;inset:calc(var(--i)*7.5%);border:1px solid rgba(255,255,255,.055);border-radius:50%}
.philoFinal{
  position:absolute;z-index:90;inset:0;display:grid;place-items:center;text-align:center;background:rgba(0,0,0,.18);
  opacity:0;pointer-events:none
}
.philoFinal h2{
  margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(58px,7.5vw,120px);line-height:1.22;letter-spacing:.01em;
  text-shadow:0 1px 34px rgba(0,0,0,.45)
}
.exitWhite{
  position:absolute;z-index:110;inset:0;background:var(--paper);transform:translateY(100%);will-change:transform
}
.exitDot{position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:50%;background:#111;transform:translate(-50%,-50%)}
.endSpace{height:45vh;background:var(--paper)}

/* custom cursor */
@media(pointer:fine){
  body{cursor:none}
  .cursorDot{position:fixed;z-index:10000;width:5px;height:5px;border-radius:50%;background:#fff;left:0;top:0;pointer-events:none;mix-blend-mode:difference}
  .cursorRing{position:fixed;z-index:9998;width:28px;height:28px;border:1px solid rgba(255,255,255,.46);border-radius:50%;left:0;top:0;pointer-events:none;mix-blend-mode:difference}
}
@media(max-width:850px){
  .header{height:70px}
  .headerLogo{width:55px;height:55px}
  .nav a:not(:last-child){display:none}
  .heroAxisV,.heroGlow,.heroCoreLogo,.heroCoreLogoAura,.heroRings{left:82%}
  .heroAxisH{left:82%;top:60%}
  .heroGlow,.heroCoreLogo,.heroCoreLogoAura,.heroRings{top:60%}
  .heroCopy{max-width:88%}
  .hero h1{font-size:clamp(48px,13.5vw,78px);line-height:1.2}
  .heroLead{font-size:14px}
  .heroMeta span:last-child{display:none}
  .heroRings{width:72vw}
  .philoRing{width:72vw}
  .philoLogo{width:126px;height:126px}
  .panel.a{width:54vw;left:-4vw} .panel.b{width:54vw;right:-5vw} .panel.c{width:48vw;right:1vw}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .header,.heroGrid,.heroAxisV,.heroAxisH,.heroGlow,.heroCoreLogo,.heroCoreLogoAura,.heroRings,.heroKicker,.hero h1,.heroLead,.heroMeta{transition:none!important}
  body.ready .header,body.ready .heroGrid,body.ready .heroGlow,body.ready .heroCoreLogo,body.ready .heroCoreLogoAura,body.ready .heroRings,body.ready .heroKicker,body.ready .heroLead,body.ready .heroMeta{opacity:1!important;transform:none}
  body.ready .hero h1{opacity:1!important;clip-path:none}
  body.ready .heroAxisV{height:118vh} body.ready .heroAxisH{width:118vw}
}

/* SERVICE — locked static master translated to web */
.service{
  min-height:100svh;background:#f5f3ee;color:#111;position:relative;
  display:grid;align-items:center;padding:clamp(92px,10vh,130px) 0 clamp(62px,7vh,96px);
}
.serviceInner{width:min(1540px,100%);margin:auto;padding:0 var(--pad)}
.serviceHead{
  display:flex;align-items:center;justify-content:space-between;margin-bottom:clamp(34px,4vh,54px)
}
.serviceLabel{
  display:flex;align-items:center;gap:22px;font-size:10px;letter-spacing:.25em;color:#222;font-weight:500
}
.serviceLabel i{display:block;width:72px;height:1px;background:#b9aa86;position:relative}
.serviceLabel i:after{
  content:"";position:absolute;right:-2px;top:-2px;width:5px;height:5px;border-radius:50%;
  background:#fffdf4;box-shadow:0 0 12px 3px rgba(205,179,117,.55)
}
.serviceStatement{font-size:10px;letter-spacing:.13em;color:#888078}
.serviceRows{border-top:1px solid rgba(125,111,78,.28)}
.serviceRow{
  display:grid;grid-template-columns:110px minmax(360px,.8fr) 1.2fr;gap:clamp(28px,4vw,72px);
  min-height:clamp(190px,23vh,250px);align-items:center;
  border-bottom:1px solid rgba(125,111,78,.28);position:relative;overflow:hidden
}
.serviceRow:before{
  content:"";position:absolute;left:0;right:100%;bottom:-1px;height:1px;background:#111;
  transition:right .7s var(--ease)
}
.serviceRow:hover:before{right:0}
.serviceNo{
  font-family:var(--serif);font-size:clamp(52px,4.2vw,70px);font-weight:400;line-height:1;
  color:#c9c0ac;letter-spacing:-.035em
}
.serviceName{
  margin:0;font-family:var(--sans);font-size:clamp(42px,4.1vw,70px);font-weight:400;
  letter-spacing:.16em;line-height:.9
}
.serviceCopy h3{
  margin:0 0 14px;font-family:var(--serif);font-weight:500;font-size:clamp(24px,2.05vw,35px);
  letter-spacing:.02em;line-height:1.45
}
.serviceCopy p{
  margin:0;font-family:var(--sans);font-size:clamp(12px,.88vw,14px);line-height:1.8;color:#4d4a45;
  letter-spacing:.03em
}
.serviceRow .serviceCopy,.serviceRow .serviceName,.serviceRow .serviceNo{
  opacity:0;transform:translateY(14px);
  transition:opacity .8s var(--ease),transform .8s var(--ease)
}
.serviceRow.in .serviceCopy,.serviceRow.in .serviceName,.serviceRow.in .serviceNo{opacity:1;transform:none}
.serviceRow:nth-child(2) .serviceName,.serviceRow:nth-child(2) .serviceCopy,.serviceRow:nth-child(2) .serviceNo{transition-delay:.06s}
.serviceRow:nth-child(3) .serviceName,.serviceRow:nth-child(3) .serviceCopy,.serviceRow:nth-child(3) .serviceNo{transition-delay:.12s}
.serviceFoot{
  margin-top:28px;display:flex;justify-content:space-between;gap:30px;
  font-size:9px;letter-spacing:.13em;color:#8a847b
}
@media(max-width:900px){
  .service{padding-top:100px}
  .serviceHead{align-items:flex-start}
  .serviceStatement{display:none}
  .serviceRow{
    grid-template-columns:70px 1fr;gap:20px;min-height:auto;padding:36px 0
  }
  .serviceNo{grid-row:1/3;align-self:start;padding-top:6px;font-size:46px}
  .serviceName{font-size:clamp(32px,8.5vw,54px);letter-spacing:.11em}
  .serviceCopy{grid-column:2}
  .serviceCopy h3{font-size:clamp(21px,5.5vw,30px)}
  .serviceFoot{display:block;line-height:2}
}
@media(max-width:560px){
  .serviceRow{grid-template-columns:48px 1fr;gap:12px}
  .serviceNo{font-size:36px}
  .serviceName{font-size:9vw}
  .serviceCopy h3{font-size:5.8vw}
  .serviceCopy p{font-size:11px}
}


/* =========================================================
   LOCKED SECTIONS / APPROACH → CONTACT
   ========================================================= */

/* APPROACH */
.approach{
  height:560vh;
  background:#f7f6f2;
  color:#111;
  position:relative;
}
.approachSticky{
  height:100svh;
  position:sticky;
  top:0;
  overflow:hidden;
}
.approachAxisV,.approachAxisH{
  position:absolute;
  z-index:4;
  background:rgba(0,0,0,.10);
}
.approachAxisV{left:50%;top:0;bottom:0;width:1px}
.approachAxisH{top:50%;left:0;right:0;height:1px}
.approachCore{
  position:absolute;
  z-index:20;
  left:50%;
  top:50%;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#111;
  transform:translate(-50%,-50%);
  box-shadow:0 0 0 11px rgba(0,0,0,.035);
}
.approachTop{
  position:absolute;
  z-index:12;
  left:var(--pad);
  right:var(--pad);
  top:104px;
  display:flex;
  justify-content:space-between;
  font-size:9px;
  letter-spacing:.15em;
  color:#807d75;
}
.approachBottom{
  position:absolute;
  z-index:12;
  left:var(--pad);
  bottom:30px;
  color:#817e77;
  font-family:var(--serif);
  font-size:13px;
  letter-spacing:.04em;
}
.approachStage{
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  transform:none;
  transition:none;
  pointer-events:none;
}
.approachStage.active{
  opacity:1;
  visibility:visible;
}
.approachStage.active .approachGhost{animation:approachGhostIn .48s var(--ease) both}
.approachStage.active .approachIndex{animation:approachIndexIn .32s ease both}
.approachStage.active .approachCopy{animation:approachCopyIn .42s var(--ease) both}
@keyframes approachGhostIn{from{opacity:0;transform:translate(-50%,-50%) scale(.985)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes approachIndexIn{from{opacity:0}to{opacity:1}}
@keyframes approachCopyIn{from{opacity:0;transform:translateY(calc(-50% + 14px))}to{opacity:1;transform:translateY(-50%)}}
.approachGhost{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  font-size:clamp(110px,18vw,290px);
  line-height:.72;
  letter-spacing:-.085em;
  font-weight:600;
  color:rgba(0,0,0,.032);
  white-space:nowrap;
}
.approachIndex{
  position:absolute;
  left:var(--pad);
  top:50%;
  transform:translateY(-50%);
  font-size:10px;
  letter-spacing:.14em;
  color:#96928a;
}
.approachCopy{
  position:absolute;
  left:calc(50% + 72px);
  top:50%;
  transform:translateY(-50%);
  width:min(560px,38vw);
}
.approachCopy h2{
  margin:0 0 17px;
  font-family:var(--serif);
  font-size:clamp(46px,5vw,78px);
  line-height:1.08;
  letter-spacing:.01em;
  font-weight:400;
}
.approachCopy p{
  margin:0;
  max-width:500px;
  color:#69665f;
  font-family:var(--serif);
  font-size:clamp(14px,1vw,16px);
  line-height:1.95;
}

/* CANNOT DO */
.cannot{
  min-height:100svh;
  background:#050505;
  color:#f5f3ee;
  display:grid;
  align-items:center;
  padding:clamp(100px,11vw,175px) 0;
  position:relative;
  overflow:hidden;
}
.cannot:after{
  content:"";
  position:absolute;
  width:48vw;
  aspect-ratio:1;
  right:-16vw;
  bottom:-30vw;
  border:1px solid rgba(255,255,255,.035);
  border-radius:50%;
  box-shadow:0 0 0 7vw rgba(255,255,255,.01),0 0 0 14vw rgba(255,255,255,.007);
}
.cannotInner{
  width:min(1540px,100%);
  margin:auto;
  padding:0 var(--pad);
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  gap:clamp(60px,8vw,135px);
  position:relative;
  z-index:2;
}
.cannotLabel{
  margin-bottom:28px;
  color:#686862;
  font-size:9px;
  letter-spacing:.17em;
}
.cannotLead h2{
  margin:0;
  font-family:var(--serif);
  font-size:clamp(52px,6.2vw,96px);
  line-height:1.18;
  letter-spacing:.01em;
  font-weight:400;
}
.cannotLead p{
  margin:44px 0 0;
  color:#777770;
  font-family:var(--serif);
  font-size:14px;
}
.cannotList{
  border-top:1px solid #292929;
}
.cannotList article{
  display:grid;
  grid-template-columns:55px 1fr;
  gap:25px;
  align-items:start;
  padding:26px 0 29px;
  border-bottom:1px solid #292929;
  position:relative;
}
.cannotList article span{
  color:#5d5d57;
  font-size:9px;
  letter-spacing:.12em;
  padding-top:9px;
}
.cannotList h3{
  margin:0;
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(20px,2vw,31px);
  line-height:1.55;
  letter-spacing:.015em;
}
.cannotOdd i{
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%) rotate(-6deg);
  color:#777770;
  font-size:9px;
  letter-spacing:.18em;
  font-style:normal;
}

/* COMPANY */
.company{
  min-height:88svh;
  background:#f5f3ee;
  color:#111;
  display:grid;
  align-items:center;
  padding:clamp(100px,11vw,160px) 0;
}
.companyInner{
  width:min(1540px,100%);
  margin:auto;
  padding:0 var(--pad);
  display:grid;
  grid-template-columns:.58fr 1.1fr .32fr;
  gap:clamp(45px,7vw,115px);
  align-items:start;
}
.companyLabel{
  margin-bottom:22px;
  font-size:9px;
  letter-spacing:.17em;
  color:#8c877c;
}
.companyHead h2{
  margin:0;
  font-size:clamp(45px,5vw,77px);
  line-height:.95;
  letter-spacing:-.055em;
  font-weight:400;
}
.companyHead p{
  margin:30px 0 0;
  font-family:var(--serif);
  color:#767169;
  font-size:14px;
}
.companyData{
  margin:0;
  border-top:1px solid rgba(0,0,0,.15);
}
.companyData div{
  display:grid;
  grid-template-columns:145px 1fr;
  gap:28px;
  padding:18px 0;
  border-bottom:1px solid rgba(0,0,0,.15);
}
.companyData dt{
  color:#8b867d;
  font-size:10px;
  letter-spacing:.08em;
}
.companyData dd{
  margin:0;
  font-size:13px;
  line-height:1.7;
}
.companyMark{
  align-self:end;
  color:#8b867d;
  font-size:9px;
  line-height:1.8;
  letter-spacing:.13em;
}
.companyMarkDot{
  display:block;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#111;
  margin-bottom:18px;
}

/* CONTACT */
.contact{
  min-height:108svh;
  background:#050505;
  color:#fff;
  position:relative;
  overflow:hidden;
  display:grid;
  align-items:center;
  padding:clamp(120px,12vw,190px) 0 110px;
}
.contactAxisV,.contactAxisH{
  position:absolute;
  background:rgba(255,247,218,.11);
}
.contactAxisV{left:66%;top:0;bottom:0;width:1px}
.contactAxisH{top:50%;left:0;right:0;height:1px}
.contactCore{
  position:absolute;
  z-index:4;
  left:66%;
  top:50%;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#fff;
  transform:translate(-50%,-50%);
  box-shadow:0 0 12px 3px var(--glow),0 0 85px 28px rgba(243,233,206,.19);
}
.contactAura{
  position:absolute;
  left:66%;
  top:50%;
  width:min(35vw,560px);
  aspect-ratio:1;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,250,230,.065),transparent 67%);
  border:1px solid rgba(255,255,255,.035);
}
.contactAura:before,.contactAura:after{
  content:"";
  position:absolute;
  border:1px solid rgba(255,255,255,.026);
  border-radius:50%;
}
.contactAura:before{inset:14%}
.contactAura:after{inset:30%}
.contactInner{
  width:min(1540px,100%);
  margin:auto;
  padding:0 var(--pad);
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  gap:clamp(65px,8vw,135px);
  align-items:center;
  position:relative;
  z-index:9;
}
.contactLabel{
  color:#6f6f69;
  font-size:9px;
  letter-spacing:.17em;
}
.contactIntro h2{
  margin:24px 0 28px;
  max-width:9ch;
  font-family:var(--serif);
  font-size:clamp(51px,5.7vw,89px);
  line-height:1.2;
  font-weight:400;
  letter-spacing:.005em;
}
.contactIntro p{
  margin:0;
  max-width:470px;
  color:#888882;
  font-family:var(--serif);
  font-size:14px;
  line-height:2;
}
.contactSmall{
  margin-top:33px;
  max-width:430px;
  color:#4f4f4a;
  font-size:8px;
  line-height:1.9;
  letter-spacing:.12em;
}
.contactForm{
  border-top:1px solid #303030;
  background:rgba(5,5,5,.56);
  backdrop-filter:blur(7px);
}
.contactForm label{
  display:grid;
  grid-template-columns:44px 142px 1fr;
  align-items:center;
  min-height:78px;
  border-bottom:1px solid #303030;
  transition:border-color .35s var(--ease);
}
.contactForm label:focus-within{
  border-bottom-color:#c8c2b5;
}
.formNo{
  color:#4f4f49;
  font-size:8px;
  letter-spacing:.12em;
}
.formName{
  color:#76766f;
  font-size:9px;
  letter-spacing:.13em;
}
.contactForm input,.contactForm select,.contactForm textarea{
  width:100%;
  min-width:0;
  border:0;
  outline:0;
  background:transparent;
  color:#fff;
  font-family:var(--sans);
  font-size:15px;
  padding:20px 0;
}
.contactForm input::placeholder,.contactForm textarea::placeholder{
  color:#4e4e49;
}
.contactForm select{
  appearance:none;
  cursor:pointer;
}
.contactForm select option{
  background:#111;
  color:#fff;
}
.messageRow{
  align-items:start!important;
  padding-top:17px;
}
.messageRow .formNo,.messageRow .formName{
  padding-top:10px;
}
.contactForm textarea{
  min-height:125px;
  resize:vertical;
}
.contactForm button{
  width:100%;
  min-height:75px;
  margin-top:28px;
  border:1px solid #454545;
  background:transparent;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 23px;
  font-size:11px;
  letter-spacing:.12em;
  cursor:pointer;
  position:relative;
  overflow:hidden;
}
.contactForm button:before{
  content:"";
  position:absolute;
  inset:0;
  background:#f5f3ee;
  transform:translateY(101%);
  transition:transform .55s var(--ease);
}
.contactForm button span{
  position:relative;
  z-index:2;
  transition:color .4s var(--ease);
}
.contactForm button:hover:before{transform:none}
.contactForm button:hover span{color:#111}
.contactFoot{
  position:absolute;
  z-index:9;
  left:var(--pad);
  right:var(--pad);
  bottom:28px;
  display:flex;
  justify-content:space-between;
  color:#555550;
  font-size:9px;
  letter-spacing:.14em;
}

@media(max-width:900px){
  .approachGhost{font-size:23vw}
  .approachCopy{
    left:calc(50% + 38px);
    width:auto;
    right:var(--pad);
  }
  .cannotInner{
    grid-template-columns:1fr;
    gap:58px;
  }
  .companyInner{
    grid-template-columns:1fr;
  }
  .companyData div{
    grid-template-columns:115px 1fr;
  }
  .companyMark{display:none}
  .contactInner{
    grid-template-columns:1fr;
    gap:64px;
  }
  .contactAxisV,.contactCore,.contactAura{left:84%}
  .contactAxisH,.contactCore,.contactAura{top:31%}
}
@media(max-width:600px){
  .approach{height:500vh}
  .approachTop span:last-child{display:none}
  .approachIndex{
    top:29%;
    left:22px;
  }
  .approachGhost{
    top:40%;
    font-size:26vw;
  }
  .approachCopy{
    left:22px;
    right:22px;
    top:64%;
    transform:none;
    width:auto;
  }
  .approachCopy h2{
    font-size:11vw;
  }
  .approachBottom{
    left:22px;
    right:22px;
    font-size:11px;
  }

  .cannot{padding:95px 0}
  .cannotLead h2{font-size:14vw}
  .cannotList article{grid-template-columns:40px 1fr;gap:14px}
  .cannotList h3{font-size:18px}
  .cannotOdd i{display:none}

  .company{padding:95px 0}
  .companyHead h2{font-size:14vw}
  .companyData div{
    grid-template-columns:1fr;
    gap:7px;
    padding:15px 0;
  }

  .contact{padding:100px 0 90px}
  .contactIntro h2{font-size:13vw}
  .contactAxisV,.contactCore,.contactAura{left:87%}
  .contactAxisH,.contactCore,.contactAura{top:28%}
  .contactForm label{
    grid-template-columns:34px 1fr;
    padding:14px 0;
  }
  .formNo{grid-column:1}
  .formName{grid-column:2}
  .contactForm input,.contactForm select,.contactForm textarea{
    grid-column:1/-1;
    padding:13px 0 6px;
  }
  .messageRow .formNo,.messageRow .formName{padding-top:0}
  .contactFoot span:last-child{display:none}
}

@media(prefers-reduced-motion:reduce){
  .approachStage{transition:none!important}
}


/* =========================================================
   LOCKED / MANY FORMS PLACEHOLDER + PROJECTS + VISION
   ========================================================= */

/* Honest future-content slots */
.futureSlot{
  background:#f5f3ee;
  color:#111;
  min-height:58svh;
  display:grid;
  align-items:center;
  border-top:1px solid rgba(0,0,0,.12);
  border-bottom:1px solid rgba(0,0,0,.12);
}
.futureDirector{background:#ece9e1}
.futureSlotInner{
  width:min(1540px,100%);
  margin:auto;
  padding:clamp(85px,9vw,135px) var(--pad);
  display:grid;
  grid-template-columns:.45fr 1.55fr;
  column-gap:clamp(40px,7vw,110px);
  align-items:start;
}
.futureSlotLabel{
  grid-column:1;
  font-size:9px;
  letter-spacing:.17em;
  color:#88837a;
}
.futureSlotLine{
  grid-column:1;
  margin-top:22px;
  width:68px;
  height:1px;
  background:#bdb7ac;
}
.futureSlot h2{
  grid-column:2;
  grid-row:1/3;
  margin:0;
  font-family:var(--serif);
  font-size:clamp(42px,5vw,77px);
  line-height:1.22;
  letter-spacing:.005em;
  font-weight:400;
}
.futureSlotMeta{
  grid-column:2;
  margin-top:48px;
  padding-top:15px;
  border-top:1px solid rgba(0,0,0,.13);
  display:flex;
  justify-content:space-between;
  gap:30px;
  color:#858077;
  font-size:8px;
  line-height:1.8;
  letter-spacing:.12em;
}

/* PROJECTS */
.projects{
  background:#fff;
}
.project{
  min-height:100svh;
  position:relative;
  overflow:hidden;
}
.projectInner{
  width:min(1540px,100%);
  min-height:100svh;
  margin:auto;
  padding:0 var(--pad);
  position:relative;
}
.projectLabel{
  position:absolute;
  z-index:10;
  top:30px;
  left:var(--pad);
  font-size:9px;
  letter-spacing:.17em;
}
.projectCopy{
  position:absolute;
  z-index:15;
  left:var(--pad);
  bottom:9vh;
  width:min(650px,48vw);
}
.projectCopy h2{
  margin:0 0 28px;
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(55px,6.7vw,104px);
  line-height:1.14;
  letter-spacing:0;
}
.projectCopy p{
  margin:0 0 30px;
  max-width:540px;
  font-family:var(--serif);
  font-size:14px;
  line-height:2;
}
.projectCopy a,.projectSoon{
  display:inline-block;
  padding-bottom:7px;
  border-bottom:1px solid currentColor;
  font-size:9px;
  letter-spacing:.16em;
}

/* BENSA has its own identity. No recreated emblem. */
.projectBensa{
  background:#070707;
  color:#f6f4ef;
}
.projectBensa .projectCopy p{color:#9e9e97}
.projectBensa .projectLabel{color:#ff6a00}
.bensaNumber{
  position:absolute;
  z-index:2;
  top:6vh;
  right:-.04em;
  color:#ff6a00;
  font-family:var(--sans);
  font-size:clamp(220px,36vw,560px);
  font-weight:700;
  line-height:.75;
  letter-spacing:-.12em;
}
.bensaNumber span{
  display:inline-block;
  vertical-align:top;
  margin:.06em 0 0 .12em;
  font-size:.11em;
  letter-spacing:.04em;
  text-transform:lowercase;
}
.bensaBar{
  position:absolute;
  z-index:6;
  top:48%;
  left:9vw;
  right:8vw;
  height:6px;
  background:#f1f0ec;
  transform:translateY(-50%);
  box-shadow:0 0 24px rgba(255,255,255,.08);
}
.bensaBar b{
  position:absolute;
  left:20%;
  right:20%;
  top:-4px;
  height:14px;
  border-top:1px solid #888;
  border-bottom:1px solid #888;
}
.bensaBar .plate{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  border:5px solid #f1f0ec;
  width:18px;
}
.bensaBar .p1{left:4%;height:128px}
.bensaBar .p2{left:7%;height:96px}
.bensaBar .p3{right:7%;height:96px}
.bensaBar .p4{right:4%;height:128px}
.bensaFoot{
  position:absolute;
  right:var(--pad);
  bottom:32px;
  color:#ff6a00;
  font-size:10px;
  letter-spacing:.17em;
}

/* PHOTO GIFT is intentionally soft and tactile. */
.projectGift{
  background:#eee8dc;
  color:#181714;
}
.projectGift .projectLabel{color:#887f72}
.projectGift .projectCopy{
  width:min(590px,43vw);
}
.projectGift .projectCopy p{
  color:#665f56;
}
.giftComposition{
  position:absolute;
  right:4vw;
  top:10vh;
  width:min(57vw,840px);
  height:76vh;
}
.giftPaper{
  position:absolute;
  background:#f8f4eb;
  box-shadow:0 25px 85px rgba(48,36,23,.12);
  border:1px solid rgba(70,55,37,.08);
}
.giftPaperA{
  width:62%;
  height:72%;
  top:9%;
  right:13%;
  transform:rotate(7deg);
  background:
    linear-gradient(135deg,rgba(255,255,255,.65),rgba(223,210,190,.40)),
    repeating-linear-gradient(0deg,transparent 0 15px,rgba(70,55,37,.018) 15px 16px);
}
.giftPaperB{
  width:52%;
  height:58%;
  top:13%;
  right:25%;
  transform:rotate(-5deg);
  display:flex;
  align-items:flex-end;
  padding:28px;
  background:#11100e;
  color:#f3ede2;
}
.giftPaperB span{
  font-size:clamp(46px,5vw,78px);
  line-height:.82;
  letter-spacing:-.05em;
}
.giftPaperC{
  width:37%;
  height:36%;
  right:0;
  bottom:8%;
  transform:rotate(5deg);
  background:#d7c6ad;
}
.giftPaperC:before{
  content:"";
  position:absolute;
  inset:17%;
  border:1px solid rgba(60,43,28,.18);
  border-radius:50%;
}
.giftCore{
  position:absolute;
  z-index:9;
  left:49%;
  top:46%;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#fffdf4;
  box-shadow:0 0 10px 3px #fffdf4,0 0 72px 24px rgba(210,178,128,.30);
}

/* VISION — complete pause. No motion. */
.visionLocked{
  min-height:100svh;
  background:#faf9f6;
  color:#111;
  display:grid;
  place-items:center;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.visionCore{
  position:absolute;
  left:50%;
  top:50%;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#111;
  transform:translate(-50%,-50%);
}
.visionInner{
  position:relative;
  z-index:2;
}
.visionLabel{
  color:#8f8b83;
  font-size:9px;
  letter-spacing:.17em;
}
.visionLocked h2{
  margin:38px 0 30px;
  font-family:var(--serif);
  font-size:clamp(67px,8.6vw,135px);
  line-height:1.18;
  font-weight:400;
  letter-spacing:0;
}
.visionLocked p{
  margin:0;
  color:#78746d;
  font-family:var(--serif);
  font-size:14px;
  line-height:2;
}

/* responsive */
@media(max-width:900px){
  .futureSlotInner{
    grid-template-columns:1fr;
    gap:25px;
  }
  .futureSlot h2,.futureSlotMeta{grid-column:1}
  .futureSlot h2{grid-row:auto}
  .futureSlotMeta{margin-top:22px}
  .projectCopy{
    width:min(620px,70vw);
  }
  .giftComposition{
    width:72vw;
    right:-8vw;
    opacity:.62;
  }
}
@media(max-width:600px){
  .futureSlot{min-height:50svh}
  .futureSlotInner{padding:75px 20px}
  .futureSlot h2{font-size:11vw}
  .futureSlotMeta{
    display:block;
  }
  .futureSlotMeta span{display:block;margin-top:6px}

  .project,.projectInner{min-height:92svh}
  .projectLabel{left:20px}
  .projectCopy{
    left:20px;
    right:20px;
    width:auto;
    bottom:7vh;
  }
  .projectCopy h2{font-size:13.5vw}
  .projectCopy p{font-size:13px}
  .bensaNumber{
    top:13vh;
    font-size:57vw;
  }
  .bensaBar{
    left:3vw;
    right:3vw;
    top:43%;
  }
  .bensaFoot{right:20px}
  .giftComposition{
    top:9vh;
    width:94vw;
    height:56vh;
    right:-29vw;
    opacity:.58;
  }
  .projectGift .projectCopy{
    width:auto;
  }

  .visionLocked h2{font-size:16vw}
  .visionLocked p{font-size:13px}
}

/* ================================================================
   CORE1 FINAL SYSTEM — Editorial × Quiet Luxury
   Direction: one fixed Core; form changes around it.
   ================================================================ */
:root{
  --ink:#11100c;
  --black:#050505;
  --paper:#f4f1e9;
  --paper2:#faf8f3;
  --muted:#77736b;
  --hair:rgba(17,16,12,.14);
  --hair-dark:rgba(255,255,255,.13);
  --orange:#ff6a00;
  --pad:clamp(24px,4.1vw,72px);
}
html{scroll-padding-top:0}
body{font-family:var(--sans);font-size:16px;cursor:auto}
[hidden]{display:none!important}
.skipLink{position:fixed;z-index:20000;top:12px;left:12px;background:#fff;color:#111;padding:10px 14px;font-size:12px;transform:translateY(-180%);transition:transform .2s ease}.skipLink:focus{transform:none}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #fffdf4;outline-offset:4px}.company a:focus-visible,.service a:focus-visible,.visionLocked a:focus-visible,.founder a:focus-visible{outline-color:#111}
.headerHome{display:block;position:relative;z-index:2}.companyData a{text-decoration:none;border-bottom:1px solid rgba(0,0,0,.22);padding-bottom:2px}

/* Intro */
.siteIntro{position:fixed;z-index:15000;inset:0;background:#000;display:grid;place-items:center;transition:opacity .32s var(--ease),visibility .32s var(--ease)}
.siteIntro.done{opacity:0;visibility:hidden;pointer-events:none}.introCore{position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:50%;background:#fff;transform:translate(-50%,-50%) scale(.2);opacity:0;box-shadow:0 0 10px 3px #fffdf4,0 0 68px 23px rgba(243,233,206,.19);animation:introCore .34s .12s var(--ease) forwards}.introLogo{width:clamp(112px,9vw,158px);height:clamp(112px,9vw,158px);object-fit:contain;opacity:0;transform:scale(.98);animation:introLogo .34s .46s var(--ease) forwards;mix-blend-mode:screen}.introWord{position:absolute;bottom:32px;font-size:8px;letter-spacing:.18em;color:#55534e;opacity:0;animation:introWord .25s .72s ease forwards}@keyframes introCore{to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes introLogo{to{opacity:1;transform:scale(1)}}@keyframes introWord{to{opacity:1}}

/* Header / Navigation */
.header{height:78px;transition:opacity .34s .78s var(--ease),transform .34s .78s var(--ease)!important}.headerLogo{width:60px;height:60px}.nav{gap:clamp(20px,2.2vw,38px)}.nav a{min-height:44px;display:flex;align-items:center;opacity:.58;transition:opacity .25s var(--ease)}.nav a:hover,.nav a.active{opacity:1}.nav a.active:after{right:0}
.menuButton{display:none;position:fixed;z-index:121;right:var(--pad);top:13px;min-width:62px;min-height:44px;border:0;background:transparent;color:#fff;align-items:center;justify-content:flex-end;gap:9px;mix-blend-mode:difference;cursor:pointer}.menuButton span{font-size:9px;letter-spacing:.15em}.menuButton i{width:17px;height:1px;background:currentColor;position:relative;transition:transform .28s var(--ease)}.menuButton i:after{content:"";position:absolute;right:0;top:6px;width:11px;height:1px;background:currentColor;transition:transform .28s var(--ease),top .28s var(--ease),width .28s var(--ease)}.menuButton[aria-expanded="true"] i{transform:rotate(45deg)}.menuButton[aria-expanded="true"] i:after{top:0;width:17px;transform:rotate(90deg)}
.mobileMenu{position:fixed;z-index:119;inset:0;background:#050505;color:#fff;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .32s var(--ease),transform .32s var(--ease),visibility .32s}.mobileMenu.open{opacity:1;visibility:visible;transform:none}.mobileMenuInner{min-height:100svh;padding:108px 22px 30px;display:flex;flex-direction:column}.mobileMenuMeta{font-size:9px;letter-spacing:.16em;color:#66635e;margin-bottom:28px}.mobileMenu nav{border-top:1px solid #242424}.mobileMenu nav a{display:grid;grid-template-columns:42px 1fr;align-items:baseline;min-height:62px;padding:12px 0;border-bottom:1px solid #242424}.mobileMenu nav b{font-size:8px;color:#555;font-weight:400;letter-spacing:.12em}.mobileMenu nav span{font-family:var(--serif);font-size:clamp(29px,9.4vw,43px);line-height:1.05}.mobileMenuFoot{margin-top:auto;color:#716e67;font-family:var(--serif);font-size:12px}body.menuOpen{overflow:hidden}

/* Global type discipline */
.hero h1,.philoFinal h2,.approachCopy h2,.successionLead h2,.cannotLead h2,.projectCopy h2,.founder h2,.founder blockquote,.visionLocked h2,.contactIntro h2{word-break:keep-all;overflow-wrap:normal;text-wrap:balance}
.serviceCopy p,.projectCopy p,.companyData dd,.contactIntro p,.approachCopy p,.successionBody p,.founderBody p{font-size:16px;line-height:1.85}

/* Rhythm: immersive but not exhausting */
.bridge{height:18vh}.philo{height:500vh}.approach{height:400vh}
.hero h1{font-size:clamp(54px,5.65vw,90px);line-height:1.18}.heroLead{font-size:16px;line-height:1.9}.philoFinal h2{font-size:clamp(54px,6.5vw,102px);line-height:1.22}

/* Service: information clarity is part of the brand. */
.service{background:#f6f4ee}.serviceInner{padding-top:clamp(84px,8vw,128px);padding-bottom:clamp(76px,7vw,112px)}.serviceRows{border-top-color:rgba(17,16,12,.18)}.serviceRow{grid-template-columns:54px minmax(250px,.82fr) minmax(0,1.18fr);column-gap:clamp(24px,4vw,68px);padding:clamp(32px,3vw,48px) 0}.serviceName{font-size:clamp(34px,3.2vw,52px);letter-spacing:.055em}.serviceCopy h3{max-width:22em;font-size:clamp(22px,1.8vw,29px);line-height:1.4}.serviceCopy p{color:#555149}.serviceNo{color:#9a9386}

/* Approach: core is fixed, text stays human-sized. */
.approachCopy{width:min(600px,41vw);left:calc(50% + 64px)}.approachCopy h2{font-size:clamp(39px,4vw,60px);line-height:1.17}.approachCopy p{max-width:560px}.approachGhost{font-size:clamp(100px,16vw,250px);color:rgba(0,0,0,.027)}

/* Succession: a specialty, not a second homepage. */
.succession{min-height:100svh;position:relative;overflow:hidden;background:#f3f0e8;color:#111;display:grid;align-items:center}.successionDark{position:absolute;z-index:1;top:0;right:0;bottom:0;width:36%;background:#070707;overflow:hidden}.successionInherited{position:absolute;z-index:0;left:-.04em;bottom:-.06em;font-family:var(--serif);font-size:clamp(210px,29vw,440px);font-weight:400;line-height:.76;color:rgba(0,0,0,.027);white-space:nowrap}.successionChosen{position:absolute;left:.06em;top:50%;transform:translateY(-50%);font-family:var(--serif);font-size:clamp(140px,18vw,285px);line-height:.82;color:rgba(255,255,255,.07);white-space:nowrap}.successionAxis{position:absolute;z-index:4;left:64%;top:0;bottom:0;width:1px;background:rgba(0,0,0,.13)}.successionAxis:after{content:"";position:absolute;left:0;top:50%;width:100vw;height:1px;background:linear-gradient(90deg,rgba(0,0,0,.05),rgba(0,0,0,.14) 64%,rgba(255,255,255,.14) 64%,rgba(255,255,255,.04));transform:translate(-64%,-50%)}.successionCore{position:absolute;z-index:10;left:64%;top:50%;width:8px;height:8px;border-radius:50%;background:#111;transform:translate(-50%,-50%);box-shadow:0 0 0 12px rgba(0,0,0,.035)}.succession:after{content:"";position:absolute;z-index:5;left:64%;top:50%;width:180px;height:180px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,249,226,.10),transparent 68%);pointer-events:none;mix-blend-mode:screen}.successionInner{width:min(1540px,100%);min-height:100svh;margin:auto;padding:clamp(105px,10vw,160px) var(--pad) clamp(86px,8vw,124px);position:relative;z-index:6;display:grid;grid-template-columns:35% 29% 36%;grid-template-rows:auto 1fr auto;column-gap:0}.successionLabel{grid-column:1/-1;color:#807a70;font-size:9px;letter-spacing:.17em}.successionLead{grid-column:1;align-self:center;padding-right:clamp(28px,3vw,52px)}.successionOverline{margin:0 0 22px;color:#827c72;font-size:9px;letter-spacing:.17em}.successionLead h2{margin:0;max-width:7.2em;font-family:var(--serif);font-size:clamp(50px,5.2vw,80px);line-height:1.2;font-weight:400}.successionBody{grid-column:2;align-self:center;max-width:390px;padding:50px 34px 0 0}.successionBody p{margin:0 0 22px;color:#625d55}.successionStatement{position:absolute;right:0;bottom:8vh;width:32%;padding-top:17px;border-top:1px solid rgba(255,255,255,.18)}.successionStatement span{display:block;color:#77726b;margin-bottom:14px;font-size:9px;letter-spacing:.16em}.successionStatement strong{display:block;max-width:400px;color:#f3f0e8;font-family:var(--serif);font-size:clamp(22px,1.85vw,28px);line-height:1.62;font-weight:400}

/* Cannot do: personality without theatrical scale. */
.cannot{min-height:auto}.cannotInner{grid-template-columns:minmax(360px,.85fr) minmax(0,1.15fr);gap:clamp(52px,6vw,92px)}.cannotLead h2{max-width:7.5em;font-size:clamp(40px,4.05vw,60px);line-height:1.22}.cannotList h3{font-size:clamp(19px,1.65vw,27px);line-height:1.55}.cannotLead p{color:#88847c}

/* Projects: two different projects, two different visual grammars. */
.project{min-height:90svh}.projectInner{min-height:90svh}.projectCopy{bottom:8vh}.projectCopy h2{font-size:clamp(43px,4.25vw,63px);line-height:1.18}.projectCopy p{max-width:590px}.projectProof{display:flex;align-items:baseline;gap:12px;margin:0 0 25px;color:#ff6a00}.projectProof b{font-size:clamp(24px,2.1vw,34px);font-weight:500;line-height:1}.projectProof span{font-size:8px;letter-spacing:.14em}.bensaVisual{position:absolute;right:5vw;top:50%;width:min(38vw,590px);transform:translateY(-52%);z-index:5;display:grid;place-items:center}.bensaVisual img{width:74%;height:auto;filter:drop-shadow(0 22px 54px rgba(0,0,0,.32));opacity:.98}.bensaOrangeLine{position:absolute;left:-8%;right:-5%;top:50%;height:1px;background:#ff6a00;opacity:.56}.bensaCondition{position:absolute;right:0;bottom:-2%;color:#ff6a00;text-align:right}.bensaCondition b{display:block;font-size:clamp(24px,2.5vw,38px);font-weight:600;line-height:1;letter-spacing:-.035em}.bensaCondition span{display:block;margin-top:7px;font-size:8px;letter-spacing:.15em}.projectBensa .projectCopy{width:min(670px,48vw)}.projectBensa .projectLabel,.bensaFoot{color:#ff6a00}.projectGift .projectCopy{width:min(680px,50vw)}

/* Founder: completed editorial chapter; photography can be layered later. */
.founder{background:#0a0a09;color:#f4f1e9;position:relative;overflow:hidden;padding:clamp(112px,11vw,176px) 0}.founder:after{content:"SHINGO";position:absolute;right:-.08em;bottom:-.13em;font-family:var(--sans);font-size:clamp(140px,22vw,340px);font-weight:600;line-height:.72;letter-spacing:-.08em;color:rgba(255,255,255,.025);pointer-events:none}.founderInner{width:min(1540px,100%);margin:auto;padding:0 var(--pad);display:grid;grid-template-columns:.72fr 1.28fr;column-gap:clamp(54px,7vw,112px);row-gap:clamp(54px,7vw,100px);position:relative;z-index:2}.founderLabel{grid-column:1/-1;color:#6f6b64;font-size:9px;letter-spacing:.17em}.founderLead p{margin:0 0 20px;color:#77736c;font-size:9px;letter-spacing:.17em}.founderLead h2{margin:0;font-family:var(--serif);font-size:clamp(40px,4.3vw,66px);font-weight:400;line-height:1.25}.founder blockquote{grid-column:2;margin:0;font-family:var(--serif);font-size:clamp(47px,5.4vw,82px);font-weight:400;line-height:1.24}.founderBody{grid-column:2;max-width:720px;margin-left:auto}.founderBody>p{margin:0 0 22px;color:#aaa59d;max-width:610px}.founderProfile{margin-top:48px;padding-top:20px;border-top:1px solid var(--hair-dark)}.founderProfile strong{display:block;font-size:15px;font-weight:500}.founderProfile strong span{margin-left:13px;color:#76726b;font-size:8px;letter-spacing:.15em;font-weight:400}.founderProfile p{margin:14px 0 0;max-width:650px;color:#77736c;font-size:13px;line-height:1.9}.founderCreed{grid-column:1/-1;margin-top:14px;padding-top:24px;border-top:1px solid var(--hair-dark);font-family:var(--serif);font-size:clamp(28px,3vw,44px);line-height:1.5;color:#d8d3ca}

/* Vision / Company / Contact */
.visionLocked h2{font-size:clamp(56px,6.8vw,106px);line-height:1.2}.visionLocked p{font-size:15px;line-height:1.9}.company{min-height:auto;padding:clamp(86px,8vw,126px) 0}.companyHead h2{font-size:clamp(38px,4vw,60px)}.companyData dd{font-size:14px}.contact{min-height:100svh}.contactIntro h2{width:auto;max-width:10.5em;font-size:clamp(43px,4.55vw,69px);line-height:1.25}.contactIntro p{max-width:520px}.contactForm input,.contactForm select,.contactForm textarea{font-size:16px}.contactForm button{min-height:68px}.contactLabel,.companyLabel,.visionLabel,.projectLabel,.cannotLabel,.approachTop,.serviceLabel,.successionLabel,.founderLabel{letter-spacing:.15em}

/* No custom cursor: interface should not add a floating decorative artifact. */
.cursorDot,.cursorRing{display:none!important}

@media(max-width:1000px){
  .nav{gap:18px}.nav a{font-size:8px}
  .successionDark{width:30%}.successionAxis,.successionCore,.succession:after{left:70%}.successionAxis:after{transform:translate(-70%,-50%)}.successionInner{grid-template-columns:1fr .9fr}.successionLabel{grid-column:1/-1}.successionLead{grid-column:1}.successionBody{grid-column:2;padding-right:48px}.successionStatement{position:static;grid-column:1/3;width:70%;align-self:end;color:#111;border-top:1px solid rgba(0,0,0,.14);padding-top:16px}.successionStatement span{color:#8c867c}.successionStatement strong{color:#24211d}
  .founderInner{grid-template-columns:.6fr 1.4fr}
}
@media(max-width:900px){
  .nav{display:none}.menuButton{display:flex}.header{padding-right:90px}
  .bridge{height:14vh}.philo{height:460vh}.approach{height:370vh}
  .approachCopy{left:calc(50% + 36px);right:var(--pad);width:auto}.approachCopy h2{font-size:clamp(37px,6.2vw,52px)}
  .cannotInner{grid-template-columns:1fr;gap:48px}.cannotLead{max-width:680px}.cannotLead h2{font-size:clamp(40px,6.8vw,55px)}
  .projectBensa .projectCopy,.projectGift .projectCopy{width:min(630px,70vw)}.bensaVisual{width:54vw;right:-2vw}
  .founderInner{grid-template-columns:1fr}.founder blockquote,.founderBody{grid-column:1}.founderBody{margin-left:0}.founder blockquote{max-width:11em}
  .contactInner{grid-template-columns:1fr;gap:58px}.contactIntro h2{font-size:clamp(40px,7vw,58px)}
}
@media(max-width:700px){
  :root{--pad:20px}.header{height:68px;padding-top:6px;padding-bottom:6px}.headerLogo{width:54px;height:54px}.menuButton{right:20px;top:9px}
  .hero h1{font-size:clamp(42px,10.4vw,52px);line-height:1.26}.heroLead{font-size:15px;line-height:1.85}.heroLead br{display:none}.philoFinal h2{font-size:clamp(42px,10.2vw,52px);line-height:1.3}
  .serviceInner{padding-top:74px;padding-bottom:70px}.serviceHead{margin-bottom:28px}.serviceRow{grid-template-columns:34px 1fr;gap:10px 14px;padding:27px 0}.serviceNo{grid-column:1;grid-row:1}.serviceName{grid-column:2;grid-row:1;font-size:clamp(28px,7.2vw,36px)}.serviceCopy{grid-column:2;grid-row:2}.serviceCopy h3{font-size:clamp(19px,4.8vw,24px);line-height:1.45;margin-bottom:10px}.serviceCopy p{font-size:14px;line-height:1.75}.serviceStatement{display:none}
  .approach{height:330vh}.approachTop span:last-child{display:none}.approachIndex{top:27%;left:20px}.approachGhost{top:38%;font-size:23vw}.approachCopy{left:20px;right:20px;top:62%;transform:none}.approachCopy h2{font-size:clamp(34px,8.5vw,43px)}.approachCopy p{font-size:15px}.approachBottom{left:20px;right:20px;font-size:11px}
  .succession{min-height:112svh}.successionDark{top:82%;left:0;width:100%;height:18%}.successionAxis{left:0;right:0;top:82%;bottom:auto;width:auto;height:1px}.successionAxis:after{display:none}.successionCore,.succession:after{left:50%;top:82%}.successionInherited{font-size:43vw;bottom:16%;left:-.08em}.successionChosen{left:50%;top:50%;transform:translate(-50%,-50%);font-size:30vw}.successionInner{min-height:112svh;display:block;padding:88px 20px 25svh}.successionLabel{margin-bottom:48px}.successionLead{padding:0}.successionLead h2{max-width:7em;font-size:clamp(40px,10vw,50px)}.successionBody{padding:0;margin-top:38px;max-width:520px}.successionBody p{font-size:15px;line-height:1.85}.successionStatement{display:block;width:auto;margin-top:38px;padding-top:15px}.successionStatement strong{font-size:clamp(20px,5.2vw,25px);line-height:1.55}
  .cannot{padding:86px 0}.cannotLead h2{font-size:clamp(37px,9.1vw,45px)}.cannotList article{grid-template-columns:34px 1fr;gap:12px;padding:21px 0}.cannotList h3{font-size:17px}
  .project,.projectInner{min-height:84svh}.projectCopy{left:20px;right:20px;width:auto;bottom:6vh}.projectCopy h2{font-size:clamp(37px,9.1vw,46px);line-height:1.2}.projectCopy p{font-size:15px;line-height:1.8}.bensaVisual{width:68vw;right:-3vw;top:24%;opacity:.42}.bensaCondition{display:none}.projectProof{margin-bottom:18px}.giftComposition{top:7vh;width:90vw;height:54vh;right:-26vw;opacity:.52}
  .founder{padding:90px 0}.founderLead h2{font-size:clamp(36px,8.8vw,44px)}.founder blockquote{font-size:clamp(39px,9.8vw,49px)}.founderProfile strong span{display:block;margin:6px 0 0}.founderCreed{font-size:clamp(25px,6.5vw,32px)}
  .visionLocked{min-height:82svh}.visionLocked h2{font-size:clamp(44px,10.6vw,54px);line-height:1.27}.visionLocked p{font-size:14px}.company{padding:78px 0}.companyHead h2{font-size:clamp(38px,9.5vw,48px)}.companyData div{grid-template-columns:1fr;gap:6px;padding:14px 0}.companyData dd{font-size:14px}
  .contact{min-height:auto;padding:92px 0 88px}.contactIntro h2{font-size:clamp(38px,9.3vw,47px);line-height:1.3}.contactIntro p{font-size:15px}.contactForm label{grid-template-columns:34px 1fr;padding:13px 0}.formNo{grid-column:1}.formName{grid-column:2}.contactForm input,.contactForm select,.contactForm textarea{grid-column:1/-1;padding:12px 0 5px}.messageRow .formNo,.messageRow .formName{padding-top:0}.contactFoot span:last-child{display:none}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}.siteIntro{display:none}.mobileMenu,.menuButton i,.menuButton i:after{transition:none!important}.heroGrid,.heroAxisV,.heroAxisH,.heroGlow,.heroCoreLogo,.heroCoreLogoAura,.heroRings,.heroKicker,.hero h1,.heroLead,.heroMeta{transition:none!important}.scene{transition:none!important}
}


/* FINAL POLISH — intro-to-hero timing + philosophy immersion */
.heroGrid{transition:opacity .42s .20s var(--ease)!important}
.heroAxisV{transition:height .52s .24s var(--ease)!important}
.heroAxisH{transition:width .56s .30s var(--ease)!important}
.heroGlow{transition:opacity .35s .10s ease,transform .46s .10s var(--ease)!important}
.heroRings{transition:opacity .58s .26s ease!important}
.heroCoreLogo{transition:opacity .48s .30s var(--ease),transform .52s .30s var(--ease)!important}
.heroCoreLogoAura{transition:opacity .50s .28s ease!important}
.heroKicker{transition:opacity .42s .58s var(--ease),transform .42s .58s var(--ease)!important}
.hero h1{transition:opacity .12s .54s linear,clip-path .72s .54s var(--ease)!important}
.heroLead{transition:opacity .48s .72s var(--ease),transform .48s .72s var(--ease)!important}
.heroMeta{transition:opacity .42s .90s ease!important}
.header{transition:opacity .30s .76s var(--ease),transform .30s .76s var(--ease)!important}
body.philoActive .header,body.philoActive .menuButton{opacity:0!important;pointer-events:none!important;transition:opacity .28s var(--ease)!important}


/* FINAL QA FIXES — clarity over effects */
.serviceRow .serviceCopy,.serviceRow .serviceName,.serviceRow .serviceNo{opacity:1!important;transform:none!important;transition:none!important}
.project,.projectInner{min-height:100svh!important}
.heroLead{color:#aaa69d}
.contactForm input::placeholder,.contactForm textarea::placeholder{color:#68655f}
@media(max-width:700px){
  .heroAxisV,.heroGlow,.heroCoreLogo,.heroCoreLogoAura,.heroRings{left:86%!important;top:64%!important}
  .heroAxisH{left:86%!important;top:64%!important}
  .heroCoreLogo{width:108px!important;height:108px!important}
  .heroCoreLogoAura{width:140px!important;height:140px!important}
  .heroRings{width:67vw!important}
  .heroLead{max-width:72%;color:#aaa69d}
  .project,.projectInner{min-height:100svh!important}
}

body.philoActive .header,body.philoActive .menuButton{visibility:hidden!important;opacity:0!important}

/* SELF-AUDIT: founder text must never create horizontal overflow */
.founderInner,.founderLead,.founderBody,.founderProfile{min-width:0}
.founderBody{width:100%}
.founderBody>p,.founderProfile p{width:100%;max-width:100%;white-space:normal;word-break:normal;overflow-wrap:anywhere}

/* SELF-AUDIT: sticky section labels clear the fixed navigation */
@media(max-width:900px){.approachTop{top:86px}}
@media(max-width:700px){
  .approachTop{top:80px;left:20px;right:20px}
  .founderInner{width:100%}
  .founderBody,.founderProfile{max-width:100%;overflow:hidden}
  .founderBody>p,.founderProfile p{font-size:15px;line-height:1.85}
  .founder blockquote{max-width:100%;font-size:clamp(36px,9vw,45px);line-height:1.3}
  .founderLead h2{max-width:9em;font-size:clamp(33px,8.2vw,41px);line-height:1.3}
}

@media(prefers-reduced-motion:reduce){
  .approachStage.active .approachGhost,.approachStage.active .approachIndex,.approachStage.active .approachCopy{animation:none!important}
}


/* ================================================================
   GOLD MASTER — STRUCTURAL HARDENING
   No display text may share physical space with body copy.
   ================================================================ */

/* Japanese body copy: allow natural phrase wrapping. */
.heroLead,
.successionBody p,
.visionLocked p,
.contactIntro p,
.founderBody p,
.companyData dd{
  word-break:normal;
  overflow-wrap:anywhere;
  line-break:strict;
}

/* Micro type remains editorial, but not illegibly small. */
.serviceLabel,.successionLabel,.cannotLabel,.projectLabel,.founderLabel,.visionLabel,.companyLabel,.contactLabel,
.approachTop,.heroKicker,.nav a,.mobileMenuMeta{
  font-size:10px;
}

/* SUCCESSION — hard separation between message / explanation / conclusion. */
.succession{
  min-height:100svh;
  display:block;
  position:relative;
  overflow:hidden;
  background:#f3f0e8;
}
.successionDark{
  top:0;right:0;bottom:0;left:auto;
  width:36%;height:auto;
}
.successionAxis,
.successionCore,
.succession:after{
  left:64%;
  top:50%;
}
.successionAxis{bottom:0;width:1px;height:auto}
.successionAxis:after{transform:translate(-64%,-50%)}
.successionInner{
  width:min(1540px,100%);
  min-height:100svh;
  margin:auto;
  padding:clamp(108px,10vw,158px) var(--pad) clamp(82px,8vw,120px);
  position:relative;
  z-index:6;
  display:grid;
  grid-template-columns:64% 36%;
  grid-template-rows:auto minmax(0,1fr) auto;
  column-gap:0;
}
.successionLabel{
  grid-column:1 / 3;
  grid-row:1;
}
.successionLead{
  grid-column:1;
  grid-row:2;
  align-self:center;
  padding:24px clamp(64px,6vw,110px) 18px 0;
  min-width:0;
}
.successionLead h2{
  max-width:none;
  width:min(100%,900px);
  margin:0;
  font-size:clamp(52px,5.2vw,80px);
  line-height:1.2;
  text-wrap:balance;
  word-break:keep-all;
}
.successionBody{
  grid-column:1;
  grid-row:3;
  align-self:end;
  max-width:none;
  padding:22px clamp(64px,6vw,110px) 0 0;
  border-top:1px solid rgba(17,16,12,.14);
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(24px,3vw,48px);
}
.successionBody p{
  max-width:34em;
  margin:0;
  color:#625d55;
  font-size:15px;
  line-height:1.9;
}
.successionStatement{
  position:static;
  grid-column:2;
  grid-row:3;
  width:auto;
  align-self:end;
  margin:0;
  padding:22px 0 0 clamp(38px,4vw,68px);
  border-top:1px solid rgba(255,255,255,.18);
  min-width:0;
}
.successionStatement strong{
  max-width:14em;
  color:#f3f0e8;
  font-size:clamp(22px,1.75vw,27px);
  line-height:1.62;
  overflow-wrap:normal;
}
.successionInherited{bottom:-.08em;font-size:clamp(190px,27vw,410px)}
.successionChosen{font-size:clamp(130px,17vw,260px)}

/* Tablet: retain the split, but body becomes one column before it gets cramped. */
@media(max-width:1000px) and (min-width:701px){
  .successionDark{width:32%}
  .successionAxis,.successionCore,.succession:after{left:68%}
  .successionAxis:after{transform:translate(-68%,-50%)}
  .successionInner{grid-template-columns:68% 32%}
  .successionLead{padding-right:56px}
  .successionLead h2{font-size:clamp(48px,6.2vw,66px)}
  .successionBody{grid-template-columns:1fr;padding-right:56px;gap:14px}
  .successionStatement{padding-left:30px}
  .successionStatement strong{font-size:clamp(19px,2.3vw,24px)}
}

/* Mobile: a vertical editorial page, followed by the dark conclusion panel. */
@media(max-width:700px){
  .succession{min-height:auto;background:#f3f0e8}
  .successionDark{
    position:absolute;
    top:auto;left:0;right:0;bottom:0;
    width:100%;height:25svh;
  }
  .successionAxis{
    left:0;right:0;top:auto;bottom:25svh;
    width:auto;height:1px;
  }
  .successionAxis:after{display:none}
  .successionCore,.succession:after{
    left:50%;top:auto;bottom:25svh;
    transform:translate(-50%,50%);
  }
  .successionInner{
    min-height:auto;
    display:block;
    padding:88px 20px calc(25svh + 56px);
  }
  .successionLabel{margin-bottom:46px}
  .successionLead{padding:0}
  .successionLead h2{
    width:100%;
    max-width:7.2em;
    font-size:clamp(39px,10vw,49px);
    line-height:1.2;
  }
  .successionBody{
    display:block;
    margin-top:40px;
    padding:20px 0 0;
    border-top:1px solid rgba(17,16,12,.14);
  }
  .successionBody p{margin:0 0 18px;font-size:15px;line-height:1.85}
  .successionStatement{
    position:absolute;
    left:20px;right:20px;bottom:38px;
    width:auto;
    padding:15px 0 0;
    border-top:1px solid rgba(255,255,255,.18);
    z-index:7;
  }
  .successionStatement span{color:#77726b;margin-bottom:11px}
  .successionStatement strong{
    color:#f3f0e8;
    max-width:16em;
    font-size:clamp(18px,4.7vw,22px);
    line-height:1.5;
  }
  .successionInherited{bottom:20svh;font-size:42vw}
  .successionChosen{left:50%;top:50%;transform:translate(-50%,-50%);font-size:29vw}
}

/* Contact / company long strings must never break the viewport. */
.companyData dd,.companyData a,.contactForm input,.contactForm textarea,.contactForm select{min-width:0;max-width:100%}
.companyData a{overflow-wrap:anywhere}

/* Service heading hierarchy after semantic cleanup. */
.serviceCopy h3{
  margin:0 0 12px;
  max-width:22em;
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(22px,1.8vw,29px);
  line-height:1.4;
}
@media(max-width:600px){
  .serviceCopy h3{font-size:clamp(19px,4.8vw,24px);line-height:1.45;margin-bottom:10px}
}


/* GOLD MASTER — MOBILE APPROACH MOTION MUST RESPECT MOBILE GEOMETRY */
@media(max-width:700px){
  .approachStage.active .approachCopy{
    animation:approachCopyMobileIn .28s var(--ease) both!important;
  }
  @keyframes approachCopyMobileIn{
    from{opacity:0;transform:translateY(10px)}
    to{opacity:1;transform:none}
  }
}
@media(prefers-reduced-motion:reduce){
  .approachStage.active .approachCopy{animation:none!important;transform:none!important}
}


/* GOLD MASTER — MICRO TYPE CONTRAST FLOOR */
/* Light surfaces */
.serviceLabel,.serviceStatement,.successionLabel,.successionOverline,.approachTop,.approachIndex,.approachBottom,.visionLabel,.companyLabel,.projectGift .projectLabel{
  color:#66615a!important;
}
/* Dark surfaces */
.cannotLabel,.founderLabel,.founderLead>p,.contactLabel,.contactSmall,.contactFoot{
  color:#817d75!important;
}
.founderProfile strong span{color:#817d75!important;font-size:10px}
.founderProfile p{color:#918c84!important}
.formNo{color:#77736b!important}
.formName{color:#918c84!important;font-size:10px}
.contactForm input::placeholder,.contactForm textarea::placeholder{color:#817d75!important}

/* ================================================================
   GOLD MASTER — FINAL PRECISION PASS
   Public-quality corrections after full visual audit.
   ================================================================ */

.noBreak{white-space:nowrap}

/* Utility text: quiet, but never microscopic. */
.nav a,
.heroKicker,
.heroMeta,
.bridgeText,
.serviceLabel,
.serviceStatement,
.serviceFoot,
.approachTop,
.approachIndex,
.approachBottom,
.successionLabel,
.successionOverline,
.cannotLabel,
.projectLabel,
.projectProof span,
.projectCopy a,
.projectSoon,
.bensaCondition span,
.founderLabel,
.founderLead>p,
.founderProfile strong span,
.visionLabel,
.companyLabel,
.contactLabel,
.contactSmall,
.contactFoot,
.formNo,
.formName,
.mobileMenuMeta{
  font-size:11px!important;
}

/* CANNOT is a complete chapter; do not let the next project label leak into it. */
.cannot{min-height:100svh;display:grid;align-items:center}

/* PROJECTS: labels sit below the fixed brand/navigation chrome. */
.projectLabel{
  top:96px!important;
  left:var(--pad)!important;
  z-index:12;
}
.projectBensa .projectLabel{color:var(--orange)!important}

/* BENSA official mark deserves real presence; copy and identity never compete. */
.bensaVisual{right:4vw;width:min(40vw,620px)}
.bensaVisual img{width:78%;opacity:1}
.projectBensa .projectCopy p{max-width:31em}

/* Photo Gift: keep the full THANK YOU composition visible on smaller canvases. */
@media(max-width:900px){
  .giftComposition{width:66vw;right:-2vw;opacity:.72}
}

@media(max-width:700px){
  .projectLabel{top:82px!important;left:20px!important;right:20px}
  .projectBensa .bensaVisual{
    width:70vw;
    right:0;
    top:25%;
    opacity:.62;
  }
  .projectBensa .bensaVisual img{width:82%}
  .projectBensa .projectCopy{bottom:7.5vh}
  .projectBensa .projectCopy p{max-width:23em}
  .giftComposition{
    top:10vh;
    width:78vw;
    height:48vh;
    right:-3vw;
    opacity:.72;
  }
  .giftPaperA{width:68%;height:74%;right:10%}
  .giftPaperB{width:58%;height:62%;right:20%}
  .giftPaperC{width:34%;height:31%;right:0;bottom:5%}
  .giftPaperB span{font-size:clamp(38px,10vw,52px)}
  .projectGift .projectCopy{bottom:7vh}
}

/* Form labels are interface text, not decoration. */
.formName{letter-spacing:.12em}
.formNo{letter-spacing:.10em}

/* Fine responsive safety. */
@media(max-width:430px){
  .projectCopy h2{max-width:8.2em}
  .projectCopy p{overflow-wrap:anywhere;line-break:strict}
  .contactSmall{font-size:10px!important;line-height:1.7}
}

/* ================================================================
   GOLD MASTER — HEADER CONTRAST SYSTEM
   Official logo variants are swapped explicitly; nav keeps per-pixel
   contrast through difference blending on its own layer.
   ================================================================ */
.header{mix-blend-mode:normal!important;color:#fff}
.headerHome{width:60px;height:60px;position:relative;display:block;flex:0 0 60px}
.headerLogo{position:absolute;inset:0;width:60px!important;height:60px!important;object-fit:contain;transition:opacity .18s ease}
.headerLogoWhite{opacity:1}
.headerLogoBlack{opacity:0}
.header.themeLight .headerLogoWhite{opacity:0}
.header.themeLight .headerLogoBlack{opacity:1}
.nav{mix-blend-mode:difference;color:#fff}
.nav a:after{background:currentColor}
@media(max-width:700px){
  .headerHome{width:54px;height:54px;flex-basis:54px}
  .headerLogo{width:54px!important;height:54px!important}
}

/* GOLD MASTER — NAVIGATION RESPONSE */
.header{transition:opacity .20s var(--ease),transform .20s var(--ease)!important}
body.philoActive .header{transition:opacity .18s var(--ease)!important}
@media(max-width:430px){.contactSmall{font-size:11px!important}}

/* ================================================================
   GOLD MASTER — REDUCED MOTION IS A COMPLETE ALTERNATE COMPOSITION
   Not simply "animations off": long sticky narratives collapse into
   readable static sections.
   ================================================================ */
@media(prefers-reduced-motion:reduce){
  .bridge{display:none!important}
  .philo{height:100svh!important;min-height:640px}
  .philoSticky{position:relative!important;height:100svh!important;min-height:640px}
  .scene{display:none!important}
  .philoDim{opacity:.42!important}
  .philoRing{opacity:.22!important}
  .philoLogo{opacity:0!important}
  .philoCoreAura{opacity:.45!important}
  .philoFinal{opacity:1!important;background:transparent!important}
  .exitWhite{display:none!important}

  .approach{height:auto!important;background:#f7f6f2}
  .approachSticky{position:relative!important;height:auto!important;overflow:visible!important;padding:104px var(--pad) 92px}
  .approachAxisV,.approachAxisH,.approachCore{display:none!important}
  .approachTop{position:static!important;margin:0 0 58px;display:flex!important}
  .approachStage,
  .approachStage.active{
    position:relative!important;inset:auto!important;display:grid!important;
    grid-template-columns:58px minmax(0,1fr)!important;
    min-height:0!important;padding:28px 0!important;border-top:1px solid rgba(17,16,12,.13)!important;
    opacity:1!important;transform:none!important;pointer-events:auto!important;
  }
  .approachStage:last-of-type{border-bottom:1px solid rgba(17,16,12,.13)!important}
  .approachGhost{display:none!important}
  .approachIndex{position:static!important;transform:none!important;align-self:start;padding-top:8px!important}
  .approachCopy{position:static!important;transform:none!important;width:auto!important;max-width:680px!important;opacity:1!important}
  .approachCopy h2{margin:0 0 10px!important;font-size:clamp(30px,3.2vw,46px)!important}
  .approachBottom{position:static!important;margin-top:34px!important}
}
@media(prefers-reduced-motion:reduce) and (max-width:700px){
  .philo{height:78svh!important;min-height:560px}
  .philoSticky{height:78svh!important;min-height:560px}
  .philoFinal h2{font-size:clamp(42px,10.4vw,52px)!important}
  .approachSticky{padding:88px 20px 72px}
  .approachTop{margin-bottom:42px}
  .approachStage,.approachStage.active{grid-template-columns:42px minmax(0,1fr)!important;padding:23px 0!important}
  .approachCopy h2{font-size:clamp(29px,7.4vw,36px)!important}
}


/* GOLD MASTER — ANCHOR / FIXED HEADER FINALIZATION */
html{scroll-padding-top:0!important}
.approachTop{top:96px}
@media(max-width:900px){.approachTop{top:86px}}
@media(max-width:700px){.approachTop{top:80px;left:20px;right:20px}}


/* ===== PHILOSOPHY MOTION LEGIBILITY — FINAL =====================
   Motion must be felt without captions or UI.
   ================================================================= */
.philo{height:590vh!important}
.sceneOrganic .sceneShade,
.sceneGeometric .sceneShade{
  background:radial-gradient(circle at 50% 50%,transparent 0 14%,rgba(0,0,0,.10) 42%,rgba(0,0,0,.52) 100%)!important;
}
.sceneOrganic .organicWash{opacity:1.35}
.sceneDigital video{
  filter:brightness(.68) contrast(1.12) saturate(.64)!important;
}
.sceneDigital .sceneShade{
  background:radial-gradient(circle at 50% 50%,transparent 0 16%,rgba(0,0,0,.08) 45%,rgba(0,0,0,.44) 100%)!important;
}
.sceneDigital .digitalPanels{opacity:.62!important}

@media(max-width:900px){
  .philo{height:550vh!important}
}
@media(max-width:600px){
  .philo{height:520vh!important}
  .sceneOrganic .sceneShade,.sceneGeometric .sceneShade{background:radial-gradient(circle at 50% 50%,transparent 0 17%,rgba(0,0,0,.08) 44%,rgba(0,0,0,.46) 100%)!important}
}
@media(prefers-reduced-motion:reduce){
  .philo{height:100svh!important}
}

/* ================================================================
   UI/UX FUNDAMENTALS PASS — 2026-09
   Applied after pro-ui-director + UI/UX Design Basics review.
   ================================================================ */

/* Screen-reader-only text. */
.srOnly{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* Body reading floor: mobile body copy is never smaller than 16px. */
@media(max-width:700px){
  .heroLead,
  .serviceCopy p,
  .approachCopy p,
  .successionBody p,
  .projectCopy p,
  .founderBody>p,
  .founderProfile p,
  .visionLocked p,
  .companyData dd,
  .contactIntro p{
    font-size:16px!important;
    line-height:1.8!important;
  }
}

/* Interactive affordance: touch targets meet a 44px minimum without adding visual bulk. */
.projectCopy a,
.companyData a{
  min-height:44px;
  display:inline-flex;
  align-items:center;
}
.projectCopy a{padding:8px 0}
.companyData a{padding:6px 0}

/* Contact is a conversation: acknowledge submit immediately and prevent double-submit. */
.contactForm button:disabled{
  cursor:wait;
  opacity:.66;
}
.contactForm button:disabled:before{transform:none}
.contactForm button:disabled span{color:#111}
.formStatus{
  min-height:22px;
  margin:10px 0 0;
  color:#9a958c;
  font-size:12px;
  line-height:1.6;
}

/* Fine-pointer affordance: the custom cursor must still communicate interactivity. */
@media(pointer:fine){
  .cursorRing{transition:width .18s var(--ease),height .18s var(--ease),opacity .18s var(--ease)}
  body.cursorInteractive .cursorRing{width:42px;height:42px;opacity:.88}
}



/* UI/UX FUNDAMENTALS — preserve native pointing conventions. */
@media(pointer:fine){
  body{cursor:auto!important}
  a,button,select{cursor:pointer!important}
  input,textarea{cursor:text!important}
  .cursorDot,.cursorRing{display:none!important}
}

/* ================================================================
   UI/UX FUNDAMENTALS — FIRST 3 SECONDS / TOUCH FINALIZATION
   ================================================================ */
/* Brand intro may precede meaning, but must never delay it. */
.heroGrid{transition:opacity .72s .48s var(--ease)!important}
.heroAxisV{transition:height .68s .45s var(--ease)!important}
.heroAxisH{transition:width .72s .52s var(--ease)!important}
.heroGlow{transition:opacity .42s .18s ease,transform .54s .18s var(--ease)!important}
.heroCoreLogo{transition:opacity .56s .28s var(--ease),transform .62s .28s var(--ease)!important}
.heroCoreLogoAura{transition:opacity .62s .28s ease!important}
.heroKicker{transition:opacity .52s .78s var(--ease),transform .52s .78s var(--ease)!important}
.hero h1{transition:opacity .12s .52s linear,clip-path .78s .52s var(--ease)!important}
.heroLead{transition:opacity .58s .88s var(--ease),transform .58s .88s var(--ease)!important}
.heroMeta{transition:opacity .52s 1.12s ease!important}

/* Silent bridge = short pause, not empty waiting time. */
.bridge{height:22vh!important}
@media(max-width:900px){.bridge{height:16vh!important}}
@media(max-width:600px){.bridge{height:12vh!important}}

/* Form controls themselves also meet the 44px touch floor. */
@media(max-width:700px){
  .contactForm input,.contactForm select{min-height:44px!important}
}


/* ===== PHILOSOPHY IMAGE SEQUENCE REBUILD v1 ===================== */
.philo{height:560vh!important;background:#000}
.philoSticky{background:#000}
.philo .scene{position:absolute;inset:0;opacity:0;overflow:hidden;will-change:opacity,transform;transform-origin:50% 50%}
.philo .sceneMedia{position:absolute;inset:-3%;width:106%;height:106%;object-fit:cover;filter:none!important;will-change:transform,filter}
.philoVignette{position:absolute;z-index:24;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 50%,transparent 0 15%,rgba(0,0,0,.04) 32%,rgba(0,0,0,.34) 74%,rgba(0,0,0,.68) 100%)}
.philoCoreField{position:absolute;z-index:25;left:50%;top:50%;width:310px;height:310px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,246,214,.17) 0,rgba(255,239,190,.08) 18%,rgba(0,0,0,.38) 50%,rgba(0,0,0,0) 72%);pointer-events:none;mix-blend-mode:screen}
.philoCorePulse{position:absolute;z-index:26;left:50%;top:50%;width:8px;height:8px;border-radius:50%;transform:translate(-50%,-50%);background:#fffdf4;box-shadow:0 0 14px #fff7d9,0 0 40px rgba(255,236,175,.72),0 0 100px rgba(255,229,144,.32);animation:coreBreath 3.8s ease-in-out infinite;pointer-events:none}
@keyframes coreBreath{0%,100%{transform:translate(-50%,-50%) scale(.88);filter:brightness(.9)}50%{transform:translate(-50%,-50%) scale(1.2);filter:brightness(1.18)}}
.philoLogo{z-index:30!important;width:150px!important;height:150px!important;object-fit:contain;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;filter:drop-shadow(0 0 18px rgba(255,244,210,.15))}
.philoFinal{z-index:44}
.philoFinal h2{font-size:clamp(52px,6.2vw,96px)!important}
@media(max-width:700px){
  .philo{height:500vh!important}
  .philo .sceneMedia{inset:-10%;width:120%;height:120%}
  .philoLogo{width:118px!important;height:118px!important}
  .philoCoreField{width:240px;height:240px}
  .philoFinal h2{font-size:clamp(40px,10vw,50px)!important}
}
@media(prefers-reduced-motion:reduce){
  .philo{height:100svh!important;min-height:640px!important}
  .philo .scene{display:none!important}
  .philo .scene:first-child{display:block!important;opacity:1!important;transform:none!important}
  .philoCorePulse{animation:none!important}
  .philoFinal{opacity:1!important}
  .philoLogo{opacity:.22!important}
}

/* ABOUT: factual on top page; personal story belongs to Message page. */
.founderSimple{padding:clamp(92px,9vw,138px) 0!important;background:#0a0a09!important}
.founderSimple:after{content:"ABOUT"!important;font-size:clamp(130px,20vw,300px)!important}
.founderSimpleInner{grid-template-columns:.75fr 1.25fr!important;row-gap:34px!important}
.founderSimple .founderLead h2{font-size:clamp(38px,4vw,58px)!important;line-height:1.2!important}
.founderSimpleBody{grid-column:2!important;margin:0!important;max-width:700px!important}
.founderSimpleBody p{font-size:16px!important;line-height:1.9!important;color:#aaa59d!important;max-width:620px!important}
.founderMessageLink{display:inline-flex;align-items:center;gap:20px;margin-top:24px;min-height:48px;padding:0 0 4px;color:#f5f2ea;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.35);font-size:12px;letter-spacing:.08em}
.founderMessageLink span{transition:transform .25s ease}.founderMessageLink:hover span{transform:translateX(5px)}
@media(max-width:700px){.founderSimpleInner{grid-template-columns:1fr!important}.founderSimpleBody{grid-column:1!important}.founderSimple .founderLead h2{font-size:clamp(34px,8.6vw,43px)!important}}

/* Founder message scaffold */
.messagePage{margin:0;background:#080808;color:#f4f1e9;font-family:var(--sans)}
.messageMain{min-height:100svh;padding:clamp(30px,4vw,60px) var(--pad) clamp(70px,8vw,130px);display:flex;flex-direction:column}
.messageBack{color:#8d8981;text-decoration:none;font-size:11px;letter-spacing:.14em}
.messageLabel{margin-top:clamp(90px,12vw,180px);color:#77736c;font-size:10px;letter-spacing:.17em}
.messageMain h1{margin:24px 0 70px;font-family:var(--serif);font-size:clamp(54px,7vw,110px);font-weight:400;line-height:1.1}
.messagePlaceholder{max-width:680px;margin-left:auto;font-family:var(--serif);font-size:18px;line-height:2;color:#aaa59d}
.messageName{margin-top:auto;padding-top:90px;font-size:15px}.messageName span{font-size:9px;letter-spacing:.15em;color:#77736c}


/* ===== FOUNDER MESSAGE — EDITORIAL READING PAGE ================= */
.messagePage{margin:0;background:#080808;color:#f4f1e9;font-family:var(--sans)}
.messageHeader{position:fixed;z-index:20;left:0;right:0;top:0;height:84px;padding:0 var(--pad);display:flex;align-items:center;justify-content:space-between;mix-blend-mode:normal;background:linear-gradient(to bottom,rgba(8,8,8,.82),rgba(8,8,8,0))}
.messageBrand{display:block;width:66px}.messageBrand img{display:block;width:100%;height:auto}
.messageBack{color:#8d8981;text-decoration:none;font-size:10px;letter-spacing:.16em;display:flex;align-items:center;gap:10px;min-height:44px}
.messageMain{min-height:100svh;padding:clamp(126px,13vw,190px) var(--pad) clamp(90px,10vw,150px);display:grid;grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);column-gap:clamp(70px,10vw,170px);position:relative}
.messageIntro{position:sticky;top:140px;align-self:start}
.messageLabel{font-size:9px;letter-spacing:.18em;color:#77736c;margin-bottom:28px}
.messageMain h1{margin:0;font-family:var(--serif);font-size:clamp(48px,5.3vw,82px);font-weight:400;line-height:1.08;letter-spacing:-.02em}
.messageLead{margin:38px 0 0;font-family:var(--serif);font-size:clamp(18px,1.5vw,23px);line-height:1.6;color:#9b978f}
.messageArticle{max-width:720px;margin-left:auto;padding-top:6px;font-family:var(--serif);font-size:clamp(17px,1.15vw,19px);line-height:2.05;color:#c7c2b8}
.messageArticle>p{margin:0 0 2.1em}
.messageArticle>p:first-child{color:#f4f1e9}
.messageCreed{margin-top:clamp(64px,8vw,120px)!important;padding-top:clamp(42px,5vw,68px);border-top:1px solid rgba(255,255,255,.14);font-size:clamp(28px,3vw,46px)!important;line-height:1.65!important;color:#f4f1e9!important;letter-spacing:-.01em}
.messageSignature{margin-top:clamp(58px,6vw,90px);padding-top:26px;border-top:1px solid rgba(255,255,255,.09);font-family:var(--sans);color:#8d8981}
.messageSignature p{margin:0 0 7px;font-size:11px;letter-spacing:.03em}.messageSignature strong{display:block;margin-top:22px;color:#f4f1e9;font-family:var(--serif);font-size:24px;font-weight:400}.messageSignature span{display:block;margin-top:6px;font-size:9px;letter-spacing:.16em;color:#6f6b65}
.messageEndMark{position:absolute;left:var(--pad);bottom:80px;width:34px;height:34px;border:1px solid rgba(255,255,255,.16);border-radius:50%}.messageEndMark i{position:absolute;left:50%;top:50%;width:5px;height:5px;border-radius:50%;background:#f4f1e9;transform:translate(-50%,-50%);box-shadow:0 0 24px rgba(255,249,226,.34)}
@media(max-width:760px){.messageHeader{height:70px;padding:0 20px}.messageBrand{width:50px}.messageMain{display:block;padding:110px 20px 88px}.messageIntro{position:static}.messageMain h1{font-size:clamp(44px,12vw,60px)}.messageLead{margin-top:24px}.messageArticle{margin:72px 0 0;max-width:none;font-size:16px;line-height:1.95}.messageArticle>p{margin-bottom:1.95em}.messageCreed{font-size:clamp(26px,7.2vw,34px)!important;line-height:1.58!important}.messageEndMark{display:none}}