:root{
--paper:#f7f7f2;--ink:#20211e;--muted:#62665b;--lime:#d6ff62;--line:#d7d8d0;
--accent-hover:#c5ee50;--accent-active:#bce044;--note:#eeeee5;--note-green:#e1edc6;
--note-ink:#4f5447;--tape:#d2d5c5a6;--hero-tape:#e4e4dbaa;--tag:#eaeae4;
--focus:#52652b;--shadow:#00000012;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:30px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'Golos Text',Arial,sans-serif;font-size:16px}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
button,a,summary{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:5px}
::selection{background:var(--lime);color:var(--ink)}
.wrap{width:min(1320px,calc(100% - 100px));margin:auto}
header{min-height:112px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}
.logo{font-size:25px;font-weight:900;letter-spacing:-.025em;position:relative;display:inline-flex;flex-wrap:wrap;align-items:center;min-height:44px}
.logo small{flex-basis:100%;font-size:12px;font-weight:400;letter-spacing:.03em;margin-top:5px}
.logo-mark{color:var(--ink);display:inline-flex;align-items:center;justify-content:center;background:var(--lime);font-size:24px;width:25px;height:25px;border-radius:50%;margin-left:10px;vertical-align:middle}
nav{display:flex;gap:32px;font-size:14px}
nav a{display:inline-flex;align-items:center;min-height:44px}
nav a:hover{color:var(--focus)}
.header-cta{border-bottom:1px solid var(--ink);padding:12px 0;font-size:14px;min-height:44px;display:inline-flex;align-items:center;white-space:nowrap}
.header-cta span{margin-left:23px}
.hero{display:grid;grid-template-columns:1.12fr 1fr;min-height:665px;position:relative;padding-top:63px;padding-bottom:48px;border-bottom:1px solid var(--line)}
h1{font-size:clamp(64px,6.9vw,96px);line-height:.99;letter-spacing:-.035em;font-weight:800;margin:7px 0 30px}
.highlight{position:relative;white-space:nowrap}
.hero-copy p{color:var(--muted);line-height:1.65;font-size:16px}
.hero-actions{display:flex;margin-top:30px}
.button{display:inline-flex;align-items:center}
.hand{font-family:'Caveat',cursive;font-weight:500}
.hero-note{font-size:24px;transform:rotate(-4deg);margin-top:23px;margin-left:20px}
.hero-note span{font-size:35px;margin-left:12px}
.hero-art{position:relative;min-width:0;margin-left:15px}
.speech{display:none}
.scribble{position:absolute;right:15px;top:-14px;transform:rotate(8deg);font-size:31px;line-height:.9;z-index:1}
.scribble span{position:absolute;font-size:60px;left:-65px;top:6px}
.sticky{position:absolute;right:0;bottom:12px;background:var(--lime);padding:21px 30px 15px;font-size:28px;line-height:.95;transform:rotate(9deg);box-shadow:2px 5px 8px var(--shadow)}
.sticky:before{content:'';width:62px;height:20px;background:var(--hero-tape);position:absolute;top:-12px;left:39px;transform:rotate(-8deg)}
.sticky span{display:block;text-align:right;font-size:35px}
.cat-caption{position:absolute;bottom:11px;left:30px;font-size:12px;transform:rotate(-4deg)}
.cat-caption span{font-size:23px}
.mono{font-family:'IBM Plex Mono',monospace}
.services{display:grid;grid-template-columns:1.1fr 1fr 1fr}
h2{font-size:35px;font-weight:600;letter-spacing:-.025em;line-height:1.15;margin:21px 0}
h2 .hand{font-size:44px;font-weight:500;letter-spacing:-.025em}
em{font-style:normal}
.section-intro p{color:var(--muted);font-size:16px;line-height:1.7}
.card-bottom{display:flex;justify-content:space-between}
.work{border-top:1px solid var(--line);padding-top:50px;padding-bottom:65px}
.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;gap:20px}
.project{background:none;border:0;padding:0;text-align:left;min-width:0}
.tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}
.tags span{background:var(--tag);border-radius:5px;padding:6px 9px;font-size:12px;color:var(--muted)}
.about{display:grid;grid-template-columns:1fr 1.5fr;border-top:1px solid var(--line);padding-top:62px;padding-bottom:65px;gap:65px}
.about-note>.hand{font-size:32px;margin-top:24px;line-height:1.05;transform:rotate(-5deg)}
.big-star{font-size:125px;line-height:1.2;color:var(--ink);display:block;margin:20px 0 0 50px;text-shadow:7px 5px var(--lime)}
.about-copy h2{margin-top:0}
.about-copy p{line-height:1.7;color:var(--muted);font-size:16px;max-width:570px}
.stack span{font-family:'IBM Plex Mono',monospace;padding:8px 11px}
.process{padding:35px 0 49px;border-top:1px solid var(--line)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:35px;margin-top:28px}
.steps .mono{font-size:12px;color:var(--muted)}
.steps h3{font-size:20px;font-weight:500;margin:13px 0}
.steps p{font-size:16px;color:var(--muted);line-height:1.6}
.bottom{display:grid;grid-template-columns:1.05fr 1fr;gap:80px;padding:57px 0 70px;border-top:1px solid var(--line)}
.contact{position:relative}
.contact h2{font-size:42px;margin-bottom:20px}
.contact h2 .hand{font-size:51px}
.contact p{color:var(--muted);font-size:16px;line-height:1.6;margin-bottom:25px}
.contact-note{position:absolute;bottom:8px;right:0;font-size:24px;transform:rotate(-9deg);line-height:1}
.faq details{border-bottom:1px solid var(--line)}
summary{padding:22px 30px 22px 0;cursor:pointer;font-size:16px;list-style:none;position:relative;min-height:44px}
summary::-webkit-details-marker{display:none}
summary:after{content:'+';position:absolute;right:2px;font-size:20px;top:17px}
details[open] summary:after{content:'−'}
details p{font-size:16px;line-height:1.65;color:var(--muted);margin-top:0}
footer{border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;min-height:90px}
footer .logo{font-size:18px;min-height:44px}
footer .mono{font-size:12px;letter-spacing:.03em;color:var(--muted)}
footer .hand{font-size:22px}
/* Existing hero video presentation is preserved. */
.cat-stage{position:absolute;inset:34px -4px 15px -4px;display:flex;align-items:center;justify-content:center;mix-blend-mode:multiply;pointer-events:none;overflow:hidden}
.cat-stage video{display:block;width:auto;max-width:100%;height:100%;object-fit:contain;border:0;outline:0;aspect-ratio:1240/1244;mask-image:radial-gradient(ellipse 59% 54% at 43% 51%,#000 48%,#000 61%,transparent 96%)}
.cat-stage video::-webkit-media-controls{display:none!important}
@media(min-width:1500px){.hero{min-height:700px}}
@media(max-width:1100px){
.wrap{width:calc(100% - 60px)}.hero{min-height:640px}.hero-art{margin-left:0}
.sticky{font-size:24px}.scribble{font-size:25px}
.services{grid-template-columns:1fr 1fr}.section-intro{grid-column:1/-1}.section-intro h2 br{display:none}.section-intro p{display:none}.section-intro h2{margin-bottom:9px}
.contact-note{display:none}.section-heading{align-items:flex-start}.about{gap:30px}
}
@media(max-width:760px){
.wrap{width:calc(100% - 40px)}header{min-height:85px}nav{display:none}.logo{font-size:22px}
.hero{padding-top:28px;display:block;padding-bottom:25px}
h1{font-size:clamp(42px,12.3vw,72px);line-height:.99}
.hero-note{font-size:21px;margin-left:0}.hero-note span{font-size:29px;margin-left:4px}
.hero-art{height:380px;margin:30px auto 0;max-width:480px}
.hero-art .scribble{font-size:21px;right:8px;top:-8px}.hero-art .scribble span{font-size:42px;left:-46px}
.hero-art .sticky{font-size:21px;padding:16px 20px;bottom:8px;right:0}
.cat-caption{left:5px;bottom:0}.cat-stage{inset:10px -10px 8px -10px}
.services{grid-template-columns:1fr}.section-intro{margin-bottom:8px}.section-intro h2{margin-top:0}.section-intro h2 br{display:block}
h2{font-size:29px}h2 .hand{font-size:36px}
.work{padding-top:35px;padding-bottom:39px}.section-heading{display:block}.section-heading h2{max-width:290px}
.about{grid-template-columns:1fr;padding-top:38px;padding-bottom:40px;gap:25px}
.about-note>.hand{font-size:28px}.big-star{position:absolute;right:38px;font-size:80px;margin:0;transform:translateY(-65px)}.about-copy h2{font-size:29px}
.steps{grid-template-columns:1fr 1fr;gap:23px}.steps h3{font-size:18px}.process{padding-bottom:30px}
.bottom{grid-template-columns:1fr;gap:50px;padding:39px 0}.contact h2{font-size:35px;margin-top:0}.contact h2 .hand{font-size:44px}
footer{min-height:95px;flex-wrap:wrap;gap:12px;padding:20px 0}footer .mono{display:none}footer .hand{font-size:19px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}a,a::before{transition:none!important}}