/* Renzoku — editorial, 2026. Shared foundation for home and secondary pages. */
@font-face{font-family:Manrope;src:url('assets/fonts/manrope-latin.woff2') format('woff2');font-style:normal;font-weight:200 800;font-display:swap}
:root{--paper:#f5f3ed;--ink:#272b28;--muted:#646760;--line:#d7d7ce;--clay:#96523e;--accent:#e8dfd2}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:32px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.7 Manrope,Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button,a,input,textarea,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}img{max-width:100%;display:block}p{color:var(--muted);margin:0 0 20px}h1,h2,h3{font-weight:500;line-height:1.13;margin:0}h1{font-size:clamp(52px,6.1vw,88px);letter-spacing:-.065em}h2{font-size:clamp(34px,3.5vw,48px);letter-spacing:-.055em}h3{font-size:21px;letter-spacing:-.035em}a,button,summary{touch-action:manipulation}.wrap{width:100%;max-width:1344px;padding-inline:64px;margin-inline:auto}.section{padding-block:100px}
/* One family, four voices. Emphasis is carried by weight, never by a second typeface. */
em{font-style:normal;font-weight:200;letter-spacing:-.03em}.eyebrow,.project-kicker,.project-go,.steps article>span,.price>span{font-weight:600;letter-spacing:.14em;text-transform:uppercase;line-height:1.7;font-variant-numeric:tabular-nums}.eyebrow{font-size:12px}.project-kicker,.project-go,.steps article>span{font-size:11px}.small{font-size:12px;line-height:1.8}.caption{font-size:12px;line-height:1.85;color:var(--muted)}
.section-top{display:grid;grid-template-columns:1fr 1.1fr;gap:40px;align-items:start;margin-bottom:52px}.section-top .eyebrow{margin-top:7px}.section-top h2{max-width:550px}
/* Navigation and identity */
.nav{height:118px;display:flex;align-items:center;justify-content:space-between;gap:32px}.wordmark{display:inline-flex;align-items:center;gap:13px;font-size:34px;font-weight:600;letter-spacing:-1.9px;line-height:1}.wordmark img{width:53px;height:38px;object-fit:contain}.nav nav{display:flex;align-items:center;gap:34px;font-size:12px}.nav nav a{padding:12px 0;transition:color .2s}.nav nav a:hover{color:var(--clay)}.nav-cta{border-bottom:1px solid var(--ink)}.nav a:focus-visible{outline-offset:8px}
/* Hero: typography and the mark, without a decorative container. */
.hero{padding-top:38px}.hero-topline{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:22px}.hero-topline p{margin:0}.hero-layout{display:grid;grid-template-columns:1fr 270px;gap:28px;align-items:center;padding:55px 0 38px}.hero-copy h1 span{color:var(--clay)}.hero-brand{position:relative;display:flex;align-items:center;justify-content:center;padding:0 20px 20px}.hero-brand img{width:235px;max-height:185px}.brand-jp{position:absolute;bottom:-13px;left:0;right:0;text-align:center;font-family:serif;font-size:14px;letter-spacing:9px;color:var(--clay)}.hero-bottom{display:flex;align-items:center;justify-content:space-between;gap:70px;padding:24px 0 53px}.hero-intro{max-width:485px;font-size:16px;line-height:1.85;margin:0}.button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:15px 24px;font-size:12px;font-weight:600;letter-spacing:.04em;background:var(--ink);border:1px solid var(--ink);color:var(--paper);border-radius:0;transition:background .18s,color .18s,border-color .18s}.button:hover{background:var(--clay);border-color:var(--clay)}.hero-foot{display:flex;justify-content:space-between;gap:24px;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:11px;color:var(--muted)}.hero-foot a{color:var(--ink);padding-block:6px}.hero-foot a span{margin-left:20px}.hero-foot a:hover{text-decoration:underline;text-underline-offset:4px}
/* Portfolio: two real projects framed identically. The material differs, the frame never does. */
.projects{display:grid;grid-template-columns:1fr 1fr;gap:40px}.project{min-width:0;display:block}.project-kicker{margin:0 0 14px;padding-bottom:13px;border-bottom:1px solid var(--line);color:var(--muted)}.project-cover{aspect-ratio:3/2;overflow:hidden;background:var(--ink)}.project-cover img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.65,.2,1)}.project:hover .project-cover img{transform:scale(1.035)}.project-meta{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin:26px 0 14px}.project-meta h3{font-size:25px}.project-go{color:var(--clay);white-space:nowrap;display:inline-flex;align-items:center;gap:9px}.project-go:after{content:'→';font-size:13px;letter-spacing:0;transition:transform .25s}.project:hover .project-go:after,.demo-band:hover .project-go:after{transform:translateX(5px)}.project:hover .project-meta h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}.case-description{max-width:490px;font-size:14px;line-height:1.85;margin:0}
.demo-band{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:48px;margin-top:68px;padding:28px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.demo-band .project-kicker{margin:0;padding:0;border:0;color:var(--clay)}.demo-band p{margin:0;font-size:14px;max-width:560px}.caption{margin-top:26px;max-width:760px}
/* Offer: one open layout, not a stack of cards. */
.offer{background:#eae9e1;border-block:1px solid var(--line)}.offer-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:80px}.offer .eyebrow{color:var(--clay);margin-bottom:30px}.offer-grid>div>p:not(.eyebrow){max-width:360px;font-size:14px;margin-top:28px}.offer-note{font-size:12px!important;padding-top:26px;border-top:1px solid #c9cdc1}.offer-detail{border-left:1px solid #c4c9bd;padding-left:48px}.price{display:flex;align-items:start;justify-content:space-between;gap:28px;border-bottom:1px solid #c4c9bd;padding-bottom:30px}.price>span{font-size:11px;max-width:160px;line-height:1.9;color:var(--muted)}.price strong{font-size:46px;line-height:1.1;font-weight:500;letter-spacing:-2px;white-space:nowrap;font-variant-numeric:tabular-nums}.price strong{text-align:right}.price strong span{display:block;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;margin-top:10px;text-align:right;color:var(--muted)}.price .price-from{margin:0 0 8px}.offer-detail ul{padding:0;margin:20px 0;list-style:none}.offer-detail li{padding:11px 0;border-bottom:1px solid #d3d6cb;font-size:14px}.offer-detail .small{margin-bottom:26px;max-width:430px}.light{background:transparent;color:var(--ink);min-width:230px}.light:hover{color:var(--paper)}.includes{margin-top:82px;padding-top:78px;border-top:1px solid #c4c9bd}.includes>.eyebrow{margin-bottom:38px}.includes-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:46px 52px}.includes-grid h3{font-size:18px;letter-spacing:-.025em;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid #c9cdc1}.includes-grid ul{list-style:none;padding:0;margin:0}.includes-grid li{position:relative;font-size:14px;line-height:1.7;padding:7px 0 7px 21px;color:var(--muted)}.includes-grid li:before{content:"";position:absolute;left:0;top:1.05em;width:10px;height:1px;background:var(--clay);opacity:.5}.includes-out h3{color:var(--clay);border-bottom-color:#c8a091}.includes-note{max-width:660px;font-size:14px;line-height:1.85;margin:44px 0 0}.includes-note+.includes-note{margin-top:18px}.includes-note a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
/* Process: the only place where numbering carries real order. */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:42px}.steps article{padding-top:24px;border-top:1px solid var(--ink)}.steps article>span{color:var(--clay);display:block;margin-bottom:30px}.steps h3{font-size:23px;margin-bottom:16px}.steps p{font-size:14px;line-height:1.85;max-width:300px}
/* Author: full width, so the page changes shape at least once. */
.about{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.about>.eyebrow{margin-bottom:26px}.about h2{max-width:900px;margin-bottom:44px}.about-cols{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:start}.about .large{color:var(--ink);font-size:22px;line-height:1.6;letter-spacing:-.5px;margin:0}.about-cols>p:last-child{font-size:14px;line-height:1.9;margin:0;max-width:430px}
/* FAQ: two columns of questions, a different rhythm from every other section. */
.faq>.eyebrow{margin-bottom:34px}.faq-list{display:grid;grid-template-columns:1fr 1fr;gap:0 72px;align-items:start}.faq details{border-bottom:1px solid var(--line);padding:17px 0}.faq details:nth-child(-n+2){border-top:1px solid var(--line)}summary{cursor:pointer;list-style:none;font-size:15px;line-height:1.5;display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:40px}summary::-webkit-details-marker{display:none}summary:after{content:'+';font-size:20px;color:var(--clay);font-weight:400;line-height:1}details[open] summary:after{content:'–'}details p{font-size:14px;line-height:1.9;margin:18px 30px 0 0}
/* Contact */
.contact{background:#e8dfd2;border-top:1px solid #d6cbbb;padding:90px 0}.contact-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:70px}.contact-copy h2{margin:28px 0}.contact-copy>p:not(.eyebrow){max-width:345px;font-size:14px;line-height:1.9}.contact-copy .zap{display:flex;width:fit-content;margin-top:12px}.contact-email{display:inline-block;font-size:17px;margin-top:24px;padding-bottom:4px;border-bottom:1px solid #8d7966;transition:color .2s,border-color .2s}.contact-email:hover{color:var(--clay);border-color:var(--clay)}.contact-copy>.small{margin-top:12px}.contact-panel{min-width:0}.contact-form fieldset{padding:0;border:0;margin:0;min-width:0}.form-heading h3{font-size:19px;margin:0 0 8px}.form-heading p{font-size:12px;margin:0 0 26px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.contact-form label{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;margin:0 0 22px}.contact-form input,.contact-form textarea{display:block;width:100%;border:1px solid #b9ad9e;background:#f8f5ee;color:var(--ink);padding:13px 14px;margin-top:9px;border-radius:0;font-size:14px;line-height:1.6;letter-spacing:0;text-transform:none;font-weight:400;transition:border-color .2s}.contact-form input:hover,.contact-form textarea:hover{border-color:#8d7966}.contact-form textarea{resize:vertical;min-height:130px}.contact-form textarea::placeholder{color:#736e66;font-size:13px}.contact-form .consent{display:flex;align-items:flex-start;gap:12px;font-weight:400;letter-spacing:0;text-transform:none;font-size:12px;margin-bottom:18px}.contact-form .consent input{width:20px;height:20px;margin:2px 0 0;flex-shrink:0;accent-color:var(--clay)}.consent span{font-size:12px;line-height:1.8}.contact-form .small{font-size:12px;margin:0 0 22px}.contact-form .small a{text-decoration:underline;text-underline-offset:3px}.contact-form button{width:100%}.contact-form fieldset:disabled{opacity:.6}.contact-form button:disabled{cursor:wait;opacity:.7}.contact-form .hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}#form-status{font-size:14px;min-height:1.7em;margin:15px 0 0;color:var(--ink)}
footer{display:flex;align-items:center;justify-content:space-between;gap:30px;min-height:145px}footer>.wordmark{font-size:28px}footer>.wordmark img{width:44px}footer>span,.footer-links{font-size:11px;color:var(--muted)}.footer-links{display:flex;gap:24px;align-items:center}.footer-links>a{padding:12px 0}.footer-links>a:hover{color:var(--clay)}
/* Secondary pages */
.privacy-main{max-width:900px}.privacy-main .eyebrow{color:var(--clay)}.privacy-main p a{text-decoration:underline;text-underline-offset:3px;color:var(--ink)}.privacy-main h1{font-size:56px;margin:25px 0 35px}.privacy-main h2{font-size:27px;margin:38px 0 18px}.privacy-main p{font-size:14px;line-height:1.9}.notfound{display:flex;flex-direction:column;align-items:flex-start;min-height:48vh}.notfound h1{margin:24px 0 26px}.notfound h1 span{color:var(--clay)}.notfound p{max-width:430px;font-size:14px;margin-bottom:34px}
/* One orchestrated entrance, and nothing else that moves on its own. */
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.home .hero-topline,.home .hero-copy,.home .hero-brand,.home .hero-bottom,.home .hero-foot{animation:rise .6s cubic-bezier(.22,.7,.2,1) both}.home .hero-copy{animation-delay:.07s}.home .hero-brand{animation-delay:.17s}.home .hero-bottom{animation-delay:.25s}.home .hero-foot{animation-delay:.33s}
/* Accessibility and small screens */
[hidden]{display:none!important}.skip{position:absolute;left:12px;top:-100px}.skip:focus{position:fixed;top:12px;padding:12px 20px;background:var(--ink);color:var(--paper);z-index:10}:focus-visible{outline:2px solid var(--clay);outline-offset:5px}input:focus-visible,textarea:focus-visible{outline-offset:2px}
@media(min-width:1500px){.hero-layout{padding-top:70px;padding-bottom:50px}}
@media(max-width:1100px){.wrap{padding-inline:40px}.hero-layout{grid-template-columns:1fr 210px;gap:20px}.hero-copy h1{font-size:66px}.hero-brand img{width:185px}.projects{gap:30px}.project-meta{flex-wrap:wrap;gap:6px 16px;margin-top:22px}.project-meta h3{font-size:22px}.demo-band{gap:28px}.offer-grid{gap:45px}.offer-detail{padding-left:30px}.price strong{font-size:38px}.about-cols{gap:36px}.faq-list{gap:0 40px}.includes-grid{grid-template-columns:1fr 1fr;gap:40px}.contact-layout{gap:40px}}
@media(max-width:760px){.wrap{padding-inline:24px}.nav{height:94px;gap:15px}.wordmark{font-size:30px;gap:10px}.wordmark img{width:44px;height:34px}.nav nav{gap:0}.nav nav>a:not(.nav-cta){display:none}.nav-cta{font-size:11px}.hero{padding-top:18px}.hero-topline{padding-top:17px}.hero-topline .eyebrow{font-size:10px;letter-spacing:.08em}.hero-layout{grid-template-columns:1fr;padding:40px 0 12px;gap:22px}.hero-copy h1{font-size:clamp(42px,8.6vw,64px);letter-spacing:-.065em}.hero-brand{justify-content:flex-end;padding:0;height:90px}.hero-brand img{width:126px;height:90px}.brand-jp{left:0;right:auto;bottom:26px;font-size:12px;letter-spacing:5px}.hero-bottom{display:block;padding:24px 0 35px}.hero-intro{font-size:14px;line-height:1.85;max-width:370px}.hero-bottom .button{margin-top:24px}.hero-foot{font-size:10px;align-items:center;padding:18px 0}.hero-foot>span{max-width:130px}.hero-foot a span{margin-left:8px}.section{padding-block:65px}.section-top,.offer-grid,.about-cols,.faq-list{grid-template-columns:1fr;gap:22px}.section-top{margin-bottom:34px}.section-top .eyebrow{margin:0}h2{font-size:36px}.projects{grid-template-columns:1fr;gap:46px}.project-kicker{margin-bottom:12px;padding-bottom:11px}.project-meta{margin:20px 0 12px;flex-direction:column;align-items:flex-start;gap:9px}.project-meta h3{font-size:23px}.demo-band{grid-template-columns:1fr;gap:14px;margin-top:46px;padding:24px 0}.demo-band p{font-size:13px}.offer .eyebrow{margin-bottom:22px}.offer-grid>div>p:not(.eyebrow){max-width:100%;margin-top:24px}.offer-note{padding-top:22px}.offer-detail{padding:28px 0 0;border-left:0;border-top:1px solid #c4c9bd}.price{padding-bottom:25px}.price strong{font-size:43px}.price>span{max-width:150px}.offer li{font-size:13px}.offer .button{width:100%}.includes{margin-top:52px;padding-top:48px}.includes>.eyebrow{margin-bottom:26px}.includes-grid{grid-template-columns:1fr;gap:34px}.includes-note{margin-top:34px}.steps{grid-template-columns:1fr;gap:24px}.steps article{display:grid;grid-template-columns:38px 1fr;gap:0 12px;padding-top:23px}.steps article>span{grid-row:1/3;margin:5px 0}.steps h3{font-size:22px}.steps p{grid-column:2;max-width:100%;margin-bottom:8px}.about h2{margin-bottom:26px}.about-cols{gap:20px}.about .large{font-size:20px}.about-cols>p:last-child{font-size:13px;max-width:100%}.faq>.eyebrow{margin-bottom:22px}.faq details:nth-child(2){border-top:0}summary{font-size:14px}.faq details{padding-block:20px}.contact{padding-block:65px}.contact-layout{grid-template-columns:1fr;gap:36px}.contact-copy h2{margin:23px 0}.contact-copy>p:not(.eyebrow){max-width:100%}.contact-email{margin-top:10px}.contact-copy .zap{width:100%}.contact-panel{border-top:1px solid #c9bba9;padding-top:30px}.form-grid{gap:15px}.contact-form label{margin-bottom:20px}footer{flex-wrap:wrap;justify-content:space-between;gap:24px;padding-block:35px}footer>.wordmark{font-size:27px}footer>span{order:3;width:100%}.footer-links{gap:15px}.privacy-main h1{font-size:42px}.privacy-main h2{font-size:26px}.privacy-main p{font-size:13px}}
@media(max-width:370px){.wrap{padding-inline:20px}.nav .wordmark{font-size:27px}.hero-copy h1{font-size:40px}.hero-foot{font-size:9px}.form-grid{grid-template-columns:1fr;gap:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
@media print{.nav nav,.button,.contact-panel{display:none}.section{padding-block:30px}.hero-layout{grid-template-columns:1fr 160px}.hero-copy h1{font-size:48px}.hero-brand img{width:150px}body{font-size:12px}.offer,.contact{background:transparent}.project-cover{aspect-ratio:16/9}.wrap{padding-inline:20px}}
