:root{color-scheme:light;--paper:#f4f4ef;--ink:#222322;--muted:#62655e;--line:#bfc2b9;--accent:#c8ff66;--dark:#222322;--dark-text:#eeefe7;--indigo:#34458e;--cyan:#075b68}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:5rem}body{margin:0;background:var(--paper);color:var(--ink);font:1rem/1.8 Arial,"Yu Gothic",Meiryo,sans-serif}h1,h2,h3,p{margin:0}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid #b65411;outline-offset:5px}.page{max-width:1800px;margin:auto;border-inline:1px solid var(--line)}.skip{position:fixed;top:-5rem;left:1rem;background:white;padding:1rem;z-index:20}.skip:focus{top:1rem}.nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:76px;border-bottom:1px solid var(--line);padding:0 3.2%;background:var(--paper);position:relative;z-index:5}.brand{display:flex;align-items:baseline;gap:1rem;font-weight:800;font-size:1.5rem;letter-spacing:-.05em}.brand span{font-size:.875rem;font-weight:400;letter-spacing:0}.nav>div{display:flex;gap:2rem}.nav>div a{min-height:48px;display:flex;align-items:center;gap:1rem;font-size:.875rem}.nav>div a:hover{text-decoration:underline;text-underline-offset:6px}.hero{display:grid;grid-template-columns:1fr 1fr}.hero-copy{padding:clamp(2rem,5vw,6rem) clamp(1.5rem,4vw,5rem);min-height:620px;display:flex;align-items:flex-start;flex-direction:column;justify-content:center}.eyebrow,.product-top,.panel-caption,.section-heading>p:first-child{font:.8125rem/1.5 Consolas,"Courier New",monospace;letter-spacing:.045em}.eyebrow{margin-bottom:2rem;color:var(--muted)}h1{font-size:clamp(2.2rem,3.6vw,4.4rem);font-weight:600;line-height:1.5;letter-spacing:-.08em}h1>span{display:block;animation:enter .9s both cubic-bezier(.2,.7,.2,1)}h1>span+span{animation-delay:.12s}.bio{margin:1.7rem 0 2rem;color:#4b4e46;line-height:1.95}.button{display:flex;justify-content:space-between;align-items:center;gap:3rem;background:var(--ink);color:var(--paper);min-height:52px;padding:.65rem 1.4rem;transition:background .2s,color .2s}.button:hover{background:var(--accent);color:var(--ink)}.button span{font-size:1.4rem;transition:transform .25s}.button:is(:hover,:focus-visible) span{transform:translate(3px,3px)}.about{min-height:44px;display:flex;align-items:center;margin-top:.8rem;font-size:.875rem}.motion-panel{position:relative;overflow:hidden;background:var(--dark);color:var(--dark-text);min-height:620px;border-left:1px solid var(--ink);isolation:isolate}.motion-art{position:absolute;inset:0;display:grid;place-items:center;perspective:900px;overflow:hidden}.orbit{position:absolute;width:78%;aspect-ratio:1;border-radius:50%;border:1px solid #7f865f;background:repeating-radial-gradient(circle,transparent 0 13px,#b9c996 14px 14.7px,transparent 15.5px 25px);opacity:.42;animation:orbit 16s linear infinite;mask-image:linear-gradient(110deg,transparent,#000 30% 70%,transparent)}.orbit-two{width:90%;animation:orbit-two 19s linear infinite;opacity:.3}.orbit-three{width:66%;background:radial-gradient(#b9c996 .8px,transparent 1.3px) 0 0/7px 7px;animation:orbit-three 22s linear infinite;opacity:.6;border:0}.orbit-type{position:relative;z-index:1;display:flex;flex-direction:column;text-align:center;font-weight:900;font-size:clamp(3.3rem,6.4vw,7.5rem);letter-spacing:-.075em;line-height:.95;transform:rotate(-9deg);text-shadow:0 2px 18px #222322}.orbit-type span{animation:type-drift 7s ease-in-out infinite alternate}.orbit-type span:nth-child(2){color:var(--accent);animation-delay:-2s}.orbit-type span:nth-child(3){animation-delay:-4s}.cross{position:absolute;color:#c6c8bc;font:1.4rem Consolas,monospace}.cross-one{top:2rem;left:2rem}.cross-two{bottom:4.5rem;right:2rem}.panel-caption{position:absolute;bottom:1.5rem;left:2rem;right:2rem;display:flex;justify-content:space-between;gap:1rem;font-size:.75rem;color:#c6c8bc}.motion-toggle{position:absolute;top:1.5rem;right:1.5rem;opacity:0;width:10.5rem;height:44px;margin:0;z-index:4;cursor:pointer}.motion-control{position:absolute;right:1.5rem;top:1.5rem;z-index:3;min-height:44px;display:flex;align-items:center;border:1px solid #838779;padding:0 .8rem;font-size:.875rem;cursor:pointer;background:var(--dark);width:10.5rem;justify-content:center}.play-label{display:none}.motion-toggle:checked~.motion-control .pause-label{display:none}.motion-toggle:checked~.motion-control .play-label{display:inline}.motion-toggle:checked~.motion-art *{animation-play-state:paused}.motion-toggle:focus-visible+.motion-control{outline:3px solid var(--accent);outline-offset:4px}.nameplate{grid-column:1/-1;border-block:1px solid var(--line);display:flex;align-items:flex-end;justify-content:space-between;padding:2.2rem 3.2% 2.7rem;gap:2rem}.nameplate>span{font-size:clamp(5rem,17vw,20rem);font-weight:700;line-height:.8;letter-spacing:-.08em}.nameplate>div{font:.8125rem/1.5 Consolas,monospace;padding-bottom:.2rem;white-space:nowrap}.section{padding:5rem 3.2%;border-bottom:1px solid var(--line)}.section-heading{margin-bottom:2.5rem}.section-heading>p:first-child{margin-bottom:1rem;color:var(--muted)}h2{font-size:clamp(1.8rem,3vw,3rem);line-height:1.4;font-weight:500;letter-spacing:-.055em}.products{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line)}.product{padding:2.5rem 2.5rem 0;position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:490px;transition:background .4s}.product+.product{border-left:1px solid var(--line)}.product:is(:hover,:focus-within){background:#e9ebdf}.product-top{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;color:var(--muted);margin-bottom:2.5rem}.product h3{font-size:clamp(1.9rem,3vw,3rem);line-height:1.35;letter-spacing:-.055em}.product h3 span{display:block;margin-top:.6rem;font-size:.875rem;letter-spacing:0;font-weight:400;color:var(--muted)}.description{margin:1.5rem 0;max-width:34rem;font-size:1rem;flex:1}.actions{display:flex;gap:1.5rem;flex-wrap:wrap;margin-bottom:2.5rem}.actions a{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:44px;border-bottom:1px solid var(--ink);font-size:.9375rem}.actions a:hover{color:var(--indigo)}.actions span{transition:transform .2s}.actions a:is(:hover,:focus-visible) span{transform:translate(3px,-3px)}.product-word{font-size:clamp(4rem,8vw,9rem);line-height:1;font-weight:800;letter-spacing:-.07em;color:var(--indigo);margin-top:0;padding-bottom:.14em;transition:transform .45s cubic-bezier(.2,.7,.2,1)}.framespec .product-word{color:var(--cyan)}.product:is(:hover,:focus-within) .product-word{transform:translateX(.035em)}.resources{display:grid;grid-template-columns:1fr 1.5fr;gap:4rem;background:var(--dark);color:var(--dark-text)}.resources .section-heading>p:first-child{color:#bec1b4}.resource{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:1.5rem 0;border-bottom:1px solid #585c50}.resource:first-child{padding-top:0}.resource-type{color:#c0c5b4;font-size:.875rem}.resource h3{font-size:1.2rem;line-height:1.6;margin:.25rem 0 .6rem;font-weight:500}.resource p{font-size:1rem;color:#c0c5b4;line-height:1.85}.resource-arrow{flex-shrink:0;font-size:1.6rem;color:var(--accent);transition:transform .25s}.resource:is(:hover,:focus-visible) .resource-arrow{transform:translate(4px,-4px)}.resource:is(:hover,:focus-visible) h3{color:var(--accent)}.skills-note{font-size:.875rem;color:var(--accent);padding:1.6rem 0 .3rem}.connect{display:grid;grid-template-columns:1fr 1.5fr;gap:4rem}.connect-copy{font-size:1rem;color:var(--muted);margin-top:1.5rem}.socials{border-top:1px solid var(--line)}.socials a{display:grid;grid-template-columns:1fr 1fr auto;align-items:center;gap:1rem;min-height:85px;border-bottom:1px solid var(--line);transition:background .3s}.socials a:is(:hover,:focus-visible){background:var(--accent)}.socials strong{font-size:1.5rem;font-weight:500;letter-spacing:-.04em}.socials span{font-size:.875rem;color:var(--muted)}.socials b{font-size:1.5rem;font-weight:400;transition:transform .25s}.socials a:is(:hover,:focus-visible) b{transform:translate(-3px,-3px)}footer{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:2rem 3.2%;font-size:.875rem}.footer-brand{font-size:2.3rem;font-weight:700;letter-spacing:-.065em}.footer-brand span{font-size:.875rem;letter-spacing:0;font-weight:400;margin-left:1rem}footer a{display:flex;align-items:center;min-height:44px}
@keyframes plate-enter{from{opacity:.4;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes enter{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}@keyframes orbit{from{transform:rotateZ(-25deg) rotateY(30deg) rotateX(45deg)}to{transform:rotateZ(335deg) rotateY(30deg) rotateX(45deg)}}@keyframes orbit-two{from{transform:rotateZ(30deg) rotateX(55deg) rotateY(20deg)}to{transform:rotateZ(-330deg) rotateX(55deg) rotateY(20deg)}}@keyframes orbit-three{from{transform:rotateY(30deg) rotateZ(0)}to{transform:rotateY(30deg) rotateZ(360deg)}}@keyframes type-drift{from{transform:translateX(-7px)}to{transform:translateX(7px)}}
@supports(animation-timeline:view()){.nameplate>span{animation:plate-enter linear both;animation-timeline:view();animation-range:entry 0% entry 80%}}
@media(max-width:1000px){.hero-copy,.motion-panel{min-height:560px}.hero-copy{padding:3rem 2rem}h1{font-size:2.5rem}.nav>div{gap:1.2rem}.product{padding:2rem 1.5rem 0}.resources,.connect{gap:2rem;grid-template-columns:1fr 1.4fr}.socials a{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;row-gap:.2rem;padding-block:1rem}.socials span{grid-row:2;font-size:.875rem;margin:0}.socials b{grid-column:2;grid-row:1/3}.socials strong{padding:0}.nameplate>div{font-size:.75rem}}
@media(max-width:700px){html{scroll-padding-top:1rem}.nav{padding:.8rem 1.25rem;flex-wrap:wrap;gap:.3rem}.brand{font-size:1.4rem}.brand span{font-size:.8125rem}.nav>div{gap:1.4rem}.nav>div a{font-size:.8125rem;min-height:44px}.hero{grid-template-columns:1fr}.hero-copy{min-height:0;padding:3rem 1.5rem}.eyebrow{margin-bottom:1.5rem}h1{font-size:clamp(2rem,7.8vw,3.3rem)}.bio{font-size:.9375rem}.motion-panel{min-height:380px;border-left:0}.orbit{width:65%;max-width:380px}.orbit-two{width:80%;max-width:460px}.orbit-three{width:55%;max-width:300px}.orbit-type{font-size:4.8rem}.nameplate{padding:1.8rem 1.25rem 2rem;gap:1rem}.nameplate>span{font-size:18vw}.nameplate>div{display:none}.section{padding:3rem 1.25rem}.products{grid-template-columns:1fr}.product{min-height:460px;padding:2rem 1.4rem 0}.product+.product{border-left:0;border-top:1px solid var(--line)}.product-top{font-size:.75rem;margin-bottom:2rem}.product h3{font-size:2.3rem}.product-word{font-size:5.8rem}.resources,.connect{display:block}.section-heading{margin-bottom:2rem}.resource{gap:1.25rem}.resource h3{font-size:1.125rem}.resource p{font-size:1rem}.resource-type{font-size:.875rem}.socials a{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;grid-template-rows:auto;min-height:80px;column-gap:.5rem}.socials strong{padding:0;font-size:1.3rem}.socials span{grid-row:auto;margin:0;font-size:.875rem;overflow-wrap:anywhere}.socials b{grid-row:auto;grid-column:auto}footer{padding:1.5rem 1.25rem;flex-wrap:wrap}.footer-brand{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.motion-control,.motion-toggle{display:none}}

/* Official social marks: preserve proportions and brand colors. */
.socials strong{display:flex;align-items:center;gap:16px}.social-icon{display:block;flex:0 0 36px;width:36px;height:36px;object-fit:contain}
@media(max-width:700px){.socials a{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) auto}.socials strong{font-size:1.125rem;gap:12px}.social-icon{flex-basis:28px;width:28px;height:28px}}
.socials img.social-icon{transform:scale(1.45)}
