:root { --paper:#fbf4ea; --black:#0b0909; --font-display:"Hiragino Maru Gothic ProN","Yu Gothic",sans-serif; --font-body:"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#0b0909; color:#0b0909; font-family:var(--font-body); overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.site-shell { min-width:0; background:var(--paper); }
body[data-theme="a"] { --paper:#fbf4ea; --font-display:"Hiragino Maru Gothic ProN","Yu Gothic",sans-serif; --font-body:"Hiragino Maru Gothic ProN","Yu Gothic",sans-serif; }
body[data-theme="b"] { --paper:#fff7d6; --font-display:"Arial Rounded MT Bold","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif; --font-body:"Arial Rounded MT Bold","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif; }
body[data-theme="c"] { --paper:#fff8f6; --font-display:"Yu Mincho","Hiragino Mincho ProN",serif; --font-body:"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif; }

.opening { position:fixed; inset:0; z-index:1000; display:grid; place-items:center; overflow:hidden; background:#271d27; color:#fff; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .5s,visibility .5s; }
.opening.is-visible { opacity:1; visibility:visible; pointer-events:auto; }
.opening>p { position:absolute; top:24px; left:28px; margin:0; font:700 11px/1 monospace; letter-spacing:.16em; }
.opening-words { position:relative; width:100%; height:100%; display:grid; place-items:center; }
.opening-words b { position:absolute; font-family:var(--font-display); font-size:clamp(52px,11vw,170px); white-space:nowrap; opacity:0; animation:softWord 3s both; }
.opening-words b:nth-child(2) { animation-delay:.65s; color:#ff8ab8; }.opening-words b:nth-child(3) { animation-delay:1.3s; color:#fff28c; }
.opening-mark { position:absolute; right:28px; bottom:28px; width:128px; height:128px; display:grid; place-content:center; text-align:center; border:2px solid; border-radius:50%; font:800 12px/1.05 monospace; transform:rotate(7deg); animation:markIn .65s 2.05s both; }.opening-mark span { font-size:42px; line-height:.85; }
.opening-skip { position:absolute; z-index:2; top:25px; right:28px; padding:0; border:0; border-bottom:1px solid; background:transparent; color:#fff; font:800 10px/2 monospace; letter-spacing:.12em; cursor:pointer; }
.opening>i { position:absolute; left:0; bottom:0; height:8px; background:#ff4699; animation:progress 3s linear both; }
.opening-flash { position:absolute; inset:0; opacity:0; background:radial-gradient(circle at 25% 30%,#ff8ab8 0 8%,transparent 9%),radial-gradient(circle at 72% 65%,#72dcff 0 6%,transparent 7%); mix-blend-mode:screen; animation:softFlash 3s both; }
body[data-theme="b"] .opening { background:#5526c7; } body[data-theme="b"] .opening-words b { animation-name:popWord; -webkit-text-stroke:3px #0b0909; paint-order:stroke fill; text-shadow:8px 8px 0 #0b0909; } body[data-theme="b"] .opening-words b:nth-child(2){color:#72dcff} body[data-theme="b"] .opening-words b:nth-child(3){color:#ffe63b}
body[data-theme="c"] .opening { background:linear-gradient(135deg,#100b18,#38112d 55%,#4c274d); } body[data-theme="c"] .opening-words b { animation-name:romanceWord; font-weight:500; letter-spacing:.08em; } body[data-theme="c"] .opening-words b:nth-child(2){color:#f3b8db} body[data-theme="c"] .opening-words b:nth-child(3){color:#fff1b8}

.site-header { position:fixed; z-index:50; inset:0 0 auto; height:74px; padding:14px 28px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; color:#fff; mix-blend-mode:difference; pointer-events:none; }.site-header a { pointer-events:auto; }.brand { justify-self:start; line-height:.78; }.brand b { display:block; font-size:23px; letter-spacing:-.11em; }.brand span,.site-header p,.site-header>a:last-child { font:700 9px/1 monospace; letter-spacing:.14em; }.site-header p { margin:0; }.site-header>a:last-child { justify-self:end; border-bottom:1px solid; line-height:2; }
.style-switcher { position:fixed; z-index:90; top:13px; left:50%; transform:translateX(-50%); display:flex; gap:3px; padding:4px; border:1px solid rgba(255,255,255,.7); border-radius:999px; background:rgba(11,9,9,.74); color:#fff; backdrop-filter:blur(12px); }.style-switcher a { min-width:82px; height:37px; padding:0 10px; display:grid; grid-template-columns:auto 1fr; align-items:center; gap:6px; border-radius:999px; }.style-switcher a.is-selected { background:#fff; color:#0b0909; }.style-switcher b { font:900 12px/1 monospace; }.style-switcher span { font:700 7px/1.05 monospace; }

.hero { position:relative; min-height:100svh; overflow:hidden; isolation:isolate; background:#0b0909; color:#fff; }.hero-grid { position:absolute; inset:0; z-index:-3; display:grid; grid-template-columns:repeat(6,1fr); gap:3px; background:#0b0909; }.hero-cut { --cut:#ff4699; position:relative; overflow:hidden; background:var(--cut); }.hero-cut:after { content:""; position:absolute; inset:0; background:var(--cut); opacity:.16; mix-blend-mode:color; }.hero-cut video { position:absolute; inset:50% auto auto 50%; width:max(100%,320px); height:100%; object-fit:cover; transform:translate(-50%,-50%) scale(1.05); filter:saturate(.84) contrast(1.08); }.hero-cut span { position:absolute; z-index:2; left:8px; bottom:8px; padding:7px; background:var(--cut); color:#0b0909; font:900 8px/1 monospace; }.hero-scrim { position:absolute; inset:0; z-index:-2; background:linear-gradient(90deg,rgba(0,0,0,.8),rgba(0,0,0,.3) 55%,rgba(0,0,0,.1)); }.hero-scrim:after { content:""; position:absolute; inset:0; background-image:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.08) 4px); }
.hero-copy { position:absolute; z-index:3; left:5vw; bottom:9vh; max-width:1000px; }.hero-copy>p { margin:0 0 20px; font:800 10px/1 monospace; letter-spacing:.17em; }.hero-copy h1 { margin:0; font-family:var(--font-display); font-size:clamp(64px,9.5vw,150px); line-height:.8; letter-spacing:-.08em; text-shadow:3px 3px 0 #0b0909; }.hero-copy h1 span { color:#ffe63b; }.hero-copy>div { margin-top:26px; width:max-content; max-width:90vw; padding:12px 14px; display:grid; gap:7px; background:var(--paper); color:#0b0909; transform:rotate(-1deg); }.hero-copy small { max-width:700px; font-weight:700; }.hero-enter { position:absolute; z-index:4; right:4vw; bottom:6vh; width:145px; height:145px; display:grid; place-content:center; text-align:center; border-radius:50%; background:#ff4699; color:#0b0909; font:900 12px/1.1 monospace; transform:rotate(7deg); }.hero-enter span { display:block; font-size:25px; }
body[data-theme="a"] .hero-copy>div { border-radius:3px 18px 5px 14px; box-shadow:8px 8px 0 #ff8ab8; } body[data-theme="a"] .hero-enter { border:3px solid #0b0909; box-shadow:7px 8px 0 #fff28c; }
body[data-theme="b"] .hero-copy h1 { -webkit-text-stroke:2px #0b0909; paint-order:stroke fill; text-shadow:6px 6px 0 #0b0909; } body[data-theme="b"] .hero-copy h1 span{color:#72dcff} body[data-theme="b"] .hero-copy>div{border:3px solid;box-shadow:10px 10px 0 #ff4699;transform:rotate(1.5deg)} body[data-theme="b"] .hero-enter{border:4px solid;box-shadow:8px 8px 0 #72dcff;animation:stickerBob 1.8s infinite}
body[data-theme="c"] .hero-scrim { background:linear-gradient(90deg,rgba(20,8,22,.9),rgba(58,16,49,.36),rgba(20,8,22,.16)); } body[data-theme="c"] .hero-copy h1 { font-weight:500; letter-spacing:-.02em; line-height:.9; text-shadow:0 8px 30px rgba(0,0,0,.5); } body[data-theme="c"] .hero-copy h1 span{color:#f3b8db} body[data-theme="c"] .hero-copy>div{transform:none;border-left:4px solid #f3b8db;background:rgba(255,248,246,.92)} body[data-theme="c"] .hero-enter{border:1px solid rgba(255,255,255,.7);background:linear-gradient(145deg,#f3b8db,#fff1b8);box-shadow:0 18px 45px rgba(56,17,45,.4)}

.creative-overview { position:relative; padding:0 0 86px; overflow:hidden; background:#f2f2f0; color:#111; border-top:9px solid #0b0909; }
.creative-overview:before { content:""; position:absolute; inset:0 50% 0 0; opacity:.42; background-image:linear-gradient(106deg,transparent 0 49.5%,rgba(20,20,20,.12) 50%,transparent 50.5%),linear-gradient(6deg,transparent 0 49.5%,rgba(20,20,20,.09) 50%,transparent 50.5%); background-size:132px 96px,175px 118px; transform:skewY(-4deg); }
.creative-overview { display:grid; grid-template-columns:1fr 1.08fr; }
.creative-statement { position:relative; z-index:2; min-height:680px; padding:110px 7vw 75px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
.creative-statement>p { margin:0 0 34px; padding:7px 9px; background:#fff; font:900 9px/1 monospace; letter-spacing:.14em; }
.creative-statement h2 { margin:0; font-family:var(--font-display); font-size:clamp(48px,5.8vw,90px); line-height:1.08; letter-spacing:-.07em; }
.creative-statement h2 em { display:inline-block; color:#ff4699; font-style:normal; }
.statement-copy { margin-top:40px; display:grid; gap:7px; }.statement-copy span { font-size:13px; font-weight:800; }.statement-copy b { font-size:clamp(18px,1.7vw,26px); }
.creative-statement>a { margin-top:42px; padding:12px 18px; border:1px solid; border-radius:999px; font:800 9px/1 monospace; transition:background .2s,color .2s; }.creative-statement>a:hover { background:#111; color:#fff; }
.production-wall { position:relative; min-width:0; min-height:680px; overflow:hidden; display:grid; grid-template-rows:auto 1fr; align-content:center; background:#dededd; }
.wall-caption { position:relative; z-index:3; padding:28px 34px 8px; display:flex; justify-content:space-between; gap:20px; align-items:center; }.wall-caption span { font:900 10px/1 monospace; letter-spacing:.15em; }.wall-caption small { max-width:260px; font-size:9px; font-weight:800; text-align:right; }
.wall-stage { align-self:center; width:112%; margin-left:-5%; transform:rotate(6deg); filter:drop-shadow(0 14px 13px rgba(0,0,0,.16)); }
.wall-row { margin:5px 0; overflow:hidden; }.wall-track { width:max-content; display:flex; gap:6px; will-change:transform; animation:wallFlow 29s linear infinite; }.wall-row-2 .wall-track { animation-direction:reverse; animation-duration:34s; }.wall-row-3 .wall-track { animation-duration:31s; }
.production-tile { position:relative; flex:0 0 215px; width:215px; height:112px; padding:13px 15px; overflow:hidden; display:flex; flex-direction:column; justify-content:flex-end; border:2px solid #fff; background:#111; color:#fff; isolation:isolate; }
.production-tile:before,.production-tile:after { content:""; position:absolute; z-index:-1; pointer-events:none; }.production-tile:before { inset:-35%; background:conic-gradient(from 90deg,#ff4699,#ffe63b,#72dcff,#a78bfa,#ff4699); opacity:.82; transform:rotate(12deg); }.production-tile:after { inset:0; background:linear-gradient(15deg,rgba(0,0,0,.68),transparent 70%); }
.production-tile small { font:900 8px/1 monospace; letter-spacing:.12em; }.production-tile b { margin-top:5px; max-width:170px; font:900 20px/.9 var(--font-display); }.production-tile span { position:absolute; top:10px; right:10px; font:900 9px/1 monospace; }
.tile-2:before { background:radial-gradient(circle at 30% 40%,#ffe63b 0 18%,transparent 19%),linear-gradient(125deg,#271765 0 48%,#ff4699 49%); }.tile-3:before { background:repeating-linear-gradient(-18deg,#72dcff 0 18px,#111 19px 25px,#f7f1e8 26px 43px); }.tile-4:before { background:linear-gradient(135deg,#ff7b54 0 48%,#ffe63b 49% 70%,#111 71%); }.tile-5:before { background:radial-gradient(circle at 70% 35%,#fff 0 7%,transparent 8%),radial-gradient(circle at 38% 55%,#ff4699 0 21%,transparent 22%),#291765; }.tile-6:before { background:linear-gradient(110deg,#111 0 30%,#a78bfa 31% 65%,#72dcff 66%); }.tile-7:before { background:repeating-radial-gradient(circle at 25% 50%,#ffe63b 0 9px,#ff4699 10px 19px,#111 20px 25px); }.tile-8:before { background:linear-gradient(20deg,#d8ff36,#72dcff 45%,#ff4699); }
.capability-grid { position:relative; z-index:3; grid-column:1/-1; margin:0 5vw; display:grid; grid-template-columns:repeat(3,1fr); border-top:2px solid; border-left:2px solid; background:var(--paper); }
.capability-grid article { min-height:180px; padding:19px; display:grid; grid-template-columns:auto 1fr auto; gap:18px; border-right:2px solid; border-bottom:2px solid; }.capability-grid article>span,.capability-grid article>b { font:900 10px/1 monospace; }.capability-grid article>b { align-self:end; font-size:25px; }.capability-grid small { font:800 8px/1.3 monospace; }.capability-grid h3 { margin:23px 0 6px; font-family:var(--font-display); font-size:clamp(28px,3.2vw,52px); line-height:.9; letter-spacing:-.06em; }.capability-grid p { margin:0; font-size:11px; font-weight:800; }
.client-marquee { position:relative; z-index:3; grid-column:1/-1; margin-top:52px; }.client-marquee>p,.client-marquee>small { margin:0 5vw 14px; font:900 9px/1 monospace; letter-spacing:.15em; }.client-marquee>small { display:block; margin-top:12px; text-align:right; opacity:.58; }
.client-window { overflow:hidden; border-top:2px solid; border-bottom:2px solid; background:#fff; }.client-track { width:max-content; display:flex; animation:logoFlow 24s linear infinite; }.client-track span { width:190px; height:86px; display:flex; align-items:center; justify-content:center; gap:9px; border-right:1px solid #aaa; }.client-track i { font:900 25px/1 var(--font-display); font-style:normal; letter-spacing:-.08em; }.client-track b { align-self:flex-start; margin-top:17px; font:900 8px/1 monospace; }
body[data-theme="a"] .creative-statement h2 em { text-decoration:underline wavy #ffe63b 5px; } body[data-theme="a"] .capability-grid article:nth-child(2){background:#ffe63b}
body[data-theme="b"] .creative-overview { background:#72dcff; } body[data-theme="b"] .creative-overview:before{opacity:.24} body[data-theme="b"] .creative-statement h2 em{-webkit-text-stroke:2px #111;paint-order:stroke fill;text-shadow:5px 5px 0 #ffe63b;transform:rotate(-2deg)} body[data-theme="b"] .production-wall{background:#291765} body[data-theme="b"] .production-tile{border:3px solid #111;box-shadow:4px 4px 0 #111} body[data-theme="b"] .capability-grid{box-shadow:9px 9px 0 #111} body[data-theme="b"] .capability-grid article:nth-child(2){background:#ffe63b}
body[data-theme="c"] .creative-overview { background:#f4ecef; } body[data-theme="c"] .creative-overview:before{opacity:.18} body[data-theme="c"] .creative-statement h2{font-weight:500;letter-spacing:-.02em} body[data-theme="c"] .creative-statement h2 em{color:#9d376e} body[data-theme="c"] .production-wall{background:#2b1727} body[data-theme="c"] .wall-stage{transform:rotate(-3deg)} body[data-theme="c"] .production-tile{border-color:#f3b8db;border-radius:3px} body[data-theme="c"] .capability-grid article:nth-child(2){background:#f3d7e7}

.work-gallery { position:relative; padding:110px 5vw 125px; overflow:hidden; background:radial-gradient(circle at 50% 0,#332839,#17131e 42%,#0d0b12); color:#fff; }.work-gallery:before { content:""; position:absolute; inset:0; opacity:.28; background-image:radial-gradient(rgba(255,255,255,.22) .7px,transparent .8px); background-size:7px 7px; }.work-gallery-head { position:relative; z-index:2; margin-bottom:55px; display:grid; grid-template-columns:1fr 1.6fr 1fr; align-items:end; gap:30px; }.work-gallery-head>p { margin:0; font:800 10px/1 monospace; letter-spacing:.16em; }.work-gallery-head h2 { margin:0; font-family:var(--font-display); font-size:clamp(48px,6vw,92px); line-height:.88; letter-spacing:-.07em; }.work-gallery-head h2 em { color:#ff8ab8; font-style:normal; }.work-gallery-head>span { justify-self:end; max-width:320px; font-size:12px; font-weight:700; line-height:1.8; }
.work-card-grid { position:relative; z-index:2; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }.work-card { --card:#ff4699; position:relative; min-width:0; padding:16px 16px 20px; overflow:hidden; border:1px solid color-mix(in srgb,var(--card) 55%,white); border-radius:30px; background:linear-gradient(155deg,color-mix(in srgb,var(--card) 72%,white),color-mix(in srgb,var(--card) 68%,#8f78e8) 44%,#211827); box-shadow:0 24px 60px rgba(0,0,0,.28); transition:translate .3s,box-shadow .3s; }.work-card:before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 82% 5%,rgba(255,255,255,.58),transparent 24%),linear-gradient(120deg,transparent 42%,rgba(255,255,255,.11) 50%,transparent 58%); }.work-card:hover { translate:0 -7px; box-shadow:0 34px 72px rgba(0,0,0,.38); }
.work-card-top { position:relative; z-index:3; height:46px; display:flex; justify-content:space-between; }.work-card-top>span { padding:8px 12px 7px; height:max-content; border-radius:999px; background:rgba(17,12,22,.58); font:900 9px/1 monospace; }.work-card-top button { width:40px; height:40px; border:1px solid rgba(255,255,255,.7); border-radius:50%; background:#fff; color:#211827; font-size:22px; cursor:pointer; box-shadow:0 9px 24px rgba(0,0,0,.24); }.work-card-top button.is-favorite { background:#ffe63b; }
.work-card-media { position:relative; aspect-ratio:9/12; overflow:hidden; border:2px dashed rgba(255,255,255,.62); border-radius:24px; background:rgba(0,0,0,.15); }.work-card-media iframe { position:absolute; inset:50% auto auto 50%; width:108%; height:108%; border:0; transform:translate(-50%,-50%); pointer-events:none; }.work-card-media:after { content:""; position:absolute; inset:0; background:linear-gradient(to bottom,transparent 58%,rgba(9,7,12,.55)); pointer-events:none; }.work-card-media>b { position:absolute; z-index:2; left:18px; bottom:15px; color:#fff; font:900 clamp(36px,4vw,58px)/.8 monospace; }.work-card-media>a { position:absolute; z-index:3; top:14px; right:14px; width:48px; height:48px; display:grid; place-items:center; padding-left:3px; border-radius:50%; background:#fff; color:#201827; box-shadow:0 10px 24px rgba(0,0,0,.28); }
.work-card-copy { position:relative; z-index:2; padding:17px 7px 2px; }.work-card-copy>small { font:800 10px/1 monospace; }.work-card-copy h3 { margin:8px 0 6px; font-family:var(--font-display); font-size:clamp(28px,2.6vw,44px); line-height:1; letter-spacing:-.06em; }.work-card-copy>p { margin:0; min-height:40px; font-size:13px; font-weight:800; line-height:1.6; }.work-card-meta { margin-top:15px; padding-top:13px; border-top:1px solid rgba(255,255,255,.46); display:flex; align-items:center; justify-content:space-between; gap:10px; }.work-card-meta>span { max-width:55%; font:800 8px/1.4 monospace; }.inline-socials { display:flex; gap:6px; }.social-icon { width:34px; height:34px; display:grid; place-items:center; border:2px solid #fff; border-radius:50%; background:rgba(255,255,255,.92); color:#0b0909; }.social-icon i { font:900 15px/1 Arial; font-style:normal; }.social-instagram { border-style:double; border-width:4px; border-color:#ff4699; }.social-tiktok i { text-shadow:-1px 0 #72dcff,1px 0 #ff4699; }.work-gallery-swipe { display:none; }
body[data-theme="a"] .work-card { border-radius:34px 12px 32px 16px; } body[data-theme="a"] .work-card-media { border-radius:26px 9px 24px 12px; }
body[data-theme="b"] .work-gallery { background:#291765; } body[data-theme="b"] .work-card { border:4px solid #0b0909; border-radius:22px; box-shadow:10px 10px 0 #0b0909; } body[data-theme="b"] .work-card:nth-child(odd){rotate:-.65deg} body[data-theme="b"] .work-card:nth-child(even){rotate:.65deg} body[data-theme="b"] .work-card-media{border:3px dashed #0b0909;border-radius:13px} body[data-theme="b"] .work-card-copy h3{-webkit-text-stroke:1px #0b0909;paint-order:stroke fill;text-shadow:3px 3px 0 #0b0909}
body[data-theme="c"] .work-gallery { background:radial-gradient(circle at 50% -10%,#612d5a,#19101d 47%,#0c0910); } body[data-theme="c"] .work-card { border-color:rgba(255,255,255,.42); border-radius:120px 120px 24px 24px/34px 34px 24px 24px; background:linear-gradient(160deg,color-mix(in srgb,var(--card) 52%,white),color-mix(in srgb,var(--card) 42%,#62436d) 48%,#251724); } body[data-theme="c"] .work-card-media { border:1px solid rgba(255,255,255,.58); border-radius:100px 100px 16px 16px/28px 28px 16px 16px; } body[data-theme="c"] .work-card-copy h3{font-weight:500;letter-spacing:0}

.portfolio { padding:115px 5vw 90px; background:var(--paper); border-top:10px solid #0b0909; }.portfolio-heading>p { margin:0 0 24px; font:800 10px/1 monospace; letter-spacing:.18em; }.portfolio-heading h2 { margin:0; max-width:1100px; font-family:var(--font-display); font-size:clamp(52px,8vw,128px); line-height:.88; letter-spacing:-.08em; }.portfolio-heading h2 em { color:#ff4699; font-style:normal; text-decoration:underline; }.portfolio-intro { margin:65px 0 80px auto; max-width:720px; display:grid; grid-template-columns:1fr auto; gap:35px; align-items:end; }.portfolio-intro p { margin:0; font-size:clamp(17px,1.8vw,25px); font-weight:800; line-height:1.8; }.portfolio-intro span { writing-mode:vertical-rl; font:700 9px/1 monospace; }.market-strip { margin:-40px 0 65px; display:flex; overflow:auto; border:2px solid; background:#ffe63b; }.market-strip span { flex:1; min-width:max-content; padding:13px 15px; border-right:2px solid; text-align:center; font:900 9px/1 monospace; }.services { display:grid; grid-template-columns:repeat(4,1fr); border-top:2px solid; border-left:2px solid; }.services article { min-height:280px; padding:18px; border-right:2px solid; border-bottom:2px solid; display:flex; flex-direction:column; }.services article>span { align-self:flex-end; width:40px; height:40px; display:grid; place-items:center; border-radius:50%; background:#0b0909; color:var(--paper); font:800 10px/1 monospace; }.services small { margin-top:28px; font:800 9px/1 monospace; }.services h3 { margin:10px 0 auto; font-family:var(--font-display); font-size:clamp(32px,4vw,56px); }.services p { margin:24px 0 0; font-weight:700; line-height:1.7; }
.profile { margin-top:105px; padding:28px 0 34px; display:grid; grid-template-columns:.45fr 1.15fr 1fr; gap:4vw; border-top:2px solid; border-bottom:2px solid; }.profile-label { display:flex; flex-direction:column; justify-content:space-between; align-items:flex-start; }.profile-label span { padding:8px 11px; border:2px solid; border-radius:50%; font:900 9px/1 monospace; }.profile-label b,.profile-main>p { margin:0; font:800 9px/1.3 monospace; }.profile-main h3 { margin:17px 0 0; font-family:var(--font-display); font-size:clamp(42px,5vw,78px); line-height:.92; letter-spacing:-.07em; }.profile-main h3 em { color:#ff4699; font-style:normal; }.profile-copy { padding-top:20px; }.profile-copy>p { margin:0 0 30px; font-size:16px; font-weight:800; line-height:1.9; }.profile-copy dl { margin:0; display:grid; grid-template-columns:1fr 1fr; border-top:1px solid; border-left:1px solid; }.profile-copy dl>div { min-height:68px; padding:10px; border-right:1px solid; border-bottom:1px solid; }.profile-copy dt { margin-bottom:8px; font:800 8px/1 monospace; }.profile-copy dd { margin:0; font:900 9px/1.35 monospace; }.mid-contact { margin-top:40px; min-height:175px; padding:22px 26px; display:grid; grid-template-columns:1fr auto; grid-template-rows:auto 1fr; align-items:end; border:3px solid; background:#ff4699; box-shadow:10px 10px 0 #0b0909; }.mid-contact small { align-self:start; font:900 9px/1 monospace; }.mid-contact strong { font-family:var(--font-display); font-size:clamp(40px,6.2vw,94px); line-height:.86; }.mid-contact>span { grid-column:2; grid-row:1/3; align-self:center; font-size:65px; }

.ending { position:relative; min-height:100svh; padding:105px 6vw 60px; overflow:hidden; background:#0b0909; color:var(--paper); }.ending:before { content:"★"; position:absolute; right:-4vw; top:-14vh; color:#ff4699; font-size:46vw; opacity:.18; }.ending>p:first-child { font:800 11px/1 monospace; letter-spacing:.18em; }.ending h2 { position:relative; margin:24px 0 42px; max-width:1100px; font-family:var(--font-display); font-size:clamp(62px,11vw,165px); line-height:.83; letter-spacing:-.08em; }.favorite-list { position:relative; display:flex; flex-wrap:wrap; gap:10px; max-width:900px; }.favorite-list a { width:min(280px,44vw); min-height:100px; padding:16px; color:#0b0909; border:2px solid var(--paper); display:grid; grid-template-columns:auto 1fr auto; align-items:end; box-shadow:6px 6px 0 var(--paper); }.restart { position:relative; display:inline-block; margin-top:35px; border-bottom:1px solid; font:700 11px/2 monospace; }.ending-copy { position:absolute; right:6vw; bottom:8vh; font-weight:800; line-height:1.8; }.ending-copy a { border-bottom:1px solid; }.ending-contact { position:absolute; right:6vw; top:12vh; width:155px; height:155px; display:grid; place-content:center; text-align:center; border-radius:50%; background:#ffe63b; color:#0b0909; font:900 14px/1.1 monospace; transform:rotate(7deg); }

@keyframes softWord { 0%,8%{opacity:0;filter:blur(12px);transform:translateY(28px) scale(.96)} 17%,31%{opacity:1;filter:blur(0);transform:none} 43%,100%{opacity:0;filter:blur(6px);transform:translateY(-18px)} }
@keyframes popWord { 0%,8%{opacity:0;transform:scale(.25) rotate(-11deg)} 18%,31%{opacity:1;transform:scale(1) rotate(1deg)} 23%{transform:scale(1.12)} 42%,100%{opacity:0;transform:scale(1.25) rotate(7deg)} }
@keyframes romanceWord { 0%,8%{opacity:0;filter:blur(18px);letter-spacing:.32em} 18%,32%{opacity:1;filter:blur(0);letter-spacing:.08em} 45%,100%{opacity:0;filter:blur(12px);letter-spacing:.18em} }
@keyframes softFlash { 0%,30%,55%,78%,100%{opacity:0;transform:scale(.8)} 35%,60%,83%{opacity:.55;transform:scale(1.08)} }
@keyframes markIn { from{opacity:0;transform:scale(.5) rotate(-10deg)} to{opacity:1;transform:scale(1) rotate(7deg)} }
@keyframes progress { from{width:0} to{width:100%} }
@keyframes stickerBob { 50%{translate:0 -7px;rotate:-2deg} }
@keyframes wallFlow { to{transform:translateX(-50%)} }
@keyframes logoFlow { to{transform:translateX(-50%)} }

@media (max-width:1100px) and (min-width:761px) { .work-card-grid{grid-template-columns:repeat(2,1fr)} .work-gallery-head{grid-template-columns:.7fr 1.5fr}.work-gallery-head>span{display:none} }
@media (max-width:760px) {
  .style-switcher { top:66px; }.style-switcher a { min-width:47px; width:47px; height:31px; padding:0; display:grid; place-items:center; }.style-switcher span{display:none}
  .site-header { height:62px; padding:11px 14px; grid-template-columns:1fr auto; }.site-header p{display:none}.brand b{font-size:19px}.site-header>a:last-child{font-size:8px}
  .opening>p{left:16px;top:18px}.opening-skip{right:16px;top:16px}.opening-mark{width:92px;height:92px;right:16px;bottom:22px}.opening-mark span{font-size:31px}
  .hero-grid { grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(2,1fr); }.hero-cut video{width:max(100%,210px)}.hero-scrim{background:linear-gradient(0deg,rgba(0,0,0,.8),rgba(0,0,0,.15) 75%)}.hero-copy{left:16px;right:16px;bottom:12vh}.hero-copy>p{max-width:250px;line-height:1.5}.hero-copy h1{font-size:18vw}.hero-copy>div{margin-top:17px;padding:9px 10px}.hero-copy small{max-width:260px;font-size:10px;line-height:1.5}.hero-enter{width:94px;height:94px;right:12px;bottom:18px;font-size:8px}.hero-enter span{font-size:17px}
  .creative-overview{display:block;padding-bottom:58px}.creative-statement{min-height:590px;padding:90px 20px 62px}.creative-statement>p{margin-bottom:25px}.creative-statement h2{font-size:13.3vw}.statement-copy{margin-top:32px}.creative-statement>a{margin-top:34px}.production-wall{min-height:455px}.wall-caption{padding:22px 17px 10px}.wall-caption small{display:none}.wall-stage{width:150%;margin-left:-24%;transform:rotate(5deg)}.production-tile{flex-basis:155px;width:155px;height:82px;padding:9px 10px}.production-tile b{font-size:14px}.production-tile small{font-size:6px}.capability-grid{margin:0 18px;grid-template-columns:1fr}.capability-grid article{min-height:128px;padding:15px}.capability-grid h3{margin:13px 0 5px;font-size:34px}.client-marquee{margin-top:40px}.client-marquee>p,.client-marquee>small{margin-left:18px;margin-right:18px}.client-track span{width:145px;height:68px}.client-track i{font-size:20px}
  .work-gallery { padding:88px 0 72px; }.work-gallery-head{margin-bottom:34px;padding:0 18px;grid-template-columns:1fr;gap:18px}.work-gallery-head h2{font-size:14.5vw}.work-gallery-head>span{justify-self:start;font-size:10px}.work-card-grid{display:flex;gap:14px;padding:0 18px 28px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.work-card-grid::-webkit-scrollbar{display:none}.work-card{flex:0 0 min(84vw,340px);scroll-snap-align:center;padding:12px 12px 17px}.work-card:hover{translate:0}.work-card-media{aspect-ratio:9/11.5}.work-card-copy h3{font-size:32px}.work-card-copy>p{min-height:0;font-size:11px}.work-gallery-swipe{display:block;margin:0 18px;font:800 9px/1 monospace;letter-spacing:.14em}body[data-theme="b"] .work-card:nth-child(n){rotate:0deg}
  .portfolio{padding:84px 18px 70px}.portfolio-heading h2{font-size:15vw}.portfolio-intro{margin:48px 0 60px;grid-template-columns:1fr}.portfolio-intro span{writing-mode:horizontal-tb}.market-strip{margin:-38px 0 52px}.services{grid-template-columns:1fr 1fr}.services article{min-height:250px;padding:13px}.services h3{font-size:32px}.services p{font-size:12px}.profile{margin-top:75px;grid-template-columns:1fr;gap:28px}.profile-label{min-height:64px;flex-direction:row}.profile-main h3{font-size:13vw}.profile-copy{padding-top:0}.profile-copy>p{font-size:14px}.mid-contact{min-height:145px;padding:16px;box-shadow:7px 7px 0 #0b0909}.mid-contact strong{font-size:10vw}.mid-contact>span{font-size:44px}
  .ending{padding:92px 20px 180px}.ending h2{font-size:20vw}.ending-contact{top:auto;bottom:25px;right:20px;width:130px;height:130px}.ending-copy{position:relative;right:auto;bottom:auto;margin-top:60px;font-size:13px}.favorite-list a{width:100%}
}
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto} *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important}.opening{display:none} }
