:root { --ink:#17191c; --amber:#f5a000; --paper:#f4f5f6; --white:#fff; --muted:#5b6068; --line:#d2d5d7; --blue:#214de3; --display:'Space Grotesk',Arial,sans-serif; --body:'Noto Sans JP',sans-serif; }
* { box-sizing:border-box; letter-spacing:0; }
html { scroll-behavior:smooth; scroll-padding-top:100px; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--body); font-size:15px; -webkit-font-smoothing:antialiased; }
body.modal-open { overflow:hidden; }
button,input { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
button { color:inherit; }
button { cursor:pointer; }
[hidden] { display:none!important; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; height:auto; }
button { border:0; background:none; }
h1,h2,h3,p { margin:0; }
p { line-height:1.9; }
button:focus-visible,a:focus-visible,summary:focus-visible { outline:3px solid var(--blue); outline-offset:6px; }
svg.lucide { width:22px; height:22px; flex-shrink:0; stroke-width:1.8; }
.skip-link { position:fixed; top:-80px; left:20px; z-index:20; padding:16px; background:white; }
.skip-link:focus { top:10px; }
.skip-link:not(:focus) { clip-path:inset(50%); width:1px; height:1px; overflow:hidden; padding:0; }
.header { height:90px; padding:0 4%; display:flex; align-items:center; justify-content:space-between; background:rgba(244,245,246,.96); border-bottom:1px solid var(--line); position:relative; z-index:10; }
.brand { display:block; width:180px; flex-shrink:0; }
.brand img { width:100%; aspect-ratio:20/7; }
.nav { display:flex; gap:38px; align-items:center; }
.nav>a { display:flex; flex-direction:column; font:600 13px/1.5 var(--display); }
.nav>a>span { font:500 10px/1.8 var(--body); color:var(--muted); }
.nav>a:not(.nav-contact):hover { color:var(--blue); }
.nav>.nav-contact { flex-direction:row; align-items:center; gap:28px; padding:17px 23px; color:white; background:var(--ink); transition:background .2s; }
.nav>.nav-contact:hover { background:var(--blue); }
.icon-button { width:44px; height:44px; display:grid; place-items:center; padding:0; }
.menu-toggle { display:none; }
.hero { height:min(720px,calc(100svh - 150px)); min-height:620px; max-height:900px; position:relative; isolation:isolate; overflow:hidden; background:#e9edef; }
.scene { position:absolute; inset:0; z-index:-1; }
.scene canvas { display:block; width:100%; height:100%; }
.scene-fallback { position:absolute; width:42%; right:3%; top:25%; transform:rotate(-7deg); border:12px solid #fff; box-shadow:0 24px 60px #17191c22; z-index:-1; }
.scene-ready .scene-fallback { visibility:hidden; }
.hero-copy { padding:45px 0 100px 4%; position:relative; pointer-events:none; width:55%; }
.hero-copy a { pointer-events:auto; }
.overline { font:600 12px/1.5 var(--display); }
.hero .overline { display:flex; align-items:center; gap:9px; margin-bottom:21px; }
.status-dot { width:7px; height:7px; background:var(--blue); border-radius:50%; }
.hero h1 { font:700 150px/.84 var(--display); }
.hero h1>span { display:block; }
.title-dot { color:var(--amber); }
.hero-category { font-size:13px; font-weight:600; margin:20px 0 28px; }
.hero h2 { font-size:33px; line-height:1.5; font-weight:800; }
.hero h2 span { display:block; }
.hero-description { font-size:13px; color:#42484d; margin-top:15px; line-height:1.9; }
.text-link { display:inline-flex; align-items:center; gap:24px; font-size:14px; font-weight:700; }
.hero-link { margin-top:22px; }
.arrow-disc { width:45px; height:45px; display:grid; place-items:center; border-radius:50%; background:var(--ink); color:white; transition:transform .3s,background .3s; }
.text-link:hover .arrow-disc { background:var(--blue); transform:rotate(-35deg); }
.hero-bottom { position:absolute; bottom:0; left:4%; right:4%; display:flex; align-items:center; justify-content:space-between; height:59px; border-top:1px solid #bac1c5; font:500 11px/1.5 var(--display); }
.hero-bottom b { padding:0 10px; color:var(--blue); }
.hero-bottom>span:nth-child(2) { margin-left:auto; margin-right:38px; font:500 10px/1.5 var(--body); }
.hero-bottom a { padding:12px; }
.scene-caption { position:absolute; left:43%; bottom:21px; display:flex; flex-direction:row; gap:15px; align-items:center; font:600 10px/1.5 var(--display); }
.scene-caption .mini-label { color:#4b5157; font-size:9px; }
.motion-toggle { position:absolute; top:30px; right:4%; border:1px solid #abb2b6; border-radius:50%; background:#ffffff80; }
.section-pad { padding:94px 6%; }
.works { background:white; }
.works.section-pad { padding-top:42px; }
.section-top { display:flex; align-items:flex-start; justify-content:space-between; gap:28px; }
.section-aside { font-size:18px; font-weight:600; line-height:1.8; }
.works-heading { display:flex; align-items:baseline; gap:23px; margin:14px 0 47px; }
.works-heading h2 { font:600 110px/.98 var(--display); }
.works-count { font:500 11px/1 var(--display); border-top:1px solid var(--ink); padding-top:9px; }
.project { min-width:0; }
.project-featured { margin-bottom:76px; }
.project-image { padding:0; width:100%; display:block; overflow:hidden; position:relative; background:#e9edef; text-align:left; }
.project-image img { width:100%; height:auto; transition:filter .3s; }
.project-open { width:54px; height:54px; display:grid; place-items:center; border-radius:50%; background:white; position:absolute; right:20px; bottom:20px; color:var(--ink); transition:transform .3s,background .3s; box-shadow:0 4px 20px #0002; }
.project-image:hover .project-open { transform:rotate(45deg); background:var(--amber); }
.project-info { display:flex; justify-content:space-between; gap:20px; margin-top:22px; }
.project-category { font:500 11px/1.7 var(--display); color:var(--muted); }
.release-status { margin-left:15px; font:600 10px var(--body); padding-left:12px; border-left:1px solid #a1a6aa; color:#646970; }
.project h3 { font-size:24px; font-weight:700; margin:8px 0 6px; }
.project h3 button { text-align:left; padding:0; font:inherit; }
.project h3 button:hover { text-decoration:underline; text-underline-offset:5px; }
.project-info p:not(.project-category) { color:var(--muted); font-size:13px; }
.project-budget { text-align:right; padding-top:9px; flex-shrink:0; }
.project-budget>span { font-size:10px; color:var(--muted); display:block; }
.project-budget strong { display:block; font:500 30px/1.5 var(--display); margin-top:3px; }
.project-tags { display:flex; flex-wrap:wrap; gap:15px; padding-top:17px; margin-top:16px; border-top:1px solid var(--line); }
.project-tags span { color:#555a60; font-size:10px; }
.project-grid { display:grid; grid-template-columns:1fr 1fr; gap:70px 36px; align-items:start; }
.project-grid .project h3 { font-size:20px; }
.project-grid .project-info :is(h2,h3) { line-height:1.7; }
.project-grid .project-info :is(h2,h3) a:hover { text-decoration:underline; text-underline-offset:5px; }
.project-number { font:500 13px var(--display); color:#828990; padding-top:5px; }
.next-project { padding:55px 10%; align-self:stretch; display:flex; flex-direction:column; justify-content:center; background:#edf1f4; min-height:360px; }
.next-project h3 { font-size:34px; line-height:1.6; margin:28px 0 16px; }
.next-project h3 span { display:block; }
.next-project>p:not(.overline) { color:var(--muted); font-size:14px; }
.next-project .text-link { margin-top:30px; justify-content:space-between; }
.approach-visual { position:relative; height:570px; overflow:hidden; background:#e2e5e8; }
.approach-visual>img { width:100%; height:100%; object-fit:cover; object-position:center 54%; }
.approach-intro { position:absolute; left:6%; top:75px; }
.approach-intro h2 { font-size:53px; line-height:1.5; margin-top:30px; font-weight:800; }
.approach-intro h2 span { display:block; }
.approach-body { background:var(--ink); color:white; }
.approach-message { display:grid; grid-template-columns:1fr 1fr; gap:8%; }
.approach-message>p { font-size:29px; font-weight:600; line-height:1.9; }
.approach-message>div>p { font-size:14px; color:#c9cbd1; margin-bottom:15px; line-height:2.1; }
.signature { font-size:12px; display:block; margin-top:32px; }
.approach-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:36px; margin:70px 0 0; padding:0; list-style:none; }
.approach-steps li { border-top:1px solid #55585d; padding-top:25px; }
.approach-steps li>span { font:500 12px var(--display); color:var(--amber); }
.approach-steps h3 { font-size:22px; margin:18px 0 14px; }
.approach-steps p { font-size:13px; color:#c9cbd1; }
.services { background:white; }
.services .section-top { margin-bottom:50px; }
.services .section-top h2 { font-size:28px; }
.service-row { display:grid; grid-template-columns:55px 1fr 1fr 28px; gap:20px; align-items:center; border-top:1px solid var(--line); padding:32px 0; transition:color .2s; }
.service-index { font:500 12px var(--display); }
.service-row h3 { font:500 38px/1.2 var(--display); }
.service-row p { font-size:11px; color:var(--muted); margin-top:8px; }
.service-description { font-size:13px; color:var(--muted); justify-self:end; }
.service-row:hover { color:var(--blue); }
.service-row:hover .lucide { transform:translate(3px,-3px); }
.service-row .lucide { transition:transform .2s; }
.pricing-link { border-top:1px solid var(--line); width:100%; padding-top:30px; font-size:13px; justify-content:flex-end; }
.contact { background:var(--amber); padding-top:78px; padding-bottom:72px; }
.contact h2 { font:600 130px/1 var(--display); margin:28px 0 42px; white-space:nowrap; }
.contact h2>span { color:white; }
.contact-bottom { display:flex; justify-content:space-between; gap:50px; }
.contact h3 { font-size:28px; line-height:1.6; }
.contact h3 span { display:block; }
.contact-bottom p { font-size:12px; margin-top:22px; }
.contact-links { width:42%; display:flex; flex-direction:column; }
.contact-links a { display:flex; justify-content:space-between; padding:15px 3px; font-size:13px; border-bottom:1px solid #17191c60; align-items:center; }
.contact-links .contact-primary { background:var(--ink); color:white; font-size:16px; padding:24px; border:0; margin-bottom:12px; transition:background .25s; }
.contact-links .contact-primary:hover { background:#04773c; }
.footer { display:flex; align-items:center; justify-content:space-between; gap:30px; background:#111316; color:#bbc0c4; padding:30px 4%; }
.footer img { width:172px; }
.footer nav { display:flex; flex-wrap:wrap; gap:15px; }
.footer nav a { font-size:11px; }
.footer nav a:hover { color:white; }
.footer small { font:400 10px var(--display); white-space:nowrap; }
.case-dialog { background:white; color:var(--ink); border:0; padding:0; width:1060px; max-width:calc(100% - 40px); max-height:90dvh; overscroll-behavior:contain; }
.case-dialog::backdrop { background:#10151bbb; backdrop-filter:blur(8px); }
.dialog-bar { position:sticky; top:0; z-index:2; display:flex; justify-content:space-between; align-items:center; padding:12px 24px; border-bottom:1px solid var(--line); background:white; font:600 11px var(--display); }
.dialog-content { padding:38px; }
.dialog-content h2 { font-size:30px; line-height:1.6; margin:10px 0; }
.dialog-content>p:not(.project-category) { font-size:15px; margin-bottom:28px; }
#case-image { width:100%; height:auto; }
.case-copy { margin:32px 0; display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.case-copy h3 { font-size:17px; margin-bottom:13px; }
.case-copy p { font-size:13px; color:var(--muted); }
#case-meta { margin:0; }
#case-meta>div { display:grid; grid-template-columns:150px 1fr; gap:16px; padding:16px 0; border-top:1px solid var(--line); font-size:12px; }
#case-meta dt { font-weight:700; }
#case-meta dd { margin:0; line-height:1.8; overflow-wrap:anywhere; }
#case-links { display:flex; gap:18px; flex-wrap:wrap; padding:20px 0 0; }
#case-links a { padding:16px 20px; background:var(--ink); color:white; font-size:12px; display:flex; align-items:center; gap:24px; }
.js-ready .reveal { opacity:0; transform:translateY(24px); transition:opacity .65s,transform .65s; }
.js-ready .reveal.is-visible { opacity:1; transform:none; }
.motion-paused .reveal { opacity:1; transform:none; transition:none; }
.nav a[aria-current="page"] { color:var(--blue); }
.section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:36px; margin-bottom:48px; }
.section-heading h2 { font-size:34px; font-weight:700; line-height:1.6; margin-top:18px; text-wrap:balance; }
.section-heading>p { font-size:13px; color:var(--muted); max-width:470px; }
.section-end-link { margin-top:28px; }
.section-end-links { display:flex; gap:32px; flex-wrap:wrap; margin-top:32px; }
.inline-link { text-decoration:underline; text-underline-offset:5px; font-size:13px; }
.inline-link:hover,.back-link:hover,.section-end-link:hover { color:var(--blue); }
.founder-note { display:grid; grid-template-columns:1fr 1fr; gap:8%; border-top:1px solid #55585d; padding-top:42px; margin-top:64px; }
.founder-note h3 { font-size:26px; margin:18px 0 6px; }
.founder-note>div>p:not(.overline) { font-size:13px; color:#c9cbd1; }
.founder-note h4 { font-size:20px; line-height:1.8; margin:0 0 20px; font-weight:600; }
.founder-note>div>p+p { margin-top:14px; }
.faq-home { background:#edf1f4; }
.faq-list { border-top:1px solid var(--line); }
.faq-list details { border-bottom:1px solid var(--line); }
.faq-list summary { display:flex; align-items:center; justify-content:space-between; gap:24px; cursor:pointer; list-style:none; font-size:16px; font-weight:600; padding:27px 0; line-height:1.8; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary .lucide { transition:transform .2s; }
.faq-list details[open] summary .lucide { transform:rotate(45deg); }
.faq-list details[open] summary { color:var(--blue); }
.faq-list details>div { max-width:880px; padding:0 48px 28px 0; font-size:14px; color:var(--muted); }
.faq-list details .inline-link { display:inline-block; color:var(--ink); margin-top:15px; }
.inner-page { background:white; }
.page-intro { padding-top:65px; padding-bottom:55px; background:var(--paper); }
.page-intro .overline { color:var(--blue); }
.page-intro h1 { font-size:48px; line-height:1.6; margin:22px 0; font-weight:800; text-wrap:balance; max-width:1100px; }
.page-intro h1>span { display:block; }
.page-intro>p:last-child { font-size:14px; color:var(--muted); }
.page-index { display:flex; flex-wrap:wrap; padding:0 6%; gap:0 38px; background:var(--paper); border-bottom:1px solid var(--line); }
.page-index a { padding:20px 0; display:flex; align-items:center; gap:9px; font-size:12px; min-height:52px; }
.page-index a::after { content:'\2193'; color:var(--blue); }
.page-index a:hover { color:var(--blue); }
.service-detail { background:white; }
.tint-band { background:#edf1f4; }
.service-showcase { display:grid; grid-template-columns:1.15fr 1fr; gap:6%; align-items:center; margin-bottom:54px; }
.service-showcase>a>img { width:100%; height:auto; }
.service-showcase h3 { font-size:27px; line-height:1.65; margin:18px 0; }
.service-showcase p:not(.overline) { font-size:14px; color:var(--muted); margin-bottom:18px; }
.service-showcase .text-link { margin-top:10px; }
.scope-columns { display:grid; grid-template-columns:1fr 1fr; gap:6%; }
.scope-columns>div { border-top:1px solid var(--line); padding-top:25px; }
.scope-columns h3 { font-size:20px; margin-bottom:20px; line-height:1.7; }
.scope-columns p { font-size:14px; color:var(--muted); margin-bottom:18px; }
.scope-columns .text-link { margin-top:12px; }
.included-list { list-style:none; padding:0; margin:0; }
.included-list li { display:flex; align-items:flex-start; gap:12px; margin:14px 0; font-size:14px; line-height:1.8; }
.included-list .lucide { width:17px; height:17px; margin-top:4px; color:var(--blue); }
.flow-section { background:var(--ink); color:white; }
.flow-section .section-heading>p { color:#c9cbd1; }
.process-list { display:grid; grid-template-columns:repeat(4,1fr); gap:28px; list-style:none; margin:0 0 30px; padding:0; }
.process-list li { border-top:1px solid #55585d; padding-top:22px; }
.process-list li>span { font:500 35px var(--display); color:var(--amber); }
.process-list h3 { font-size:19px; line-height:1.6; margin:22px 0 14px; }
.process-list p { font-size:13px; color:#c9cbd1; }
.fine-print { font-size:12px; color:var(--muted); line-height:1.9; margin-top:24px; }
.flow-section .fine-print { color:#c9cbd1; }
.flow-section>.text-link { margin-top:24px; }
.price-rows { border-top:1px solid var(--ink); }
.price-row { display:grid; grid-template-columns:1fr auto; align-items:center; gap:30px; padding:32px 0; border-bottom:1px solid var(--line); }
.price-row h3 { font-size:21px; line-height:1.7; }
.price-row>div>p { font-size:13px; color:var(--muted); margin-top:7px; }
.price-amount { font:500 42px/1.4 var(--display); white-space:nowrap; }
.price-amount small { font:500 14px var(--body); margin-left:7px; }
.quote-label { font:600 22px var(--body); }
.compact-columns { margin-top:42px; }
.price-section>.text-link { margin-top:26px; }
.cost-section { background:#edf1f4; }
.cost-examples { display:grid; grid-template-columns:1fr 1fr; gap:6%; }
.cost-examples article { border-top:2px solid var(--blue); padding-top:25px; min-width:0; }
.cost-examples h3 { font-size:19px; line-height:1.8; margin:18px 0 26px; }
.cost-examples dl { margin:0; }
.cost-examples dl>div { display:flex; justify-content:space-between; gap:20px; margin:18px 0; align-items:flex-start; }
.cost-examples dt { font-size:13px; line-height:1.8; }
.cost-examples dd { margin:0; text-align:right; font-size:16px; }
.cost-examples dd small { display:block; font-size:10px; color:var(--muted); margin-top:5px; }
.cost-examples .cost-total { border-top:1px solid var(--line); padding-top:23px; align-items:center; }
.cost-examples .cost-total dd { font:500 39px var(--display); }
.cost-examples .cost-total small { display:inline; font:500 13px var(--body); color:var(--ink); margin-left:4px; }
.detail-list { margin:0; border-top:1px solid var(--line); }
.detail-list>div { display:grid; grid-template-columns:170px 1fr; gap:30px; padding:24px 0; border-bottom:1px solid var(--line); }
.detail-list dt { font-size:14px; font-weight:600; line-height:1.8; }
.detail-list dd { margin:0; color:var(--muted); font-size:14px; line-height:1.9; overflow-wrap:anywhere; }
.works-index .project h2 { font-size:20px; line-height:1.7; margin:8px 0 6px; }
.works-index .project h2 a:hover { text-decoration:underline; text-underline-offset:5px; }
.project .work-price-note { margin-top:12px; color:var(--ink)!important; }
.case-intro { padding-top:48px; padding-bottom:45px; }
.back-link { display:inline-flex; align-items:center; gap:12px; font-size:12px; margin-bottom:45px; }
.case-intro .overline { color:var(--blue); }
.case-intro h1 { font-size:40px; line-height:1.6; margin:16px 0; text-wrap:balance; }
.case-subtitle { font-size:18px; color:var(--muted); }
.case-screenshot { margin:0 6%; }
.case-screenshot>img { width:100%; height:auto; }
.case-story { display:grid; grid-template-columns:1fr .9fr; gap:8%; }
.case-essay section+section { margin-top:45px; }
.case-essay .overline { color:var(--blue); }
.case-essay h2 { font-size:24px; margin:16px 0; }
.case-essay p:not(.overline) { font-size:15px; line-height:2; color:var(--muted); }
.case-facts>h2 { font:500 15px var(--display); margin:0 0 23px; }
.case-facts .detail-list>div { grid-template-columns:100px 1fr; gap:20px; padding:20px 0; }
.case-facts .detail-list dt,.case-facts .detail-list dd { font-size:12px; }
.case-summary { display:grid; grid-template-columns:2fr 1fr 1fr; gap:24px; border-top:1px solid var(--line); padding-top:24px; margin:32px 0 0; }
.case-summary dt { color:var(--muted); font-size:12px; margin-bottom:7px; }
.case-summary dd { margin:0; font-size:17px; font-weight:600; }
.case-delivery { background:#f4f5f6; }
.case-delivery>h2,.project-costs>h2 { margin:16px 0 32px; font-size:34px; line-height:1.5; text-wrap:balance; }
.case-delivery>h2>span,.project-costs>h2>span { display:inline-block; }
.case-delivery .scope-columns { margin-bottom:36px; }
.case-delivery .scope-columns h3:not(:first-child) { margin-top:26px; }
.case-support { display:grid; grid-template-columns:1fr 1fr; gap:8%; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:28px 0; margin:0 0 30px; }
.case-support h3 { margin:0 0 12px; font-size:18px; }
.case-support-price { font-size:22px; font-weight:600; }
.case-support>p { font-size:14px; line-height:1.9; }
.project-costs { background:#fff; }
.cost-intro,.cost-common { max-width:900px; font-size:15px; line-height:1.9; }
.cost-common { margin-top:18px; color:var(--muted); }
.project-cost-list { margin:44px 0 25px; border-top:1px solid var(--line); }
.project-cost-example { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:22px 7%; padding:32px 0; border-bottom:1px solid var(--line); }
.project-cost-example h3 { font-size:23px; line-height:1.5; margin:12px 0 8px; }
.project-cost-example h4 { font-size:14px; margin:0 0 10px; }
.project-cost-example .project-spec { font-size:13px; color:var(--muted); }
.project-cost-amount { align-self:center; text-align:right; }
.project-cost-amount span { display:block; font-size:12px; color:var(--muted); margin-bottom:8px; }
.project-cost-amount strong { font-size:20px; font-weight:600; }
.project-cost-scope>p,.project-cost-support>p { font-size:14px; line-height:1.9; }
.project-cost-scope .cost-scope-note { color:var(--muted); font-size:12px; margin-top:12px; }
.project-cost-support>p+p { margin-top:10px; color:var(--muted); }
.project-cost-support .text-link { margin-top:16px; font-size:13px; }
.price-amount,.project-cost-amount strong,.case-summary dd,.case-support-price,.cost-examples dd { font-variant-numeric:tabular-nums; }
.breadcrumb { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin:0 0 26px; font-size:12px; line-height:1.8; color:var(--muted); }
.breadcrumb a:hover { color:var(--blue); text-decoration:underline; text-underline-offset:4px; }
.breadcrumb [aria-current] { color:var(--ink); }
.breadcrumb .lucide { width:14px; height:14px; }
@media(min-width:761px) { .cost-examples h3 { min-height:3.6em; } }
@media(max-width:760px) {
  .case-summary { grid-template-columns:1fr 1fr; gap:18px; margin-top:26px; }
  .case-summary>div:first-child { grid-column:1 / -1; }
  .case-summary dd { font-size:15px; }
  .case-delivery>h2,.project-costs>h2 { font-size:25px; }
  .case-support,.project-cost-example { grid-template-columns:minmax(0,1fr); gap:22px; }
  .project-cost-amount { text-align:left; }
  .project-cost-example h3 { font-size:20px; }
  .project-cost-amount strong { font-size:18px; }
  .cost-intro,.cost-common { font-size:14px; }
}
.case-external { margin-top:25px; }
.external-link { background:var(--ink); color:white; padding:20px; display:inline-flex; align-items:center; justify-content:space-between; gap:30px; font-size:13px; }
.external-link:hover { background:var(--blue); }
.case-pagination { display:flex; justify-content:space-between; align-items:center; gap:30px; padding:32px 6%; border-top:1px solid var(--line); }
.case-pagination a { display:flex; align-items:center; gap:24px; font-size:14px; line-height:1.8; }
.case-pagination a:hover { color:var(--blue); }
.case-pagination a small { font:500 10px var(--display); color:var(--muted); display:block; margin-bottom:7px; }
.legal-page { padding-top:50px; }
.legal-content { max-width:960px; }
.legal-block { padding:28px 0; border-bottom:1px solid var(--line); }
.legal-block:first-child { padding-top:0; }
.legal-block h2 { font-size:22px; line-height:1.7; margin-bottom:20px; }
.legal-block h3 { font-size:18px; line-height:1.7; margin:24px 0 14px; }
.legal-block p,.legal-list { font-size:14px; line-height:2; color:var(--muted); }
.legal-block p+p { margin-top:15px; }
.legal-list { padding-left:22px; margin:16px 0; }
.legal-list li+li { margin-top:10px; }
.legal-table { margin:0; }
.legal-table>div { display:grid; grid-template-columns:180px 1fr; gap:35px; padding:22px 0; border-bottom:1px solid var(--line); font-size:14px; line-height:1.9; }
.legal-table dt { font-weight:600; }
.legal-table dd { margin:0; color:var(--muted); overflow-wrap:anywhere; }
.legal-table a { text-decoration:underline; text-underline-offset:4px; }
@media(max-width:1100px) {
  .section-heading { align-items:flex-start; flex-direction:column; gap:18px; }
  .section-heading>p { max-width:none; }
  .process-list { grid-template-columns:1fr 1fr; gap:36px; }
  .service-showcase { gap:35px; } .service-showcase h3 { font-size:24px; }
  .case-story { grid-template-columns:1fr; gap:45px; }
  .case-essay { display:grid; grid-template-columns:1fr 1fr; gap:36px; }
  .case-essay section+section { margin-top:0; }
}
@media(max-width:1000px) {
  .menu-toggle { display:grid; }
  .nav { display:none; position:absolute; top:90px; left:0; right:0; background:var(--paper); border-bottom:1px solid var(--ink); padding:25px; align-items:stretch; flex-direction:column; gap:22px; box-shadow:0 20px 30px #0001; }
  .nav.is-open { display:flex; } .nav>a { font-size:18px; gap:2px; } .nav>.nav-contact { justify-content:space-between; padding:20px; }
}
@media(max-width:760px) {
  .section-heading { margin-bottom:32px; gap:16px; }
  .section-heading h2 { font-size:27px; margin-top:14px; text-wrap:pretty; }
  .section-heading>p { font-size:12px; }
  .section-heading>p br { display:none; }
  .founder-note { grid-template-columns:1fr; gap:25px; margin-top:45px; padding-top:30px; }
  .founder-note h3 { font-size:24px; } .founder-note h4 { font-size:19px; }
  .faq-list summary { padding:23px 0; font-size:14px; gap:17px; }
  .faq-list summary .lucide { width:18px; }
  .faq-list details>div { padding:0 0 24px; font-size:13px; }
  .page-intro { padding-top:42px; padding-bottom:36px; }
  .page-intro h1 { font-size:30px; margin:20px 0; line-height:1.65; text-wrap:pretty; }
  .page-intro>p:last-child { font-size:13px; }
  .page-intro>p:last-child br { display:none; }
  .page-index { padding:0 22px; gap:0 24px; }
  .page-index a { padding:16px 0; font-size:11px; }
  .service-showcase,.scope-columns,.cost-examples { grid-template-columns:1fr; gap:34px; }
  .service-showcase { margin-bottom:35px; }
  .service-showcase h3 { font-size:24px; }
  .service-showcase p:not(.overline),.scope-columns p,.included-list li { font-size:13px; }
  .scope-columns h3 { font-size:19px; }
  .process-list { grid-template-columns:1fr; gap:28px; }
  .process-list li { display:grid; grid-template-columns:44px 1fr; gap:8px 14px; align-items:start; }
  .process-list h3 { margin:0; font-size:19px; }
  .process-list li>span { grid-row:span 2; font-size:29px; }
  .process-list p { grid-column:2; }
  .price-row { grid-template-columns:1fr; gap:16px; padding:26px 0; }
  .price-row h3 { font-size:19px; }
  .price-row>div>p { font-size:12px; }
  .price-amount { font-size:36px; justify-self:end; }
  .price-amount small { font-size:12px; }
  .quote-label { font-size:20px; }
  .cost-examples h3 { font-size:18px; }
  .cost-examples .cost-total dd { font-size:32px; }
  .cost-examples dt { font-size:12px; }
  .detail-list>div { grid-template-columns:1fr; gap:10px; padding:22px 0; }
  .detail-list dt,.detail-list dd { font-size:13px; }
  .section-end-links { gap:25px; }
  .section-end-links .text-link { font-size:12px; }
  .works-index .project h2 { font-size:19px; }
  .case-intro { padding-top:30px; padding-bottom:30px; }
  .back-link { margin-bottom:30px; }
  .case-intro h1 { font-size:27px; text-wrap:pretty; }
  .case-subtitle { font-size:14px; }
  .case-screenshot { margin:0 22px; }
  .case-essay { grid-template-columns:1fr; gap:36px; }
  .case-essay h2 { font-size:22px; }
  .case-essay p:not(.overline) { font-size:14px; }
  .case-facts .detail-list>div { grid-template-columns:85px 1fr; gap:15px; }
  .external-link { width:100%; }
  .case-pagination { padding:25px 22px; flex-direction:column; align-items:stretch; gap:25px; }
  .case-pagination a { justify-content:space-between; font-size:13px; }
  .case-pagination a:first-child { justify-content:flex-start; gap:12px; }
  .legal-page { padding-top:35px; }
  .legal-block h2 { font-size:20px; }
  .legal-block p,.legal-list { font-size:13px; }
  .legal-table>div { grid-template-columns:1fr; gap:9px; padding:20px 0; font-size:13px; }
}
@media(min-width:1700px) { .hero { height:min(800px,calc(100svh - 150px)); } .hero-copy { padding-top:65px; } .hero h1 { font-size:174px; } .hero h2 { font-size:37px; } .hero-description { font-size:15px; } .hero-category { margin-bottom:25px; } }
@media(max-width:1250px) { .nav { gap:24px; } .hero h1 { font-size:128px; } .hero h2 { font-size:30px; } .hero { height:690px; } .section-pad { padding:75px 5%; } .contact h2 { font-size:110px; } .service-row h3 { font-size:32px; } .footer { flex-wrap:wrap; } }
@media(max-width:1000px) { .nav { gap:18px; } .nav>.nav-contact { padding:14px; gap:14px; } .hero { height:660px; } .hero h1 { font-size:104px; } .hero h2 { font-size:26px; } .hero-copy { width:57%; } .hero-description { font-size:11px; } .hero .overline { font-size:10px; } .hero-category { font-size:11px; } .scene-caption .mini-label { display:none; } .works-heading h2 { font-size:90px; } .service-description { display:none; } .service-row { grid-template-columns:40px 1fr 28px; } .approach-intro h2 { font-size:43px; } .approach-visual { height:500px; } .approach-message>p { font-size:24px; } .project h3 { font-size:22px; } .next-project { padding:30px; } .next-project h3 { font-size:27px; } }
@media(max-width:760px) {
  html { scroll-padding-top:24px; } .header { height:72px; padding:0 20px; } .brand { width:160px; } .menu-toggle { display:grid; }
  .nav { display:none; position:absolute; top:72px; left:0; right:0; background:var(--paper); border-bottom:1px solid var(--ink); padding:25px; align-items:stretch; flex-direction:column; gap:22px; box-shadow:0 20px 30px #0001; }
  .nav.is-open { display:flex; } .nav>a { font-size:18px; gap:2px; } .nav>.nav-contact { justify-content:space-between; padding:20px; }
  .hero { height:min(810px,calc(100svh - 125px)); min-height:680px; max-height:none; } .hero-copy { width:100%; padding:24px 22px 0; } .hero .overline { font-size:9px; margin-bottom:18px; }
  .hero h1 { font-size:78px; line-height:.9; } .hero h1>span { display:inline; } .hero h1>span:first-child { display:block; }
  .hero-category { font-size:11px; margin:17px 0 18px; } .hero h2 { font-size:26px; line-height:1.5; } .hero h2 span { display:inline-block; }
  .hero-description { display:none; } .hero-link { margin-top:14px; font-size:12px; gap:17px; } .arrow-disc { width:38px; height:38px; }
  .scene { top:365px; bottom:62px; } .scene-fallback { top:auto; bottom:95px; right:10%; width:80%; border-width:7px; }
  .hero-bottom { height:58px; left:22px; right:22px; bottom:0; font-size:9px; } .hero-bottom b { padding:0 4px; } .hero-bottom>span:nth-child(2) { display:none; }
  .scene-caption { bottom:21px; right:74px; left:auto; font-size:8px; flex-direction:row; gap:18px; } .scene-caption .mini-label { display:none; }
  .motion-toggle { top:auto; bottom:83px; left:20px; right:auto; width:36px; height:36px; } .motion-toggle .lucide { width:16px; }
  .section-pad { padding:58px 22px; } .works.section-pad { padding-top:30px; } .section-top { gap:15px; } .overline { font-size:10px; } .section-aside { font-size:12px; line-height:1.8; }
  .works-heading { margin:25px 0 30px; gap:16px; } .works-heading h2 { font-size:63px; } .works-count { font-size:9px; }
  .project-featured { margin-bottom:44px; } .project-info { margin-top:17px; flex-direction:column; gap:12px; } .project h3 { font-size:19px; margin:6px 0; } .project-category { font-size:9px; }
  .project-info p:not(.project-category) { font-size:11px; } .release-status { font-size:9px; margin-left:10px; } .project-budget { text-align:left; padding:0; display:flex; align-items:center; justify-content:space-between; }
  .project-budget strong { font-size:24px; } .project-budget>span { font-size:10px; } .project-tags { gap:12px; padding-top:13px; margin-top:12px; } .project-tags span { font-size:9px; }
  .project-open { width:38px; height:38px; right:12px; bottom:12px; } .project-open .lucide { width:19px; }
  .project-grid { grid-template-columns:1fr; gap:42px; } .project-grid .project-info { flex-direction:row; } .project-grid .project h3 { font-size:19px; }
  .next-project { min-height:300px; padding:28px; } .next-project h3 { font-size:27px; margin-top:20px; } .next-project>p:not(.overline) { font-size:12px; }
  .approach-visual { height:470px; } .approach-visual>img { object-position:57% bottom; } .approach-intro { left:22px; top:30px; } .approach-intro h2 { font-size:33px; margin-top:18px; }
  .approach-message { grid-template-columns:1fr; gap:25px; } .approach-message>p { font-size:24px; } .approach-message>div>p { font-size:13px; }
  .approach-steps { grid-template-columns:1fr; gap:30px; margin-top:45px; } .approach-steps h3 { font-size:20px; margin:12px 0; }
  .services .section-top { display:block; margin-bottom:35px; } .services .section-top h2 { font-size:25px; margin-top:20px; }
  .service-row { padding:26px 0; gap:10px; grid-template-columns:26px 1fr 23px; } .service-row h3 { font-size:27px; } .service-row p { font-size:10px; } .pricing-link { font-size:11px; justify-content:space-between; gap:12px; }
  .contact h2 { font-size:61px; margin:24px 0 32px; } .contact h3 { font-size:24px; } .contact-bottom { flex-direction:column; gap:30px; } .contact-links { width:100%; } .contact-bottom p { font-size:11px; }
  .footer { padding:25px 22px; gap:24px; flex-direction:column; align-items:flex-start; } .footer img { width:160px; } .footer nav { flex-direction:column; gap:12px; }
  .case-dialog { max-width:calc(100% - 20px); max-height:94dvh; } .dialog-bar { padding:8px 15px; } .dialog-content { padding:22px 18px; } .dialog-content h2 { font-size:21px; } .dialog-content>p:not(.project-category) { font-size:12px; }
  .case-copy { grid-template-columns:1fr; gap:23px; margin:25px 0; } #case-meta>div { grid-template-columns:85px 1fr; font-size:11px; gap:12px; } #case-links a { width:100%; justify-content:space-between; }
}
@media(max-width:380px) { .hero h1 { font-size:69px; } .hero h2 { font-size:23px; } .hero-copy { padding-left:18px; padding-right:18px; } .hero { min-height:610px; } .scene { top:344px; } .hero .overline { font-size:8px; } .section-pad { padding-left:18px; padding-right:18px; } .works-heading h2 { font-size:54px; } .contact h2 { font-size:51px; } .contact h3 { font-size:21px; } .section-aside { font-size:11px; } .scene-caption .mini-label { display:none; } .service-row h3 { font-size:24px; } }
@media(min-width:761px) and (max-height:850px) { .hero { height:calc(100svh - 150px); min-height:555px; } .hero-copy { padding-top:27px; } .hero .overline { margin-bottom:17px; } .hero h1 { font-size:112px; } .hero h2 { font-size:26px; } .hero-category { margin:16px 0 18px; } .hero-description { font-size:11px; margin-top:10px; } .hero-link { margin-top:15px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } .js-ready .reveal { opacity:1; transform:none; } }