:root{--black:#000;--white:#fff;--side:6.6vw;--brand:Arial,sans-serif;--footer-height:48px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--black);color:#111;font-family:Arial,'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button,a,input,textarea,[tabindex]{outline-offset:5px}a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:2px solid #969696}p,h1,h2,h3{margin:0}
.hero{background:#000;min-height:63.3vw;display:flex;align-items:center;justify-content:center;color:#fff;overflow:hidden}
.hero-lockup{text-align:center;width:100%}
h1{font-family:var(--brand);font-weight:700;font-size:17.25vw;line-height:.83;letter-spacing:-.95vw;display:flex;align-items:center;flex-direction:column}
h1 span{display:block;padding-right:.95vw;background:linear-gradient(110deg,#fff 0%,#b8bdd0 22%,#eee2ec 42%,#b9ced2 62%,#fff 82%,#b8bdd0 100%);background-size:200% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:pearl 5s linear infinite alternate}
.hero-subtitle{font-size:clamp(11px,2vw,30px);font-weight:400;letter-spacing:1.85vw;margin-top:4.1vw;padding-left:1.85vw}
@keyframes pearl{from{background-position:0% 50%}to{background-position:100% 50%}}
.positive{--section-bg:#fff;--section-fg:#111}.negative{--section-bg:#000;--section-fg:#fff}.section{background:var(--section-bg);color:var(--section-fg);position:relative;padding-left:var(--side);padding-right:var(--side);overflow:hidden}
.section-heading{position:relative;z-index:1}h2{font-size:5vw;line-height:1;font-weight:700;letter-spacing:-.055em}.section-heading:after{content:'';display:block;width:2.8vw;min-width:20px;height:1px;background:currentColor;opacity:.55;margin-top:2vw}
.about{min-height:48vw;padding-top:7.6vw;padding-bottom:6vw;display:flex;align-items:flex-start}
.about-content{position:relative;z-index:1;width:100%}.about-copy{font-size:clamp(14px,1.72vw,25px);line-height:1.85;margin-top:2.2vw;letter-spacing:.015em;color:#111}.about-copy span{display:block}.sg-background{position:absolute;width:53vw;height:auto;right:-2vw;top:3.3vw;opacity:.065;pointer-events:none;image-rendering:auto}
.service{min-height:36.3vw;padding-top:4.5vw;padding-bottom:4.5vw}.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4vw;margin-top:1.7vw}.service-grid article{padding-right:2.2vw;min-height:17vw}.service-grid article+article{border-left:1px solid #555;padding-left:4vw;padding-right:0}.service-number{font-size:clamp(11px,1.5vw,21px);margin-bottom:1.55vw}h3{font-size:clamp(12px,1.6vw,23px);line-height:1.3;letter-spacing:-.015em;font-weight:700}.service-grid h3:after{content:'';display:block;width:2.7vw;min-width:20px;height:1px;background:#777;margin:1.6vw 0}.service-grid article>p:last-child{font-size:clamp(12px,1.52vw,22px);line-height:1.8}
.works{min-height:46.2vw;padding-top:3.3vw;padding-bottom:calc(6vw + var(--footer-height));padding-left:3.5vw;padding-right:2.6vw}.works .section-heading{margin-left:3.1vw}.works-viewport{overflow-x:auto;scrollbar-width:none;margin-top:3vw;touch-action:pan-x pan-y}.works-viewport::-webkit-scrollbar{display:none}.works-track{display:flex;gap:1.7vw}.work{flex:0 0 calc((100% - 5.1vw)/4);min-width:0}.work-image{aspect-ratio:1.2;background:#ececec;display:flex;align-items:center;justify-content:center;color:#999;font-size:clamp(12px,1.5vw,22px);letter-spacing:.15em}.work h3{margin-top:1.5vw;font-size:clamp(10px,1.2vw,17px);letter-spacing:.07em}.work>p{font-size:clamp(10px,1.12vw,16px);line-height:1.7;margin-top:.4vw;letter-spacing:.04em}.works-dots{display:flex;justify-content:center;gap:10px;margin-top:3.5vw}.works-dots button{border:1px solid #b4b4b4;background:transparent;padding:0;width:6px;height:6px;border-radius:50%;cursor:pointer}.works-dots button[aria-current=true]{background:#111;border-color:#111}
.floating-footer{position:fixed;z-index:10;bottom:0;left:0;right:0;height:var(--footer-height);background:#000;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 4.1vw;font-size:11px;letter-spacing:.27em}.footer-brand{font-family:var(--brand);font-weight:700}.footer-contact{display:flex;align-items:center;gap:24px}.footer-contact span{font-size:20px;letter-spacing:0;font-weight:400}
.contact-page{background:#fff;min-height:100svh}.contact-main{max-width:850px;padding:100px 40px 110px;margin:0 auto}.contact-main h1{display:block;color:#111;font-family:Arial,sans-serif;font-size:48px;line-height:1;letter-spacing:-.05em;text-align:left}.contact-main form{margin-top:60px;display:grid;gap:28px}.contact-main label{display:grid;gap:10px;font-size:14px}.contact-main input,.contact-main textarea{width:100%;border:1px solid #bbb;border-radius:0;background:#fff;padding:14px;color:#111}.contact-main textarea{min-height:180px;resize:vertical}.form-actions{display:flex;justify-content:space-between;align-items:center;gap:20px}.form-actions button{background:#000;color:#fff;border:1px solid #000;padding:14px 28px;cursor:pointer;font-size:13px}.form-note,.form-status{font-size:12px;line-height:1.8;color:#555}.form-status{color:#111}
@media(min-width:1600px){:root{--footer-height:54px}}
@media(max-width:600px){:root{--side:11.7vw;--footer-height:42px}.hero{min-height:124vw}h1{font-size:20.6vw;line-height:.91;letter-spacing:-1vw}h1 span{padding-right:1vw}.hero-subtitle{font-size:3vw;letter-spacing:2.3vw;margin-top:6.1vw;padding-left:2.3vw}h2{font-size:11.7vw;letter-spacing:-.06em}.section-heading:after{width:8.5vw;margin-top:4.8vw}.about{min-height:171vw;padding-top:18vw;padding-bottom:25vw}.about-copy{font-size:clamp(14px,4.55vw,19px);line-height:1.8;margin-top:5.5vw;letter-spacing:.005em}.about-copy span{display:inline}.sg-background{width:89vw;right:-14vw;top:49vw;opacity:.065}.service{min-height:200vw;padding-top:13vw;padding-bottom:13vw}.service-grid{display:block;margin-top:6vw}.service-grid article,.service-grid article+article{padding:0;border-left:0;min-height:0}.service-grid article+article{border-top:1px solid #333;margin-top:8vw;padding-top:6vw}.service-number{font-size:12px;margin-bottom:3vw}.service-grid h3{font-size:4.55vw}.service-grid h3:after{display:none}.service-grid article>p:last-child{font-size:4.55vw;line-height:1.8;margin-top:4vw}.works{min-height:124vw;padding-top:12vw;padding-left:10vw;padding-right:10vw;padding-bottom:calc(18vw + var(--footer-height))}.works .section-heading{margin-left:0}.works-viewport{margin-top:8vw;margin-right:-10vw}.works-track{gap:5vw;padding-right:10vw}.work{flex-basis:80vw}.work-image{aspect-ratio:1.65;font-size:15px}.work h3{font-size:11px;margin-top:4vw}.work>p{font-size:11px;margin-top:1vw}.works-dots{margin-top:8vw}.floating-footer{padding:0 6vw;font-size:9px;letter-spacing:.09em}.footer-contact{gap:10px}.footer-contact span{font-size:17px}.contact-main{padding:65px 24px 100px}.contact-main h1{font-size:38px}.contact-main form{margin-top:45px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}h1 span{animation:none}}
/* Fidelity refinements after comparing the source and rendered prototype. */
@media(min-width:601px){h1{font-size:18.5vw;line-height:.79}h1 span:first-child{transform:scaleX(1.07)}.service-grid article{min-height:16vw}.works{padding-bottom:4vw}}
@media(max-width:600px){.sg-background{top:35vw}}
html{scrollbar-width:none}html::-webkit-scrollbar{display:none}
@media(min-width:601px){.about-copy{font-size:clamp(14px,1.85vw,27px);line-height:1.7}.service{padding-bottom:3.6vw}}
@media(min-width:601px){.works-dots{margin-top:1vw}}
/* Full-screen Hero and restrained body typography. */
.hero{height:100svh;min-height:100svh}
@media(min-width:601px){.about-copy{font-size:clamp(13px,1.4vw,18px);line-height:1.85}.service-grid article>p:last-child{font-size:clamp(12px,1.25vw,16px);line-height:1.85}}
@media(max-width:600px){.about-copy{font-size:14px;line-height:1.9}.service-grid article>p:last-child{font-size:13px;line-height:1.9}}

/* Shared heading appearance: theme classes only invert section colors. */
.service-grid h3{font-size:clamp(17px,1.9vw,28px)}
@media(max-width:600px){.service-grid h3{font-size:18px}}

/* Source font outlines: no runtime font download. */
.hero h1 .hero-word{padding:0;flex:none;background-clip:border-box;-webkit-background-clip:border-box;mask-repeat:no-repeat;mask-position:center;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:100% 100%;height:.79em}
.hero .word-shrine{width:3.0630675em;mask-image:url('assets/shrine-pc.svg');-webkit-mask-image:url('assets/shrine-pc.svg')}
.hero .word-graphix{width:4.0517552em;mask-image:url('assets/graphix-pc.svg');-webkit-mask-image:url('assets/graphix-pc.svg')}
.footer-brand{display:flex;align-items:center}.footer-brand img{display:block;height:13.2px;width:auto}.footer-brand .brand-sp{display:none}
@media(min-width:1600px){.footer-brand img{height:13.2px}}
@media(max-width:600px){.hero h1 .hero-word{height:.91em}.hero .word-shrine{width:3.0771058em;mask-image:url('assets/shrine-sp.svg');-webkit-mask-image:url('assets/shrine-sp.svg')}.hero .word-graphix{width:4.0686011em;mask-image:url('assets/graphix-sp.svg');-webkit-mask-image:url('assets/graphix-sp.svg')}.footer-brand .brand-pc{display:none}.footer-brand .brand-sp{display:block;height:10.8px}}

.contact-notice{margin-top:32px;font-size:13px;line-height:1.9;color:#444}.contact-notice p+p{margin-top:10px}.contact-main .contact-notice+form{margin-top:40px}.thanks-copy{margin-top:40px;font-size:14px;line-height:1.9}.thanks-copy p+p{margin-top:12px}.thanks-preview{margin-top:28px}.thanks-back{display:inline-block;margin-top:45px;font-size:12px;letter-spacing:.1em}.thanks-main{padding-top:clamp(65px,15svh,140px)}

#contact-form .contact-notice{margin-top:0;font-size:14px;line-height:1.85;color:#111;font-weight:700}#contact-form .contact-notice p+p{margin-top:8px}

[hidden]{display:none!important}

.works-hidden .service{padding-bottom:calc(3.6vw + var(--footer-height))}
@media(max-width:600px){.works-hidden .service{padding-bottom:calc(13vw + var(--footer-height))}}
/* Shared content spacing; only the last section reserves footer clearance. */
.section{--section-space:7vw;--section-content-gap:3vw;min-height:0;padding-top:var(--section-space);padding-bottom:var(--section-space)}
.about-copy,.service-grid,.works-viewport{margin-top:var(--section-content-gap)}
.service-grid article{min-height:0}
.works,.works-hidden .service{padding-bottom:calc(var(--section-space) + var(--footer-height))}
@media(max-width:600px){.section{--section-space:14vw;--section-content-gap:7vw}}

.form-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
