:root{--paper:#f4f0e7;--ink:#212321;--red:#ee5239;--blue:#2449ed;--pink:#e7b8db;--mono:'IBM Plex Mono',monospace;--sans:'IBM Plex Sans',sans-serif;--serif:'Fraunces',serif;--pad:clamp(20px,4vw,70px)}
.hero-design{isolation:isolate}.hero-design:before{content:'';position:absolute;z-index:-1;inset:0;background:radial-gradient(ellipse at 88% 25%,#e7b8db88,transparent 38%),radial-gradient(ellipse at 5% 85%,#ee523918,transparent 38%);pointer-events:none}.work-card{perspective:1100px}.card-art{transform-origin:center;transition:box-shadow .45s}.card-art:after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--light-x,50%) var(--light-y,30%),#ffffff38,transparent 65%);opacity:0;transition:opacity .4s}.work-card:hover .card-art:after{opacity:1}.work-card:hover .card-art{box-shadow:0 24px 35px -25px #171b3155}.has-motion .work-card:hover{transform:none}.card-open{transition:transform .3s,background .3s}.work-card:hover .card-open{transform:rotate(45deg);background:#e7b8db}.contact-design{position:relative;isolation:isolate;overflow:hidden}.contact-design:before{content:'';position:absolute;z-index:-1;width:60%;height:160%;right:-30%;top:-30%;border:1px solid #ffffff40;border-radius:50%;transform:rotate(-25deg);pointer-events:none}.has-motion .contact-design:before{animation:contact-orbit 12s ease-in-out infinite alternate}@keyframes contact-orbit{to{transform:translateX(-18%) rotate(20deg)}}@media(prefers-reduced-motion:reduce){.contact-design:before{animation:none!important}}
[data-project^="wess-"] .art-image{object-fit:contain!important}
[data-project="surco-campaign"] .art-image{object-fit:contain!important}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.5 var(--sans)}a{color:inherit;text-decoration:none}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer}img{display:block;max-width:100%}button{color:inherit}::selection{background:var(--blue);color:white}:focus-visible{outline:3px solid var(--blue);outline-offset:5px}.skip{position:fixed;top:-80px;left:20px;z-index:300;padding:15px;background:white}.skip:focus{top:10px}.eyebrow,.hero-top,.hero-bottom>span,.hero-sticker,.ticker,.result-count,footer,.card-bottom>span,.art-kicker,.art-foot{font:12px/1.5 var(--mono);letter-spacing:.035em}.eyebrow{text-transform:uppercase}.nav{position:sticky;z-index:30;top:0;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px var(--pad);border-bottom:1px solid #21232126;background:#f4f0e7ed;backdrop-filter:blur(12px)}.wordmark{font-size:35px;font-weight:700;letter-spacing:-3px;line-height:1}.wordmark span{font:12px var(--mono);letter-spacing:0;vertical-align:top;margin-left:5px}.nav nav{display:flex;gap:28px;align-items:center}.nav nav a{font-size:14px}.nav-contact{padding:9px 18px;background:var(--ink);color:var(--paper);border-radius:30px}.hero-design{min-height:calc(100svh - 82px);padding:25px var(--pad) 35px;position:relative;overflow:hidden}.hero-top{display:flex;justify-content:space-between;gap:20px}.hero-design h1{font-size:clamp(70px,10.8vw,178px);font-weight:500;letter-spacing:-.075em;line-height:.94;margin:55px 0 44px;position:relative;max-width:1050px}.hero-design em,h2 em,.contact-title em{font-family:var(--serif);font-weight:400}.hero-design em{color:var(--red)}.asterisk{display:inline-block;color:var(--blue);font-size:.7em;vertical-align:top;margin-left:.2em;line-height:1}.hero-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px}.hero-bottom p{font-size:18px}.hero-bottom>span{text-align:right}.round-link{width:58px;height:58px;border-radius:50%;border:1px solid var(--ink);display:grid;place-items:center;font-size:28px}.hero-sticker{position:absolute;right:8%;top:38%;background:var(--pink);padding:25px 32px;transform:rotate(9deg);font-weight:500;font-size:15px;box-shadow:5px 7px 0 #212321}.ticker{overflow:hidden;background:var(--blue);color:white;padding:20px 0;font-size:21px}.ticker>div{width:max-content;animation:marquee 35s linear infinite;letter-spacing:.07em}@keyframes marquee{to{transform:translateX(-50%)}}.work-section{padding:85px var(--pad)}.section-title{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:42px}.section-title h2,.about h2{font-size:clamp(42px,5.5vw,86px);letter-spacing:-.055em;line-height:1.03;font-weight:500;margin:18px 0 0}.section-title p{max-width:340px}.filter-bar{display:flex;justify-content:space-between;align-items:center;gap:18px;border-top:1px solid #2123213b;padding:20px 0 32px}.filters{display:flex;flex-wrap:wrap;gap:8px}.filters button{padding:10px 16px;border:1px solid #21232145;border-radius:30px;background:none;font-size:14px;transition:background .2s,color .2s}.filters button.selected,.filters button:hover{background:var(--ink);color:white}.result-count{white-space:nowrap}.work-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 22px}.work-card{min-width:0;display:block;transition:transform .25s}.work-card:hover{transform:translateY(-5px)}.card-art{position:relative;aspect-ratio:1;overflow:hidden;container-type:inline-size;background:var(--card-color);border-radius:3px}.card-art>.art{height:100%}.card-art .art-image{width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.65,.3,1)}.work-card:hover .art-image{transform:scale(1.035)}.card-art>.card-open{position:absolute;right:15px;bottom:15px;display:grid;place-items:center;border-radius:50%;background:var(--paper);width:36px;height:36px;font-size:22px;box-shadow:0 1px 5px #0002}.card-bottom{display:flex;justify-content:space-between;gap:12px;align-items:start;margin-top:14px}.card-bottom h3{font-size:18px;line-height:1.2;margin:0 0 7px;font-weight:500;letter-spacing:-.025em}.card-bottom p{margin:0;font-size:13px;color:#5b5e58}.card-bottom>span{font-size:11px;text-align:right;padding-top:2px}.about{display:grid;grid-template-columns:1fr 2fr;gap:70px;padding:90px var(--pad);background:#e5bacf}.about h2{margin-top:0}.about p{max-width:660px;font-size:20px}.skills{display:flex;flex-wrap:wrap;gap:10px;margin:30px 0}.skills span{border:1px solid #21232166;padding:8px 14px;border-radius:30px;font-size:14px}.text-link{display:inline-block;border-bottom:1px solid;padding-bottom:5px}.contact-design{background:var(--blue);color:var(--paper);padding:65px var(--pad)}.contact-title{display:block;font-size:clamp(58px,9vw,145px);letter-spacing:-.07em;line-height:1.03;margin:40px 0 55px}.contact-title:hover{color:#e8c6e0}.contact-bottom{display:flex;justify-content:space-between;gap:25px}.contact-bottom p{margin:0}.contact-bottom a{text-decoration:underline;text-underline-offset:5px}footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:26px var(--pad)}footer button{border:0;background:none;padding:0;font:inherit}.intro-loader{display:none}.has-motion .intro-loader{display:flex;position:fixed;z-index:100;inset:0;background:var(--blue);color:var(--paper);align-items:center;justify-content:space-around;font:18px var(--mono);pointer-events:none}.intro-loader>span:first-child{font:150px var(--sans)}.design-cursor{display:none}.pointer-ready .design-cursor{display:grid;position:fixed;z-index:80;place-items:center;width:68px;height:68px;left:0;top:0;border-radius:50%;background:var(--blue);color:white;font:12px var(--mono);pointer-events:none;opacity:0;transform:translate(-50%,-50%)}
.project-dialog{width:min(1400px,96vw);max-width:96vw;max-height:94svh;padding:0;border:0;background:var(--paper);color:var(--ink);overscroll-behavior:contain}.project-dialog::backdrop{background:#111d;backdrop-filter:blur(6px)}body.dialog-open{overflow:hidden}.dialog-top,.dialog-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 25px;border-bottom:1px solid #21232130}.dialog-top{position:sticky;top:0;z-index:5;background:var(--paper)}.dialog-top button,.dialog-bottom button{background:none;border:0;padding:10px;font:14px var(--mono)}.dialog-body{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(260px,1fr)}#project-art{container-type:inline-size;align-self:start;background:var(--card-color)}#project-art>.art{aspect-ratio:1;overflow:hidden}#project-art .art-image{width:100%;height:100%;object-fit:contain}.dialog-body aside{padding:35px}.dialog-body h2{font:400 clamp(28px,3vw,45px)/1.1 var(--serif);margin:15px 0 25px}.dialog-body p{line-height:1.6}dl{margin-top:30px}dl>div{border-top:1px solid #2123212b;padding:14px 0}dt{font:12px var(--mono);text-transform:uppercase;margin-bottom:6px}dd{margin:0;font-size:15px}.project-disclosure{font-size:12px;color:#555c50;background:#e8e5dc;padding:12px}.project-cta{display:inline-block;background:var(--ink);color:white;padding:13px 19px;border-radius:30px;margin-top:20px}.dialog-bottom{border-top:1px solid #21232130;border-bottom:0}#project-controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center}#project-controls button,#project-controls a{padding:10px 15px;border:1px solid var(--ink);border-radius:25px;background:none;font-size:14px}#project-controls label{width:100%;font-size:14px}#project-controls input{width:100%;accent-color:var(--blue)}
.art{position:relative;background:var(--card-color);color:var(--ink)}.art-layout{height:100%;padding:7cqw;display:flex;flex-direction:column;justify-content:space-between}.art-kicker,.art-foot{font-size:3cqw}.art-kicker{display:flex;justify-content:space-between}.art-heading{font:600 14cqw/.95 var(--sans);letter-spacing:-.065em;margin:4cqw 0}.art-subtitle{font-size:4cqw;line-height:1.4}.art-native{padding:6cqw;background:#edf1f6}.native-post{background:white;height:100%;padding:4cqw;border:1px solid #ddd}.native-top{display:flex;gap:3cqw;align-items:center;font-size:3.5cqw;line-height:1.3}.native-avatar{background:#254fe9;color:white;width:9cqw;height:9cqw;border-radius:50%;display:grid;place-items:center}.native-top small{font-size:2.5cqw}.native-post img{width:100%;height:64%;object-fit:cover;margin:4cqw 0}.native-post p{font-size:3.5cqw;line-height:1.2;margin:2cqw 0}.art-before{--split:50%}.before-side{position:absolute;inset:0;background:#e9e02b;padding:8cqw;display:flex;flex-direction:column;justify-content:space-between}.before-side.bad{background:#36226d;color:#fff2a1;transform:none}.bad .art-heading{font-family:Georgia,serif;font-style:italic;transform:rotate(-6deg);font-size:11cqw;text-align:center;text-shadow:3px 3px #dd2359}.bad .art-subtitle{background:#df416a;padding:3cqw;transform:rotate(7deg)}.before-side.good{clip-path:inset(0 0 0 var(--split));background:#fa593d;color:#1f2420}.compare-handle{position:absolute;left:var(--split);height:100%;width:2px;background:white;top:0;z-index:2}.compare-handle:after{content:'↔';position:absolute;top:50%;left:-18px;width:38px;height:38px;background:white;border-radius:50%;display:grid;place-items:center}.art-meme .art-heading{font-size:9.5cqw}.meme-stack{height:39cqw;position:relative}.meme-stack span{position:absolute;left:4cqw;right:0;top:0;background:#f7f1e7;border:1px solid #262623;padding:3cqw;font:3.2cqw var(--mono);box-shadow:4px 4px #292c27}.meme-stack span:nth-child(2){top:8cqw;left:0;right:4cqw;transform:rotate(-4deg)}.meme-stack span:nth-child(3){top:17cqw;left:6cqw;transform:rotate(4deg)}.art-product img{width:100%;height:60%;object-fit:cover;mix-blend-mode:multiply}.art-product .art-heading{font-size:12cqw;margin:0}.art-carousel{background:#fa593d}.carousel-number{font:400 34cqw/.9 var(--serif);opacity:.5}.art-carousel .art-heading{font-size:13cqw}.carousel-dots{display:flex;gap:2cqw}.carousel-dots i{height:1cqw;flex:1;background:#2224}.carousel-dots i.active{background:#222}.art-info .art-heading{font-size:12cqw}.info-steps{display:grid;gap:3cqw}.info-steps>div{display:flex;align-items:center;gap:4cqw;border-bottom:1px solid #2224;padding-bottom:3cqw}.info-steps b{font:6cqw var(--serif);border:1px solid;border-radius:50%;width:11cqw;height:11cqw;display:grid;place-items:center}.info-steps span{font-size:5cqw}.art-testimonial blockquote{margin:0;font:400 10cqw/1.13 var(--serif);letter-spacing:-.035em}.review-note{font-size:3cqw;background:#fff6;padding:3cqw}.art-quote{color:#f0ebdd}.art-quote .art-heading{font-family:var(--serif);font-weight:400;font-size:16cqw}.art-quote .art-heading em{color:#c7ef5d}.art-flat img{object-fit:cover!important;width:100%;height:100%}.flat-label{position:absolute;bottom:6cqw;left:6cqw;background:#f4f0e7ed;padding:3cqw;font:3cqw var(--mono)}.art-bundle img{width:100%;height:56%;object-fit:cover;object-position:center 80%;mix-blend-mode:multiply}.art-bundle .art-heading{font-size:11cqw}.bundle-pill{background:var(--ink);color:white;padding:2cqw 4cqw;border-radius:20cqw;font-size:3cqw;align-self:start}.comparison-columns{display:grid;grid-template-columns:1fr 1fr;gap:4cqw}.comparison-columns>div{padding:4cqw;background:#fff8;border:1px solid #2223}.comparison-columns>div:last-child{background:#254ae8;color:white}.comparison-columns h4{font-size:5cqw;line-height:1.1;margin:0 0 4cqw}.comparison-columns p{font-size:3.6cqw;line-height:1.4}.art-comparison .art-heading{font-size:11cqw}.art-screenshot{padding:6cqw}.art-screenshot .art-heading{font-size:10cqw;margin-bottom:4cqw}.art-screenshot img{height:67%!important;object-fit:contain!important;border:1px solid #21232126;border-radius:10px;background:#f8f5ee;box-shadow:0 15px 30px #1232}.art-screenshot .art-foot{margin-top:3cqw}
@media(min-width:1250px){.work-card:nth-child(9n+1){grid-column:span 2}.work-card:nth-child(9n+1) .card-art{aspect-ratio:2.04}.work-card:nth-child(9n+1) .art{max-width:none}.work-card:nth-child(9n+1) .art-image{object-fit:contain}.work-card:nth-child(9n+1) .card-art{container-type:normal}.work-card:nth-child(9n+1) .art{container-type:inline-size;max-width:50%;margin:auto}.work-card:nth-child(9n+1) .art-layout{container-type:normal}}
@media(max-width:950px){.hero-sticker{right:5%;top:48%;padding:18px;font-size:12px}.nav nav{gap:15px}.work-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.section-title p{max-width:270px}.dialog-body{grid-template-columns:1fr}.dialog-body aside{padding:25px}.project-dialog{width:92vw}.about{grid-template-columns:1fr;gap:30px}.dialog-body #project-art{width:min(100%,650px);margin:auto}.hero-design h1{margin-top:65px}.nav nav a{font-size:12px}}
@media(max-width:600px){.nav{padding:15px 20px;gap:12px;flex-wrap:wrap}.wordmark{font-size:30px}.nav nav{order:3;width:100%;justify-content:space-between}.nav-contact{font-size:13px}.hero-top{font-size:10px}.hero-top span:last-child{max-width:150px;text-align:right}.hero-design{min-height:650px}.hero-design h1{font-size:19vw;margin:60px 0 95px}.hero-sticker{top:auto;bottom:150px;right:30px;padding:12px;font-size:10px}.hero-bottom>span{display:none}.hero-bottom p{font-size:16px}.asterisk{font-size:.6em}.work-section{padding-top:55px}.section-title{display:block}.section-title p{max-width:100%;margin-top:25px}.filter-bar{align-items:start;flex-direction:column}.filters button{padding:8px 12px;font-size:13px}.work-grid{grid-template-columns:1fr;gap:30px}.card-bottom h3{font-size:18px}.about{padding:55px 20px}.about p{font-size:18px}.contact-bottom{flex-direction:column;font-size:14px}.contact-title{font-size:16vw}.dialog-body aside{padding:22px}.dialog-top,.dialog-bottom{padding:10px 16px}.project-dialog{max-height:96svh;width:96vw}.dialog-bottom button{font-size:12px}.ticker{font-size:16px}footer{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ticker>div{animation:none}*,*:before,*:after{transition:none!important}}
html.reduced{scroll-behavior:auto}.reduced .ticker>div{animation:none}.reduced *, .reduced *:before,.reduced *:after{transition:none!important;animation:none!important}

/* A connected editorial archive. Images define their own frame. */
:root{--read-progress:0}
.nav:after{content:'';position:absolute;bottom:-1px;left:0;width:100%;height:3px;background:linear-gradient(90deg,#2449ed,#ee5239,#25a89b);transform:scaleX(var(--read-progress));transform-origin:left;pointer-events:none}
.hero-design{--wash-x:92%;background:#f9f7f1}
.hero-design:before{background:radial-gradient(ellipse at var(--wash-x) 25%,#fba73f80,transparent 46%),radial-gradient(ellipse at 8% 100%,#5ad5bf45,transparent 40%)}
.hero-sticker{background:#ffb440;box-shadow:5px 7px 0 #212321}
.work-section{
  --archive-angle:150deg;
  --archive-start:#f0efe9;
  --archive-end:#edece5;
  background:linear-gradient(var(--archive-angle),var(--archive-start) 0%,#f9f7f1 23%,#f9f7f1 68%,var(--archive-end) 100%);
}
.section-title .eyebrow{color:var(--blue)}
.filter-bar{border-top:2px solid var(--blue)}
.filters button{background:#ffffff90}.filters button.selected{background:var(--blue);border-color:var(--blue)}
.work-grid{display:block}.work-group{margin-bottom:76px;min-width:0}.work-group:last-child{margin-bottom:0}
.group-heading{display:flex;gap:22px;align-items:baseline;color:var(--group-color);border-top:2px solid var(--group-color);padding:22px 0;margin-bottom:12px}
.group-heading h3{font-size:clamp(26px,3.2vw,44px);letter-spacing:-.045em;line-height:1.1;font-weight:500;margin:0;flex:1}
.group-heading>span{font:12px var(--mono);white-space:nowrap}.group-heading>span:first-child{padding:8px 10px;color:white;background:var(--group-color)}
.group-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.group-gallery .work-card{display:inline-block;width:100%;break-inside:avoid;margin:0 0 32px;vertical-align:top;grid-column:auto}
.group-gallery .work-card .card-art{
  aspect-ratio:1;container-type:inline-size;border-radius:2px;
  padding:clamp(6px,.7vw,10px);
  border:1px solid var(--group-color);
  background:#f9f7f1;
  box-shadow:var(--frame-x,6px) var(--frame-y,6px) 0 var(--group-color);
  transition:box-shadow .4s ease;
}
.group-gallery .card-art>.art{overflow:hidden}
.work-group[aria-labelledby="group-brand"]{--frame-x:8px;--frame-y:8px}
.work-group[aria-labelledby="group-product"]{--frame-x:10px;--frame-y:3px}
.work-group[aria-labelledby="group-editorial"]{--frame-x:3px;--frame-y:8px}
.group-gallery .work-card:hover .card-art{
  box-shadow:var(--frame-x,6px) var(--frame-y,6px) 0 var(--group-color);
}
.group-gallery .card-art>.art{max-width:none;margin:0;width:100%;container-type:normal;height:100%}
.group-gallery .work-card .card-art--image{aspect-ratio:auto}
.group-gallery .work-card{transition:transform .25s,rotate .4s ease}
.group-gallery .card-art--image>.art{height:auto;background:transparent}
.group-gallery .card-art--image .art-image{width:100%;height:auto;object-fit:initial!important}
@media(hover:hover) and (pointer:fine){
  html:not(.reduced) .group-gallery .work-card:hover{rotate:-1deg}
  html:not(.reduced) .group-gallery .work-card:nth-child(even):hover{rotate:1deg}
  html:not(.reduced) .group-gallery .work-card:hover .card-art--image .art-image{transform:scale(1.025)}
}
.reduced .group-gallery .work-card:hover{transform:none}
.reduced .group-gallery .work-card:hover .art-image{transform:none}
@media(prefers-reduced-motion:reduce){
  .group-gallery .work-card:hover,
  .group-gallery .work-card:hover .art-image{transform:none!important}
  .group-gallery .work-card:hover{rotate:none!important}
}
.card-bottom{border-bottom:1px solid #21232130;padding-bottom:18px;margin-top:16px}
.card-bottom h4{font-size:19px;line-height:1.2;margin:0 0 7px;font-weight:500;letter-spacing:-.025em}
.card-bottom p{font-size:14px}.card-bottom>span{font-size:12px}.card-open{background:white}
#project-art.project-art--image{background:transparent}
#project-art.project-art--image>.art{aspect-ratio:auto;background:transparent}
#project-art.project-art--image .art-image{width:100%;height:auto;object-fit:initial}
.about{background:#ffbd66;background-image:linear-gradient(115deg,#ffcb78,#ffad65 75%);border-top:1px solid #21232133}
.about .eyebrow{color:#63330d}.skills span{background:#ffffff40}
.pointer-ready .design-cursor{width:16px;height:16px;border:2px solid white;background:#2449ed;color:white;box-shadow:0 0 0 1px #2449ed;z-index:9999;font:12px var(--mono);transition:width .25s,height .25s,background .25s;transform:none}
.pointer-ready .design-cursor.is-action{width:64px;height:64px;background:#2449edef;box-shadow:0 5px 25px #0002}

@media(max-width:650px){.group-gallery{grid-template-columns:1fr}.group-heading{gap:12px}.group-heading h3{font-size:26px}.group-heading>span:last-child{font-size:10px}.work-group{margin-bottom:48px}.group-gallery .work-card{margin-bottom:25px}}
/* Actual mouse events, rather than device guesses, activate the custom pointer. */
.pointer-ready .design-cursor{transform:translate(-50%,-50%)!important}.pointer-ready .design-cursor.is-down{transform:translate(-50%,-50%) scale(.8)!important}
.pointer-ready .design-cursor{display:grid!important;position:fixed;pointer-events:none;left:0;top:0}
.hero-design{min-height:850px;padding-top:24px;background:#f3f0e8}
.hero-design:before{background:linear-gradient(118deg,transparent 58%,#f7b33f55)}
.hero-signature{font:600 italic clamp(80px,18vw,290px)/1.1 var(--serif);letter-spacing:-.065em;white-space:nowrap;margin:32px 0 12px;color:var(--blue);position:relative;z-index:0}
.hero-composition{display:grid;grid-template-columns:1.4fr 1fr;align-items:center;gap:3vw;position:relative}
.hero-design h1{font-size:clamp(48px,6.7vw,110px);margin:25px 0 45px;line-height:1.05;letter-spacing:-.06em}
.hero-line{display:block;overflow:hidden;padding-bottom:.08em}.hero-line>*{display:block}
.hero-discipline{display:block;font:12px var(--mono);letter-spacing:.09em;margin-top:26px}
.hero-signature>span{display:inline-block;font-size:.6em;vertical-align:top;margin-left:.08em;line-height:1.5}
.hero-showcase{position:relative;min-height:410px;perspective:1000px;isolation:isolate}
.hero-piece{position:absolute;width:62%;top:5%;left:17%;box-shadow:0 20px 25px -15px #14203c66;transition:box-shadow .3s;transform-origin:center}
.hero-piece img{width:100%;height:auto}.hero-piece--one{transform:translateX(-23%) rotate(-12deg);z-index:1}.hero-piece--two{transform:translateX(20%) rotate(12deg);z-index:2}.hero-piece--three{transform:rotate(-3deg);z-index:3}.hero-piece:hover,.hero-piece:focus-visible{z-index:5;box-shadow:0 24px 38px -15px #14203c99}
.showcase-caption{position:absolute;bottom:0;left:17%;font:12px var(--mono);letter-spacing:.08em}
.hero-motion{display:block;border:0;border-bottom:1px solid currentColor;background:transparent;font:12px var(--mono);padding:8px 0;margin-top:24px;color:var(--blue)}
.hero-bottom{border-top:1px solid #21232130;padding-top:16px}
.group-heading{position:relative;overflow:hidden;border-top:0;border-bottom:1px solid #21232130;padding:30px 0 28px;gap:24px;--rule-scale:1}
.group-heading:before{content:'';position:absolute;top:0;left:0;width:100%;height:5px;background:var(--group-color);transform:scaleX(var(--rule-scale));transform-origin:left}
.group-heading h3{font:500 clamp(34px,5.8vw,86px)/1.04 var(--serif);letter-spacing:-.055em;max-width:85%}
.group-heading>span:first-child{background:transparent;color:var(--group-color);font:400 clamp(34px,5vw,76px)/1 var(--sans);letter-spacing:-.07em;padding:0;opacity:.45}
.group-heading>span:last-child{align-self:end;margin-bottom:8px}
.work-group:nth-child(even) .group-heading h3{font-style:italic}
.section-title h2{font-size:clamp(52px,7.5vw,116px)}
@media(max-width:850px){.hero-design{min-height:0}.hero-composition{grid-template-columns:1fr 1fr}.hero-design h1{font-size:6.8vw}.hero-showcase{min-height:280px}.hero-signature{font-size:21vw}.group-heading{gap:14px}.group-heading>span:last-child{display:none}}
@media(max-width:600px){.hero-composition{grid-template-columns:1fr}.hero-design h1{font-size:12vw;margin:20px 0 8px}.hero-showcase{width:min(85%,350px);margin:20px auto 36px;min-height:300px}.hero-signature{margin-top:30px}.hero-discipline{font-size:10px;margin-top:14px}.hero-bottom{margin-top:0}.group-heading h3{font-size:10vw}.group-heading>span:first-child{font-size:30px}.hero-motion{font-size:11px}}
/* Catalogue chapters: equal image frames and captions in every category. */
.hero-composition{grid-template-columns:1fr}
.hero-design{min-height:min(920px,100svh);display:flex;flex-direction:column;justify-content:space-between}
.hero-signature{font-size:clamp(90px,17vw,260px);margin:25px 0 0}
.hero-design h1{max-width:900px;margin:12px 0 32px}
.hero-bottom{position:relative}.hero-bottom:before{content:none}
.ticker{padding:16px 0;font-size:16px}.ticker>div{animation:none}
.work-section{padding-top:clamp(70px,9vw,140px)}
.work-section>.ambient-layer .ambient-letter{top:0;right:-.1em;opacity:.018}
.work-group{padding:32px 0 60px;margin:0 0 60px;border-bottom:1px solid #21232130}
.work-group>.ambient-layer{background:linear-gradient(180deg,color-mix(in srgb,var(--group-color) 4%,transparent),transparent 450px)}
.work-group>.ambient-layer .ambient-letter{color:var(--group-color);top:120px;opacity:.025}
.group-heading{align-items:start;padding:22px 0 26px;margin-bottom:40px;overflow:visible;gap:24px}
.group-heading:before{height:2px}
.group-heading h3{font-size:clamp(36px,5vw,72px);max-width:78%;line-height:1.08}
.group-heading>span:first-child{font:400 15px/1.4 var(--mono);padding:8px 0;letter-spacing:0;opacity:1}
.group-heading>span:last-child{font-size:12px;padding-top:10px;align-self:start}
.group-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px 5%;align-items:start}
.group-gallery .work-card{display:block;width:100%;margin:0;grid-column:auto;position:relative;min-width:0}
.group-gallery .work-card:nth-child(even){margin-top:0}
.group-gallery .work-card .card-art{border-radius:0;padding:8px;border-color:color-mix(in srgb,var(--group-color) 50%,#f9f7f1);box-shadow:var(--frame-x,4px) var(--frame-y,5px) 0 color-mix(in srgb,var(--group-color) 22%,#f9f7f1);background:#f9f7f1}
.group-gallery .work-card .card-art:before{content:'';position:absolute;inset:3px;border:1px solid #21232115;pointer-events:none;z-index:2}
.group-gallery .work-card:nth-child(even) .card-art{padding:8px}
.group-gallery .work-card:is(:hover,:focus-visible) .card-art{box-shadow:calc(var(--frame-x,4px) * 2) calc(var(--frame-y,5px) * 2) 0 color-mix(in srgb,var(--group-color) 40%,#f9f7f1);border-color:var(--group-color)}
.group-gallery .work-card .card-art{aspect-ratio:1/1;box-sizing:border-box;min-height:0}
.group-gallery .card-art>.art{position:absolute;inset:8px;aspect-ratio:auto;width:calc(100% - 16px);height:calc(100% - 16px)}
.group-gallery .card-art--image .art-image{width:100%;height:100%;object-fit:cover!important;object-position:center}
.group-gallery .work-card:hover .card-art--image .art-image{transform:scale(1.012)}
html:not(.reduced) .group-gallery .work-card:hover,html:not(.reduced) .group-gallery .work-card:nth-child(even):hover{rotate:none}
.card-bottom{height:128px;box-sizing:border-box;margin-top:18px;gap:16px;padding:0 0 18px;border-color:color-mix(in srgb,var(--group-color) 28%,transparent)}
.card-bottom>div{min-width:0}
.card-bottom h4{font-size:21px;line-height:1.3}
.card-bottom h4,.card-bottom p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.card-bottom>span{flex-shrink:0}
.card-bottom>span{color:var(--group-color);line-height:1.5;font-size:11px}
.chapter-more{display:flex;align-items:center;justify-content:center;min-height:48px;min-width:210px;margin:48px auto 0;padding:14px 22px;border:1px solid var(--group-color);color:var(--group-color);background:transparent;font:12px var(--mono);letter-spacing:.04em;transition:background .2s,color .2s}
.chapter-more:hover{background:var(--group-color);color:white}
.work-group[aria-labelledby=group-real]{--frame-x:4px;--frame-y:5px}
.work-group[aria-labelledby=group-real] .card-art{background:#fff}
.card-status{display:inline-block;font:inherit}
.card-status--real{padding:5px 7px;background:#a64628;color:#fff;font-weight:600;letter-spacing:.035em}
.tool-stack{margin:38px 0 28px;padding:25px 0 5px;border-top:1px solid #21232138}
.tool-stack h3{margin:0 0 17px;font:12px var(--mono);letter-spacing:.08em;text-transform:uppercase}
.tool-list{display:grid;grid-template-columns:repeat(6,minmax(74px,1fr));gap:12px;max-width:760px}
.tool-list>span{min-width:0;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.tool-list img{width:54px;height:54px;object-fit:contain;padding:8px;background:#fff;border:1px solid #21232112;border-radius:13px;box-shadow:0 5px 16px #1717170a}
.tool-list small{font:11px/1.3 var(--mono);color:#45443e}
.about{background:#f0e2cb;background-image:linear-gradient(120deg,#f4e9d8,#edd6b6);grid-template-columns:1fr 2fr}
.about>div{min-width:0}
.about .process-note{padding:25px;border:1px solid #63330d40;margin-top:36px}
.contact-design{background:#2449ed}.contact-design:before{display:none}
.contact-title{font-size:clamp(54px,8.5vw,132px);max-width:12ch}
.project-dialog{border:1px solid #21232135;box-shadow:0 24px 100px #1115}
.dialog-top,.dialog-bottom{background:var(--paper);position:sticky;z-index:4}.dialog-top{top:0}.dialog-bottom{bottom:0}
.dialog-body aside{min-width:0}
#project-art.project-art--image{padding:clamp(12px,2vw,28px);background:#eeeae1}
.project-disclosure{line-height:1.6}
@media(max-width:900px){
 .hero-design{min-height:0}.hero-signature{font-size:20vw}.hero-design h1{font-size:clamp(48px,9vw,84px)}
 .group-gallery{grid-template-columns:1fr;gap:38px}
 .group-gallery .work-card:nth-child(even){margin-top:0}
 .group-gallery .work-card .card-art,.group-gallery .work-card:nth-child(even) .card-art{padding:6px}
 .group-gallery .card-art>.art{inset:6px;width:calc(100% - 12px);height:calc(100% - 12px)}
 .group-heading{gap:16px;margin-bottom:28px}
 .group-heading h3{max-width:calc(100% - 50px);font-size:clamp(32px,7vw,56px)}
 .work-group{padding:20px 0 40px;margin-bottom:30px}
 .about{grid-template-columns:1fr;gap:24px}
}
@media(max-width:600px){
 .hero-top{font-size:11px}.hero-design{padding-bottom:28px}.hero-signature{margin-top:34px}.hero-design h1{font-size:12vw}
 .hero-bottom{margin-top:22px}.hero-bottom p{max-width:27ch}
 .section-title h2{font-size:clamp(44px,11vw,62px)}.work-section{padding-top:65px}
 .card-bottom h4{font-size:18px}.card-bottom p{font-size:13px}.card-bottom>span{font-size:10px}
 .contact-title{font-size:15vw;letter-spacing:-.06em}.contact-bottom a{overflow-wrap:anywhere}
 .about .process-note{padding:20px}
}
@media(prefers-reduced-motion:reduce){.group-gallery .work-card:hover .art-image{transform:none!important}}
.work-group[aria-labelledby="group-covers"]{--frame-x:9px;--frame-y:5px}
.work-group[aria-labelledby="group-titles"]{--frame-x:4px;--frame-y:9px}
.work-group[aria-labelledby="group-logos"]{--frame-x:10px;--frame-y:7px}
@media(max-width:600px){.tool-list{grid-template-columns:repeat(3,minmax(74px,1fr));max-width:360px;gap:16px 10px}}

/* Compact catalogue grid and an accessible, continuous tools rail. */
.group-gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:34px 18px}
.group-gallery .work-card .card-art,.group-gallery .work-card:nth-child(even) .card-art{padding:6px}
.group-gallery .card-art>.art{inset:6px;width:calc(100% - 12px);height:calc(100% - 12px)}
.card-bottom{height:108px;margin-top:12px;gap:10px;padding-bottom:12px}
.card-bottom h4{font-size:clamp(16px,1.35vw,19px);line-height:1.25}
.card-bottom p{font-size:12px}
@media(min-width:1500px){.group-gallery{grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 16px}}
@media(max-width:1100px){.group-gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 16px}}
@media(max-width:900px){.group-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 14px}.card-bottom{height:104px}}
@media(max-width:600px){.group-gallery{grid-template-columns:1fr;gap:26px}.card-bottom{height:100px}}
.tool-list{display:block;position:relative;width:100%;max-width:min(760px,100%);overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.tool-list__track{display:flex;width:max-content;animation:tool-slide 34s linear infinite;will-change:transform}
.tool-list__set{display:flex;flex:none;align-items:flex-start;gap:clamp(18px,3vw,34px);padding:2px 18px 14px}
.tool-item{flex:0 0 74px;min-width:74px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.tool-icon{display:grid;place-items:center;width:54px;height:54px;overflow:hidden;background:#fff;border:1px solid #21232118;border-radius:13px;box-shadow:0 5px 16px #1717170a}
.tool-icon img{width:100%;height:100%;object-fit:contain;padding:5px}
.tool-icon--claude img{padding:8px}
.tool-icon--chatgpt{background:#050505;border-color:#050505}
.tool-icon--chatgpt img{object-fit:cover;padding:0}
.tool-item small{font:11px/1.3 var(--mono);color:#45443e;white-space:nowrap}
@keyframes tool-slide{to{transform:translateX(-50%)}}
html.reduced .tool-list__track,html.reduced-motion .tool-list__track{animation:none!important;transform:none!important}
@media(prefers-reduced-motion:reduce){.tool-list__track{animation:none!important;transform:none!important}}
html:not(.reduced):not(.reduced-motion) .about .skills span{transition:transform .32s cubic-bezier(.2,.75,.25,1),background-color .32s,color .32s}
html:not(.reduced):not(.reduced-motion) .about .skills span:hover{transform:translateY(-3px) rotate(-1deg);background:#fff9;color:#20211d}
html:not(.reduced):not(.reduced-motion) .contact-design .contact-title{transition:color .35s,letter-spacing .45s,transform .45s cubic-bezier(.2,.75,.25,1)}
html:not(.reduced):not(.reduced-motion) .contact-design .contact-title:hover{transform:translateX(7px);letter-spacing:-.055em}
@media(prefers-reduced-motion:reduce){.about .skills span,.contact-design .contact-title{transition:none!important;transform:none!important}}

/* Section numbers use a soft, moving light field instead of a colored badge. */
.group-heading:before{display:none}
.group-heading>span:first-child{position:relative;isolation:isolate;z-index:0;overflow:visible;color:var(--group-color);background:transparent}
.group-heading>span:first-child:before{content:"";position:absolute;z-index:-1;inset:-16px -22px;border-radius:50%;background:radial-gradient(ellipse at center,color-mix(in srgb,var(--group-color) 42%,white) 0%,color-mix(in srgb,var(--group-color) 18%,transparent) 40%,transparent 74%);filter:blur(12px);opacity:.38;transform:scale(.78);transform-origin:center;pointer-events:none;animation:chapter-number-glow 5.8s ease-in-out infinite alternate}
.work-group:nth-child(even) .group-heading>span:first-child:before{animation-delay:-2.9s}
@keyframes chapter-number-glow{0%{opacity:.22;transform:translate(-5px,2px) scale(.72)}100%{opacity:.62;transform:translate(6px,-3px) scale(1.12)}}
html.reduced .group-heading>span:first-child:before,html.reduced-motion .group-heading>span:first-child:before{animation:none!important;opacity:.25;transform:none}
@media(prefers-reduced-motion:reduce){.group-heading>span:first-child:before{animation:none!important;opacity:.25;transform:none}}

/* Mobile performance: preserve the composition while avoiding expensive scroll repaints. */
@media(max-width:900px),(pointer:coarse){
 .nav{background:#f4f0e7fa;-webkit-backdrop-filter:none;backdrop-filter:none}
 .project-dialog::backdrop{-webkit-backdrop-filter:none;backdrop-filter:none}
 .work-group{content-visibility:auto;contain-intrinsic-size:auto 1450px}
 .group-gallery .card-art{contain:layout paint style}
 .group-heading>span:first-child:before{animation:none;filter:none;opacity:.26;transform:scale(.9)}
 .has-motion .contact-design:before{animation:none}
 .tool-list__track{animation-duration:48s;will-change:transform}
 .work-card:hover,.work-card:hover .art-image{transform:none}
}
@media(min-width:380px) and (max-width:600px){
 .group-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 11px}
 .card-bottom{height:106px;gap:6px}
 .card-bottom h4{font-size:15px;line-height:1.22}
 .card-bottom p{font-size:11px;line-height:1.3}
 .card-bottom>span{font-size:9px}
 .card-status--real{padding:4px 5px}
}

/* Branded opening: one efficient image, one restrained light pass. */
.hero-signature{width:min(100%,1200px);margin:clamp(26px,5vw,62px) 0 8px;line-height:0;overflow:hidden;isolation:isolate}
.hero-signature img{width:100%;height:auto;filter:drop-shadow(0 18px 24px #1739bb18);transform-origin:50% 60%;animation:wordmark-breathe 7s ease-in-out 1.2s infinite alternate}
.hero-wordmark-sheen{position:absolute!important;inset:-25% auto -25% -28%;width:20%;height:auto!important;margin:0!important;background:linear-gradient(90deg,transparent,#fff9,transparent);transform:skewX(-18deg);mix-blend-mode:screen;animation:wordmark-sheen 5.8s ease-in-out 1.6s infinite}
@keyframes wordmark-breathe{to{transform:translateY(-4px) scale(1.006);filter:drop-shadow(0 23px 30px #1739bb2b)}}
@keyframes wordmark-sheen{0%,58%{left:-28%;opacity:0}68%{opacity:.85}92%,100%{left:112%;opacity:0}}

/* Lightweight CSS-3D color configurator: no WebGL and no permanent render loop. */
.color-lab{--lab-blue:#2449ed;display:grid;grid-template-columns:minmax(260px,.7fr) minmax(500px,1.3fr);gap:clamp(36px,6vw,100px);padding:clamp(70px,9vw,140px) var(--pad);background:#11130f;color:#f4f0e7;overflow:hidden}
.lab-copy{align-self:center}.lab-copy .eyebrow{color:#9fb0ff}.lab-copy h2{font:500 clamp(48px,6.2vw,96px)/.98 var(--sans);letter-spacing:-.065em;margin:24px 0 28px}.lab-copy h2 em{color:#90a2ff}.lab-copy p{max-width:48ch;font-size:18px;line-height:1.65;color:#d2d1c9}.lab-copy p a{text-decoration:underline;text-underline-offset:5px}.lab-note{display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:38px;padding-top:18px;border-top:1px solid #ffffff2d;font:11px/1.5 var(--mono);color:#aead9f}
.lab-console{min-width:0;border:1px solid #ffffff26;background:linear-gradient(145deg,#21241f,#0e100d);box-shadow:0 38px 80px #0007;contain:layout paint style}
.lab-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid #ffffff25}.lab-tabs button{border:0;border-right:1px solid #ffffff25;background:transparent;color:#8f918a;padding:16px;font:12px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.04em}.lab-tabs button:last-child{border-right:0}.lab-tabs button[aria-selected=true]{background:#f4f0e7;color:#171914}
.lab-stage{position:relative;min-height:clamp(480px,53vw,720px);overflow:hidden;display:grid;place-items:center;perspective:1150px;background:radial-gradient(circle at 50% 45%,#3d433949 0 1px,transparent 2px),linear-gradient(#161914,#12140f);background-size:30px 30px,auto;touch-action:pan-y}
.lab-axis{position:absolute;background:#ffffff10;pointer-events:none}.lab-axis--x{left:5%;right:5%;height:1px;top:50%}.lab-axis--y{top:5%;bottom:5%;width:1px;left:50%}
.lab-object{--lab-angle:0deg;--lab-tilt:0deg;--lab-color:transparent;--lab-mask:url("assets/fausti-jean-cutout.png");position:relative;z-index:2;width:min(70%,540px);height:82%;display:grid;place-items:center;transform-style:preserve-3d;transform:rotateX(var(--lab-tilt)) rotateY(var(--lab-angle));transition:transform .38s cubic-bezier(.2,.75,.25,1);will-change:transform}
.lab-object img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 25px 26px #0009)}
.lab-tint{position:absolute;z-index:2;inset:0;background:var(--lab-color);-webkit-mask:var(--lab-mask) center/contain no-repeat;mask:var(--lab-mask) center/contain no-repeat;mix-blend-mode:color;opacity:.78;pointer-events:none;transition:background-color .25s,opacity .25s}
.lab-shadow{position:absolute;z-index:0;bottom:7%;left:27%;right:27%;height:6%;border-radius:50%;background:#000b;filter:blur(18px);transform:rotateX(72deg)}
.lab-drag{position:absolute;right:17px;bottom:15px;font:9px/1 var(--mono);letter-spacing:.05em;color:#ffffff73}
.lab-controls{display:grid;grid-template-columns:1fr minmax(190px,.7fr);gap:24px;padding:20px;border-top:1px solid #ffffff25;align-items:end}.lab-label,.lab-angle>span{display:block;margin-bottom:11px;font:10px/1.4 var(--mono);letter-spacing:.05em;color:#aead9f}.lab-label b,.lab-angle b{color:#fff}.lab-swatches{display:flex;gap:10px;flex-wrap:wrap}.lab-swatches button{width:34px;height:34px;border-radius:50%;border:1px solid #ffffff44;background:var(--swatch);box-shadow:inset 0 0 0 3px #151713}.lab-swatches button.is-selected{outline:2px solid #f4f0e7;outline-offset:3px}.lab-angle input{width:100%;accent-color:#90a2ff}

@media(max-width:900px){
 .color-lab{grid-template-columns:1fr;padding-top:78px;padding-bottom:78px}
 .lab-copy p{font-size:17px}.lab-console{width:min(100%,680px);margin:auto}.lab-stage{min-height:min(680px,90vw)}
}
@media(max-width:600px){
 .hero-signature{margin-top:34px}.hero-signature img{animation:none;filter:drop-shadow(0 10px 15px #1739bb18)}.hero-wordmark-sheen{animation-duration:8s}
 .color-lab{gap:30px;padding-left:18px;padding-right:18px}.lab-copy h2{font-size:14vw}.lab-copy p{font-size:16px}.lab-note{margin-top:26px}
 .lab-stage{min-height:118vw;max-height:560px;background-size:36px 36px,auto}.lab-object{width:82%;height:84%;will-change:auto}.lab-shadow{left:19%;right:19%}
 .lab-controls{grid-template-columns:1fr;gap:20px}.lab-drag{display:none}.lab-tabs button{padding:14px 8px;font-size:10px}
}
@media(max-width:900px),(pointer:coarse){
 .work-group{content-visibility:visible;contain-intrinsic-size:none}
 .tool-list__track{will-change:auto;animation-duration:58s}
}
@media(prefers-reduced-motion:reduce){.hero-signature img,.hero-wordmark-sheen{animation:none!important}.lab-object{transition:none!important}}
.reduced .hero-signature img,.reduced .hero-wordmark-sheen,.reduced-motion .hero-signature img,.reduced-motion .hero-wordmark-sheen{animation:none!important}

/* V24 — brandmark hero and a full-surface product customizer. */
.hero-signature.hero-brandmark{position:relative;display:grid;place-items:center;width:clamp(220px,25vw,390px);aspect-ratio:1.28;margin:clamp(24px,4vw,48px) auto 12px;overflow:visible}
.hero-brandmark img{position:relative;z-index:2;width:88%;height:auto;filter:drop-shadow(0 22px 24px #1833a52e);animation:hero-mark-float 5.5s ease-in-out infinite alternate}
.hero-brandmark>span{position:absolute;display:block;margin:0;font-size:0;line-height:0;pointer-events:none}
.hero-logo-orbit{z-index:0;inset:4% -8%;border:1px solid #2449ed48;border-radius:50%;transform:rotate(-8deg);animation:hero-orbit 13s linear infinite}
.hero-logo-orbit:before,.hero-logo-orbit:after{content:'';position:absolute;border-radius:50%;background:var(--blue);box-shadow:0 0 18px #2449ed77}.hero-logo-orbit:before{width:7px;height:7px;left:10%;top:20%}.hero-logo-orbit:after{width:4px;height:4px;right:7%;bottom:22%}
.hero-logo-glint{z-index:3;width:28%;height:88%;left:-8%;top:5%;background:linear-gradient(90deg,transparent,#fff9,transparent);transform:skewX(-18deg);mix-blend-mode:screen;animation:hero-glint 5.5s ease-in-out 1.2s infinite}
@keyframes hero-mark-float{to{transform:translateY(-7px) rotate(.8deg);filter:drop-shadow(0 30px 30px #1833a542)}}
@keyframes hero-orbit{to{transform:rotate(352deg)}}
@keyframes hero-glint{0%,58%{left:-8%;opacity:0}70%{opacity:.9}94%,100%{left:82%;opacity:0}}

.color-lab{display:block;padding-top:clamp(80px,9vw,135px);padding-bottom:clamp(80px,9vw,135px)}
.lab-copy{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);column-gap:clamp(40px,8vw,130px);align-items:end}
.lab-copy .eyebrow,.lab-copy h2{grid-column:1}.lab-copy .eyebrow{align-self:start}.lab-copy h2{margin-bottom:0}.lab-copy>p,.lab-copy>.lab-note{grid-column:2}.lab-copy>p{grid-row:1/span 2;align-self:end;margin:0 0 68px}.lab-copy>.lab-note{grid-row:2;align-self:end;margin:0}
.lab-console{width:100%;margin-top:clamp(42px,6vw,80px);border-color:#ffffff38;background:#0d0f0c;box-shadow:0 44px 110px #0009}
.lab-tabs button{padding:18px 24px;letter-spacing:.08em;transition:background-color .22s,color .22s}.lab-tabs button[aria-selected=true]{background:#f5f2e9;color:#12140f}
.lab-stage{min-height:clamp(650px,67vw,860px);background:radial-gradient(circle at 50% 46%,#52594a5c 0 1px,transparent 1.5px),radial-gradient(ellipse at 50% 46%,#30372c 0%,#131611 48%,#090b08 78%);background-size:28px 28px,auto}
.lab-stage:before{content:'';position:absolute;inset:4%;border:1px solid #ffffff14;box-shadow:inset 0 0 100px #0006;pointer-events:none}
.lab-object{width:min(91%,720px);height:96%;transition:transform .38s cubic-bezier(.2,.75,.25,1),width .38s ease;transform:rotateX(var(--lab-tilt)) rotateY(var(--lab-angle)) translateZ(0)}
.lab-console.is-cargo .lab-object{width:min(96%,790px)}
.lab-object img{width:100%;height:100%;filter:drop-shadow(0 32px 34px #000c)}
.lab-tint{opacity:.72}
.lab-custom-patch{--patch-font:var(--serif);position:absolute;z-index:4;left:50%;top:31%;width:min(67%,440px);padding:clamp(10px,1.35vw,18px) clamp(15px,2vw,28px);transform:translate3d(-50%,0,46px);border:1px solid #ffffff61;background:linear-gradient(110deg,#090a08ef,#22251ff2);color:#f5f2e9;text-align:center;box-shadow:0 13px 25px #0007,inset 0 0 0 1px #000;pointer-events:none}
.lab-console.is-cargo .lab-custom-patch{top:29%;width:min(74%,500px)}
.lab-custom-patch b{display:block;overflow:hidden;text-overflow:ellipsis;font:600 clamp(21px,3.7vw,56px)/.95 var(--patch-font);letter-spacing:-.04em;text-transform:uppercase;white-space:nowrap}.lab-custom-patch small{display:block;margin-top:7px;font:8px/1 var(--mono);letter-spacing:.18em;color:#bfc3b8}
.lab-object.text-style-gothic .lab-custom-patch{--patch-font:'Fraunces',Georgia,serif}.lab-object.text-style-gothic .lab-custom-patch b{font-style:italic;font-weight:600;letter-spacing:-.02em}.lab-object.text-style-mono .lab-custom-patch{--patch-font:var(--mono)}.lab-object.text-style-mono .lab-custom-patch b{font-weight:500;letter-spacing:.06em}
.lab-depth{position:absolute;border:1px solid #ffffff12;pointer-events:none}.lab-depth--one{width:54%;aspect-ratio:1;border-radius:50%;transform:rotateX(68deg);bottom:2%}.lab-depth--two{width:40%;height:73%;border-radius:50%;top:13%;transform:rotateY(67deg)}
.lab-shadow{bottom:4%;left:25%;right:25%;height:5%;filter:blur(20px)}
.lab-readout{position:absolute;left:20px;bottom:18px;color:#ffffff55;font:9px/1.55 var(--mono);letter-spacing:.08em}.lab-drag{right:20px;bottom:20px;letter-spacing:.08em}
.lab-controls{grid-template-columns:1fr 1.15fr minmax(210px,.8fr);gap:0;padding:0;align-items:stretch}.lab-control{min-width:0;padding:22px 24px;border-right:1px solid #ffffff20}.lab-control:last-child{border-right:0}.lab-control--color{display:flex;flex-direction:column;justify-content:center}.lab-label,.lab-angle>span,.lab-control--text>label{display:block;margin:0 0 12px;font:10px/1.4 var(--mono);letter-spacing:.07em;color:#aead9f}.lab-swatches button{width:36px;height:36px}.lab-text-input{display:flex;align-items:center;border-bottom:1px solid #ffffff55}.lab-text-input input{min-width:0;width:100%;border:0;background:transparent;color:#fff;padding:5px 0 9px;font:500 20px/1.2 var(--sans);text-transform:uppercase;outline:0}.lab-text-input span{font:9px var(--mono);color:#85877f;white-space:nowrap}.lab-typefaces{display:flex;gap:6px;margin-top:12px}.lab-typefaces button{border:1px solid #ffffff2d;background:transparent;color:#92958d;padding:7px 9px;font:8px/1 var(--mono);letter-spacing:.05em}.lab-typefaces button.is-selected{background:#f5f2e9;color:#141612;border-color:#f5f2e9}.lab-angle{display:flex;flex-direction:column;justify-content:center}.lab-angle small{margin-top:8px;color:#787b73;font:9px/1.4 var(--mono)}

@media(max-width:900px){
 .lab-copy{grid-template-columns:1fr;gap:22px}.lab-copy .eyebrow,.lab-copy h2,.lab-copy>p,.lab-copy>.lab-note{grid-column:1;grid-row:auto}.lab-copy>p{margin:0}.lab-console{margin-top:42px}
 .lab-stage{min-height:min(118vw,760px)}.lab-object{width:96%;height:98%}.lab-console.is-cargo .lab-object{width:100%}
 .lab-controls{grid-template-columns:1fr 1fr}.lab-control--text{grid-column:1/-1;grid-row:1}.lab-control--color{grid-row:2}.lab-angle{grid-row:2}.lab-control--text{border-bottom:1px solid #ffffff20}.lab-control--color{border-right:1px solid #ffffff20}.lab-angle{border-right:0}
}
@media(max-width:600px){
 .hero-signature.hero-brandmark{width:clamp(180px,58vw,245px);margin:22px auto 4px}.hero-brandmark img{animation:none;filter:drop-shadow(0 15px 20px #1833a52c)}.hero-logo-orbit{animation-duration:18s}.hero-logo-glint{animation-duration:8s}
 .lab-stage{min-height:132vw;max-height:610px}.lab-object{width:112%;height:101%}.lab-console.is-cargo .lab-object{width:118%}.lab-custom-patch{top:30%;width:66%;padding:9px 13px}.lab-console.is-cargo .lab-custom-patch{top:29%;width:72%}.lab-custom-patch b{font-size:clamp(21px,8vw,34px)}
 .lab-controls{grid-template-columns:1fr}.lab-control--text,.lab-control--color,.lab-angle{grid-column:1;grid-row:auto;border-right:0;border-bottom:1px solid #ffffff20}.lab-angle{border-bottom:0}.lab-control{padding:20px}.lab-readout{left:14px;bottom:13px}.lab-tabs button{padding:15px 8px}
}
@media(prefers-reduced-motion:reduce){.hero-brandmark img,.hero-logo-orbit,.hero-logo-glint{animation:none!important}}
.reduced .hero-brandmark img,.reduced .hero-logo-orbit,.reduced .hero-logo-glint,.reduced-motion .hero-brandmark img,.reduced-motion .hero-logo-orbit,.reduced-motion .hero-logo-glint{animation:none!important}
.nav nav a{padding:10px 6px;margin:-10px -6px}

/* V26 — editorial statements framing the animated brandmark. */
.hero-side-note{position:absolute;z-index:4;display:grid;gap:7px;width:clamp(180px,18vw,260px);margin:0;color:var(--ink);pointer-events:none;animation:hero-note-drift 5.5s ease-in-out infinite alternate}
.hero-side-note:before{content:'';display:block;width:72px;height:1px;margin-bottom:5px;background:var(--blue);transform-origin:left;animation:hero-note-line 4.6s ease-in-out infinite alternate}
.hero-side-note>span,.hero-side-note>small{font:500 10px/1.45 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.hero-side-note>span{color:var(--blue)}
.hero-side-note>strong{font:500 clamp(20px,2vw,29px)/1.08 var(--serif);letter-spacing:-.035em}
.hero-side-note>small{color:#565850;font-size:9px}
.hero-side-note--left{right:calc(100% + clamp(34px,5vw,92px));top:20%;justify-items:end;text-align:right;animation-delay:-2.2s}
.hero-side-note--left:before{transform-origin:right}
.hero-side-note--right{left:calc(100% + clamp(34px,5vw,92px));top:54%;justify-items:start;text-align:left}
@keyframes hero-note-drift{to{transform:translateY(-5px)}}
@keyframes hero-note-line{from{transform:scaleX(.45);opacity:.45}to{transform:scaleX(1);opacity:1}}
@media(max-width:950px){.hero-side-note{display:none}}
@media(prefers-reduced-motion:reduce){.hero-side-note,.hero-side-note:before{animation:none!important}}
.reduced .hero-side-note,.reduced .hero-side-note:before,.reduced-motion .hero-side-note,.reduced-motion .hero-side-note:before{animation:none!important}

/* Keep continuous decorative motion active only while its section is visible. */
.ticker>div,.tool-list__track,.hero-brandmark img,.hero-logo-orbit,.hero-logo-glint,.hero-side-note,.hero-side-note:before{animation-play-state:paused}
.ticker.loop-visible>div,.tool-list.loop-visible .tool-list__track,.hero-brandmark.loop-visible img,.hero-brandmark.loop-visible .hero-logo-orbit,.hero-brandmark.loop-visible .hero-logo-glint,.hero-brandmark.loop-visible .hero-side-note,.hero-brandmark.loop-visible .hero-side-note:before{animation-play-state:running}
.tool-list:not(.loop-visible) .tool-list__track{will-change:auto}
.page-sleep .ticker>div,.page-sleep .tool-list__track,.page-sleep .hero-brandmark img,.page-sleep .hero-logo-orbit,.page-sleep .hero-logo-glint,.page-sleep .hero-side-note,.page-sleep .hero-side-note:before{animation-play-state:paused!important}

/* V25 — restored portfolio flow, evolving archive note and safe-area footer. */
.about .portfolio-update{margin-top:20px;padding:16px 18px;border-left:3px solid var(--blue);background:#f4f0e766;font-size:16px}
.portfolio-update strong{display:block;margin-bottom:5px;font:500 11px/1.4 var(--mono);letter-spacing:.08em;color:var(--blue)}
body>footer{align-items:center;padding-bottom:max(26px,calc(26px + env(safe-area-inset-bottom)))}
.footer-mark{width:42px;height:30px;object-fit:contain;filter:brightness(0) saturate(100%) invert(25%) sepia(100%) saturate(3565%) hue-rotate(226deg) brightness(92%) contrast(103%)}
@media(max-width:600px){body>footer{display:grid;grid-template-columns:1fr auto;row-gap:18px;padding-top:24px}.footer-mark{grid-row:2;grid-column:1/-1;justify-self:center;width:46px;height:32px}body>footer a{justify-self:end}}
