.ja-head{width:100%;height:26vh;}#jaHead,#jaHead2,#jaHead3{transform:translateY(-4vh);}#work::after,#work2::after,#work3::after{background:transparent !important;}#work{position:relative;z-index:0;margin-top:-50px !important;padding-top:0 !important;background:#C7F23C !important;}@media (max-width:921px){#work{background:#C7F23C !important;}}#work2{position:relative;z-index:0;margin-top:0 !important;padding-top:0 !important;background:#0A0A0A !important;}#work3{position:relative;z-index:0;margin-top:0 !important;padding-top:0 !important;background:#3b07ed !important;}.ja-section.ja-work-section{background:transparent !important;padding:0!important;overflow:hidden!important;}
.ja-work-section .ja-work-stack{background:transparent!important;width:100%!important;max-width:100%!important;margin:0!important;padding:18px 0 38px!important;display:block!important;}
.ja-work-section .ja-cyl{width:100%;height:60vh;min-height:380px;cursor:grab;touch-action:pan-y;margin-top:-4vh;}
.ja-work-section .ja-cyl.is-drag{cursor:grabbing;}
.ja-work-section .ja-cyl canvas{display:block;}.ja-clients{padding-bottom:100px !important;background:#0A0A0A !important;}
#masthead{transition:opacity 0.18s linear,transform 0.18s linear,filter 0.18s linear;will-change:opacity,transform,filter;}#jaSubs,#jaSubs2,#jaSubs3{animation:jaSubsFadeIn 0.7s ease-out forwards;will-change:opacity,filter;}@keyframes jaSubsFadeIn{from{opacity:0;filter:blur(6px);}to{opacity:1;filter:blur(0);}}@media (max-width:921px){.ja-head{height:18vh!important;min-height:140px!important;}#jaHead,#jaHead2,#jaHead3{transform:none!important;}.ja-work-section .ja-cyl{height:70vh!important;min-height:540px!important;margin-top:0!important;margin-bottom:0!important;touch-action:pan-y!important;-webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 14%,black 86%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0%,black 14%,black 86%,transparent 100%);position:relative!important;}.ja-work-section .ja-cyl-hot{position:absolute!important;left:25%!important;top:30%!important;width:50%!important;height:40%!important;touch-action:none!important;cursor:grab!important;z-index:2!important;}.ja-work-section .ja-cyl-hot.is-drag{cursor:grabbing!important;}.ja-work-section .ja-work-stack{padding:60px 0 60px!important;}#jaHead{overflow:hidden;will-change:filter;}#jaHead canvas{transition:filter 0s linear;will-change:filter;}#work2,#work3{display:none !important;}}
/* === ABOUT / "What I make" (lia-abt) — minimal 3-col, dark bg, lime + grey, middle reserved for future 3D face === */
.lia-abt{background:#0A0A0A;padding:clamp(96px,15vh,180px) 5vw;width:100%!important;max-width:100%!important;}
.lia-abt-inner{max-width:1560px;margin:0 auto;display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:clamp(32px,5vw,90px);align-items:start;}
.lia-abt-label{font-family:"JetBrains Mono","Courier New",monospace !important;font-size:11.5px;letter-spacing:.26em;text-transform:uppercase;color:#C7F23C;margin:0;}
.lia-abt-rule{display:block;width:30px;height:1px;background:#333;margin:22px 0 42px;}
.lia-abt-lead{font-family:"Bricolage Grotesque",Inter,-apple-system,sans-serif;font-weight:600;font-size:clamp(25px,2.7vw,40px);line-height:1.12;letter-spacing:-0.015em;color:#e4e4e4;margin:0 0 30px;}
.lia-abt-body{font-family:"Bricolage Grotesque",Inter,-apple-system,sans-serif;font-weight:400;font-size:clamp(15px,1.05vw,17px);line-height:1.68;color:#8c8c8c;margin:0;max-width:34ch;}
.lia-abt-hi{color:#C7F23C;}
.lia-abt-mid{min-height:1px;}
@media (max-width:921px){
  .lia-abt{padding:84px 22px;}
  .lia-abt-inner{grid-template-columns:1fr;gap:40px;}
  .lia-abt-lead{font-size:clamp(26px,8vw,40px);}
  .lia-abt-body{max-width:none;}
}

/* === CTA headline: center the max-width:800px block on desktop (was left-pinned). No-op on mobile (block fills width). === */
.ja-cta .ja-section-h{margin-left:auto !important;margin-right:auto !important;}

/* === 360 face turntable in the about middle column (canvas injected by home-face.js) === */
.lia-abt-mid{align-self:center;}
.lia-face{display:block;width:100%;max-width:360px;height:auto;margin:0 auto;transform-origin:center;will-change:transform;}
/* big screens (27"): fill the width (grid was shrink-wrapping), bigger type + head */
@media (min-width:1700px){
  .lia-abt-inner{width:100%;max-width:2100px;}
  .lia-abt-lead{font-size:48px;}
  .lia-abt-body{font-size:19px;max-width:38ch;}
  .lia-face{max-width:485px;}
}
/* symmetric gaps: right column hugs the right edge (mirrors the left), so the head is centred with equal space on each side */
@media (min-width:922px){
  .lia-abt-inner>.lia-abt-col:last-child{text-align:right;}
  .lia-abt-inner>.lia-abt-col:last-child .lia-abt-body{margin-left:auto;}
  .lia-abt-inner>.lia-abt-col:last-child .lia-abt-rule{margin-left:auto;}
}
/* phone: head sits between the two stacked paragraphs, a touch smaller */
@media (max-width:921px){ .lia-face{max-width:240px;margin:6px auto 4px;} }

/* === Tablet (922-1200px): shrink the 3 carousels (they're too big here). Desktop >1200 unchanged; <=921 uses the mobile vertical cylinder. === */
@media (min-width:922px) and (max-width:1400px){
  .ja-work-section .ja-cyl{ height:42vh !important; min-height:280px !important; max-height:430px !important; }
}
