/* Fluid sizing keeps intrinsic image and canvas dimensions out of the layout. */
.hero-art canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero-art.grid-ready img{visibility:hidden;animation:none}
.identity-visual canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.identity-visual.grid-ready>img{visibility:hidden}
.site-header,.site-header .logo,.hero-content,.section-heading>* ,.patent-row>* ,.identity>*{min-width:0}
.site-header{position:relative;background:var(--void);height:auto;min-height:104px;gap:24px}
.hero{min-height:690px;padding-top:96px;padding-bottom:115px}
.hero h1{letter-spacing:-.052em;line-height:1.04}
.hero-art:after{background:linear-gradient(90deg,#080b10 0%,#080b10e8 27%,#080b1040 59%,transparent 82%),linear-gradient(0deg,#080b10,transparent 28%)}
.hero-foot{flex-wrap:wrap}
.patent-name h3{overflow-wrap:break-word}
.logo-image{width:100%;height:100%;object-fit:contain}
@media(max-width:900px){.site-header{min-height:94px}.site-header nav{gap:18px}.site-header nav>a{white-space:nowrap}.hero{min-height:690px}.hero h1{font-size:clamp(70px,10vw,100px)}.section-heading>p{flex-basis:40%}.identity-content{min-width:0}}
@media(max-width:640px){.site-header{min-height:88px}.site-header nav{top:100%}.hero{min-height:670px;padding-top:66px;padding-bottom:110px}.hero h1{font-size:clamp(62px,17vw,95px)}.hero-art:after{background:linear-gradient(90deg,#080b10e8,#080b1050),linear-gradient(0deg,#080b10,transparent 30%)}.hero-foot{font-size:10px}.identity-visual-label{right:24px}.portfolio-note{overflow-wrap:anywhere}.site-footer{min-width:0}}
@media(max-width:360px){.site-header{gap:12px}.site-header .logo{width:clamp(90px,45vw,150px);max-width:60%}.hero h1{font-size:clamp(42px,17vw,62px)}.section-heading h2,.identity h2{font-size:clamp(28px,11vw,36px)}.patent-name h3{font-size:clamp(24px,8vw,28px)}dl>div{grid-template-columns:1fr;gap:3px}.hero-foot{letter-spacing:.04em;overflow-wrap:anywhere}.hero-description{overflow-wrap:break-word}}