:root{--ink:#0c0b0b;--pink:#ff79aa;--soft:#fff4f1;--paper:#fffaf5;--yellow:#ffe777}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--soft);font-family:Arial,Helvetica,sans-serif}.site-header{position:absolute;z-index:20;top:0;left:50%;width:min(100%,1440px);height:92px;padding:24px clamp(32px,4vw,64px);display:flex;align-items:flex-start;justify-content:space-between;transform:translateX(-50%)}.brand{position:relative;color:var(--ink);text-decoration:none;font:47px/.8 Georgia,serif}.brand em{position:absolute;left:30px;top:28px;color:var(--pink);font:400 21px "Comic Sans MS",cursive;transform:rotate(-9deg)}nav{display:flex;gap:clamp(30px,4vw,55px);padding-top:8px}nav a{position:relative;color:var(--ink);text-decoration:none;font:700 20px "Comic Sans MS",cursive}nav a.active:after{content:"";position:absolute;left:-8px;right:-8px;bottom:-7px;height:4px;background:var(--pink);transform:rotate(-2deg)}.menu-button{display:none}.hero{width:min(100%,1440px);height:clamp(700px,57.3vw,825px);max-height:825px;min-height:700px;margin:0 auto;padding:126px clamp(32px,4vw,64px) 34px;display:grid;grid-template-columns:minmax(0,42%) minmax(0,58%);align-items:stretch;overflow:hidden;background:radial-gradient(circle at 12% 17%,#fff 0,transparent 30%),linear-gradient(110deg,#fff8f4,#ffefef)}.hero-copy{position:relative;z-index:12;min-width:0;padding-top:76px}.hello{margin:0 0 10px;color:var(--pink);font:25px "Comic Sans MS",cursive}.hero h1{margin:0;font:clamp(82px,8vw,124px)/.82 Georgia,serif;letter-spacing:-7px}.hero h1 span{font-size:.7em}.role{display:inline-block;margin:12px 0 0;padding-bottom:7px;border-bottom:4px solid var(--pink);font:700 clamp(16px,1.4vw,21px) "Comic Sans MS",cursive;white-space:nowrap}.intro{margin:22px 0 28px;font-size:16px;line-height:1.6}.cta{display:inline-flex;align-items:center;gap:24px;padding:13px 28px;color:#fff;background:var(--ink);text-decoration:none;font:18px "Comic Sans MS",cursive;clip-path:polygon(4% 8%,96% 0,100% 27%,96% 90%,5% 100%,0 72%)}.cta span{color:var(--pink);font-size:28px}.hero-art{position:relative;min-width:0;height:100%}.pink-wash{position:absolute;z-index:1;inset:32px 1% 5px 9%;background:rgba(255,139,170,.25);clip-path:polygon(12% 0,97% 13%,94% 95%,0 100%,6% 21%);transform:rotate(2deg)}.paper-grid{position:absolute;z-index:1;top:5px;right:3%;width:70%;height:74%;opacity:.25;background-image:linear-gradient(#79aeb0 1px,transparent 1px),linear-gradient(90deg,#79aeb0 1px,transparent 1px);background-size:24px 24px;transform:rotate(8deg)}.impact-note{position:absolute;z-index:8;left:-9%;top:64px;width:145px;height:145px;padding-top:34px;border-radius:50%;background:#fa98bd;text-align:center;font:700 20px/1.08 "Comic Sans MS",cursive;transform:rotate(-3deg)}.impact-note span{position:absolute;top:-11px;left:57px;width:45px;height:22px;background:#080808;transform:rotate(-22deg)}.impact-note b{display:block}.avatar{position:absolute;z-index:6;left:50%;top:36px;width:min(74%,575px);height:calc(100% - 40px);transform:translateX(-46%)}.avatar img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}.sticky-note{position:absolute;z-index:9;right:0;top:112px;width:165px;padding:33px 21px 22px;background:var(--yellow);box-shadow:0 10px 25px #aa846533;transform:rotate(7deg);font:700 17px/1.48 "Comic Sans MS",cursive}.clip{position:absolute;top:-25px;left:70px;width:31px;height:37px;border:3px solid;border-radius:15px}.doodle{position:absolute;z-index:7;right:2%;top:350px;font:49px "Comic Sans MS"}.curious-note{position:absolute;z-index:9;right:5%;bottom:0;margin:0;padding:13px 27px;background:#fffdf7;box-shadow:0 4px 18px #a9836b18;transform:rotate(1deg);font:22px/1.32 "Comic Sans MS",cursive}.cloud{position:absolute;z-index:4;color:#fff;font-size:58px;letter-spacing:-26px;text-shadow:0 12px 16px #7e767044}.cloud-one{top:5px;left:12%}.cloud-two{bottom:38px;left:-2%}.featured{width:min(100%,1440px);margin:0 auto;padding:24px clamp(32px,4vw,64px) 30px;background:var(--paper)}.featured h2{display:inline-block;margin:0 0 14px;padding:7px 20px;color:#fff;background:var(--ink);clip-path:polygon(3% 5%,96% 0,100% 79%,5% 100%,0 42%);font:16px "Comic Sans MS",cursive}.areas{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding-left:11%}.areas article{min-width:0;min-height:235px;margin-right:30px;padding:5px 28px 8px 0;border-right:1px solid #e9ded5}.areas article:last-child{margin-right:0;border-right:0}.number{display:flex;align-items:center;gap:12px;color:var(--pink);font:50px Georgia,serif}.number span{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:#ffc6d6;color:#111;box-shadow:0 4px 12px #dca9b2;font:700 18px Arial}.areas h3{margin:12px 0;font:700 19px Georgia,serif}.areas p{max-width:250px;margin:0;font-size:14px;line-height:1.5}.areas a{display:block;margin-top:7px;color:var(--pink);text-decoration:none;font-size:40px}.about-placeholder{min-height:160px;display:grid;place-items:center;padding:40px;background:#111;color:#fff;text-align:center;font:24px Georgia,serif}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (min-width:768px) and (max-width:1023px){.site-header{padding-inline:30px}nav{gap:24px}.hero{height:760px;min-height:760px;padding-inline:30px;grid-template-columns:minmax(0,44%) minmax(0,56%)}.hero-copy{padding-top:78px}.hero h1{font-size:84px}.role{white-space:normal;font-size:16px}.intro br{display:none}.impact-note{left:-7%;width:125px;height:125px;padding-top:30px;font-size:17px}.avatar{width:88%;transform:translateX(-48%)}.sticky-note{width:135px;right:-8px;font-size:14px}.doodle{font-size:40px}.areas{grid-template-columns:repeat(2,minmax(0,1fr));padding-left:0}.areas article:nth-child(2){border-right:0}}
@media (max-width:767px){.site-header{height:80px;padding:22px}.brand{font-size:38px}.brand em{top:23px;font-size:17px}.menu-button{display:block;padding:7px 11px;border:2px solid;background:transparent;font-weight:700}.site-header nav{display:none;position:absolute;top:65px;right:20px;flex-direction:column;gap:15px;padding:18px;background:#fff9f6;box-shadow:0 9px 22px #66443322}.site-header nav.open{display:flex}.hero{height:auto;min-height:0;padding:105px 22px 28px;grid-template-columns:1fr}.hero-copy{padding-top:10px}.hero h1{font-size:78px;letter-spacing:-5px}.role{white-space:normal;font-size:16px}.intro br{display:none}.hero-art{height:520px;margin-top:15px}.avatar{top:20px;width:min(88%,500px);height:490px;transform:translateX(-50%)}.impact-note{left:1%;top:30px;width:118px;height:118px;padding-top:28px;font-size:16px}.sticky-note{top:90px;right:0;width:132px;font-size:13px}.doodle{top:280px;font-size:36px}.curious-note{right:3%;bottom:2px;font-size:17px}.areas{grid-template-columns:1fr;padding-left:0}.areas article{margin:0;border-right:0;border-bottom:1px solid #e9ded5}.featured{padding:25px 22px}}

/* Visual-target corrections: keep the editorial collage open and layered. */
body{overflow-x:clip}
.site-header,.hero,.featured{width:min(100%,1500px)}
.hero{position:relative;overflow:visible}
.hero-art{overflow:visible}
.avatar{z-index:3;top:26px;width:min(72%,570px);height:calc(100% - 32px);transform:translateX(-45%)}
.avatar img{object-fit:contain}
.pink-wash,.paper-grid{z-index:1}
.impact-note,.sticky-note,.doodle,.curious-note{z-index:6}
.cloud{--cloud-x:0px;--cloud-y:0px;--cloud-scale:1;display:block;width:auto;height:auto;background:none;border:0;filter:drop-shadow(0 12px 12px rgba(77,70,67,.25));object-fit:contain;transform:translate3d(var(--cloud-x),var(--cloud-y),0) scale(var(--cloud-scale))}
.cloud-one{z-index:2;top:36px;left:11%;width:168px}
.cloud-two{z-index:4;bottom:28px;left:-3%;width:155px}
.cloud-three{z-index:4;right:-2%;bottom:112px;width:185px}

@media (min-width:1200px){
  .hero{height:780px;min-height:700px;max-height:780px;grid-template-columns:minmax(0,42%) minmax(0,58%)}
  .hero-copy{padding-top:70px}
  .featured .areas{grid-template-columns:repeat(4,minmax(0,1fr))}
}

@media (min-width:768px) and (max-width:1199px){
  .hero{grid-template-columns:minmax(0,43%) minmax(0,57%);overflow:visible}
  .hero-art{overflow:visible}
  .avatar{width:84%;transform:translateX(-47%)}
}

@media (max-width:767px){
  .hero{overflow:hidden}
  .hero-art{overflow:visible}
  .avatar{top:18px;width:min(82%,470px);height:470px;transform:translateX(-50%)}
  .areas{grid-template-columns:repeat(2,minmax(0,1fr))}
  .areas article:nth-child(odd){border-right:1px solid #e9ded5}
  .cloud-one{left:7%;top:25px}
  .cloud-two{left:-7%;bottom:24px}
  .cloud-three{right:-6%;bottom:105px}
}

/* HERO RIGHT COLLAGE calibration — desktop visual target 1440 × 900. */
@media (min-width:1200px){
  .hero-art{
    position:absolute;
    z-index:2;
    left:50%;
    top:126px;
    width:720px;
    height:650px;
    margin-top:-34px;
    overflow:visible;
    transform:translateX(-50%);
    perspective:1000px;
  }
  .pink-wash{
    z-index:1;
    inset:auto;
    left:92px;
    top:76px;
    width:585px;
    height:555px;
    transform:rotate(1.5deg);
  }
  .paper-grid{
    z-index:2;
    top:32px;
    right:18px;
    width:545px;
    height:548px;
    transform:rotate(7deg);
  }
  .paper-grid:after{
    content:"";
    position:absolute;
    top:-13px;
    left:36px;
    width:395px;
    height:27px;
    background:rgba(255,153,181,.72);
    transform:rotate(3deg);
  }
  .cloud{position:absolute}
  .cloud-background{z-index:3}
  .cloud-midground{z-index:5}
  .cloud-foreground{z-index:6}
  .cloud-one{
    top:42px;
    left:87px;
    --cloud-scale:.92;
  }
  .cloud-two{
    left:48px;
    bottom:35px;
    --cloud-scale:.78;
  }
  .cloud-three{
    right:-14px;
    bottom:146px;
    --cloud-scale:.96;
  }
  .avatar{
    z-index:4;
    left:50%;
    top:auto;
    bottom:9px;
    width:540px;
    height:641px;
    transform:translateX(-50%);
    overflow:visible;
  }
  .avatar img{
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center bottom;
  }
  .impact-note{
    z-index:6;
    left:-54px;
    top:84px;
    width:148px;
    height:148px;
  }
  .sticky-note{
    z-index:6;
    top:96px;
    right:-17px;
    width:165px;
  }
  .doodle{
    z-index:6;
    top:323px;
    right:-8px;
  }
  .curious-note{
    z-index:6;
    right:27px;
    bottom:-17px;
  }
}

/* Confirmed-layout interactions: visual values above remain the static baseline. */
.avatar img{
  will-change:transform;
  transform:translate3d(0,0,0) rotateX(0deg) rotateY(0deg);
  transform-style:preserve-3d;
  transform-origin:center 52%;
}
.cloud{
  will-change:transform;
}
.sticky-note,.impact-note,.cta,.cta span{
  transition:transform 300ms ease-out;
}
.cta span{display:inline-block}
@media (hover:hover) and (pointer:fine){
  .sticky-note:hover{transform:translateY(-6px) rotate(9deg) scale(1.05)}
  .impact-note:hover{transform:translateY(-6px) rotate(-5deg) scale(1.06)}
  .cta:hover{transform:translateX(4px)}
  .cta:hover span{transform:translateX(8px)}
}
@media (prefers-reduced-motion:reduce){
  .avatar img{transform:none!important}
  .cloud{--cloud-x:0px!important;--cloud-y:0px!important}
  .sticky-note,.impact-note,.cta,.cta span{transition:none!important}
}

/* Centered editorial Homepage Hero. */
.hero.hero-centered{
  position:relative;
  display:block;
  width:min(100%,1500px);
  height:100vh;
  height:100svh;
  min-height:700px;
  max-height:none;
  margin:0 auto;
  padding:0;
  overflow:hidden;
  isolation:isolate;
  background:radial-gradient(circle at 50% 42%,#fff 0,rgba(255,255,255,.5) 30%,transparent 58%),linear-gradient(110deg,#fff8f4,#ffefef);
}
.hero-name{
  position:absolute;
  z-index:1;
  inset:0;
  display:grid;
  place-items:center;
  pointer-events:none;
}
.hero-name h1{
  position:relative;
  width:100%;
  height:100%;
  margin:0;
  color:var(--ink);
  font:clamp(116px,15.7vw,236px)/.82 Georgia,serif;
  letter-spacing:clamp(-13px,-.65vw,-7px);
  white-space:nowrap;
}
.hero-name h1>span{
  position:absolute;
  top:50%;
  display:block;
  font-size:1em;
}
.hero-name-left{left:clamp(16px,2vw,30px);transform:translateY(-50%) scaleX(.74);transform-origin:left center}
.hero-name-right{right:clamp(16px,2vw,30px);transform:translateY(-50%) scaleX(.74);transform-origin:right center}
.hero-name-right b{color:var(--pink);font-size:.72em;font-weight:inherit}
.hero.hero-centered .hero-art{
  position:absolute;
  z-index:2;
  left:50%;
  top:50%;
  width:min(720px,58vw);
  height:min(720px,80vh);
  margin:0;
  overflow:visible;
  transform:translate(-50%,-47%);
  perspective:1000px;
  pointer-events:none;
}
.hero.hero-centered .avatar{
  position:absolute;
  z-index:2;
  left:50%;
  top:50%;
  bottom:auto;
  width:min(442px,35vw);
  height:100%;
  overflow:visible;
  transform:translate(-50%,-50%);
}
.hero.hero-centered .avatar img{width:100%;height:100%;object-fit:contain;object-position:center}
.hero.hero-centered .cloud-one{
  z-index:1;
  top:3%;
  left:23%;
  width:20%;
  --cloud-scale:.92;
}
.hero.hero-centered .cloud-two{
  z-index:3;
  left:10%;
  bottom:0;
  width:21%;
  --cloud-scale:.86;
}
.hero.hero-centered .cloud-three{
  z-index:4;
  right:9%;
  top:12%;
  bottom:auto;
  width:23%;
  --cloud-scale:.96;
}
.hero-role,.hero-scroll{
  position:absolute;
  z-index:7;
  bottom:clamp(28px,4vw,58px);
  margin:0;
  color:var(--ink);
  font:700 clamp(14px,1.35vw,19px) "Comic Sans MS",cursive;
}
.hero-role{left:clamp(24px,5vw,76px)}
.hero-scroll{right:clamp(24px,5vw,76px);text-decoration:none}
.hero-scroll span{display:inline-block;margin-left:8px;color:var(--pink);font-size:1.25em;transition:transform 300ms ease-out}
@media (hover:hover) and (pointer:fine){.hero-scroll:hover span{transform:translateY(4px)}}

@media (min-width:768px) and (max-width:1199px){
  .hero.hero-centered{min-height:680px}
  .hero-name h1{font-size:15vw}
  .hero.hero-centered .hero-art{width:min(650px,72vw);height:min(650px,72vh)}
  .hero.hero-centered .avatar{width:min(410px,44vw)}
}

@media (max-width:767px){
  .hero.hero-centered{height:100svh;min-height:650px;padding:0;overflow:hidden}
  .hero-name{align-items:center}
  .hero-name h1{max-width:none;font-size:24vw;line-height:.78;letter-spacing:-6px;white-space:nowrap;text-align:left}
  .hero-name h1>span{top:auto;transform:scaleX(.82)}
  .hero-name-left{left:16px;top:31%!important;transform-origin:left center!important}
  .hero-name-right{right:16px;bottom:27%;transform-origin:right center!important}
  .hero.hero-centered .hero-art{left:50%;top:48%;width:100vw;height:62vh;min-height:420px;margin:0;transform:translate(-50%,-50%)}
  .hero.hero-centered .avatar{top:50%;width:min(72vw,350px);height:100%;transform:translate(-50%,-50%)}
  .hero.hero-centered .cloud-one{top:3%;left:16%;width:22%}
  .hero.hero-centered .cloud-two{left:3%;bottom:4%;width:24%}
  .hero.hero-centered .cloud-three{right:2%;top:10%;bottom:auto;width:26%}
  .hero-role,.hero-scroll{bottom:24px;font-size:12px}
  .hero-role{left:20px;max-width:58%;line-height:1.45}
  .hero-scroll{right:20px;text-align:right}
}

@media (prefers-reduced-motion:reduce){.hero-scroll span{transition:none}}

/* Avatar emotion switch: one calibrated face at a time inside a stable hit area. */
.hero.hero-centered .avatar{
  pointer-events:auto;
  cursor:default;
}
.hero.hero-centered .avatar img{
  position:absolute;
  pointer-events:none;
  will-change:transform;
}
.hero.hero-centered .avatar img.avatar-face{
  z-index:2;
  left:50%;
  top:50%;
  width:140%;
  height:140%;
  object-fit:contain;
  transform:translate(calc(-50% + var(--face-x,0%)),calc(-50% + var(--face-y,0%))) rotate(var(--face-rotate,0deg)) scale(var(--face-scale,1));
  transform-origin:center;
}
.hero.hero-centered .avatar-confetti{
  z-index:1;
  position:absolute;
  inset:-22% -45%;
  opacity:0;
  pointer-events:none;
  transform:scale(.88);
  transition:opacity 260ms ease-out,transform 320ms cubic-bezier(.2,.82,.24,1.08);
}
.confetti-piece{position:absolute;display:block;color:#ffd31a;filter:drop-shadow(0 3px 3px rgba(255,121,170,.18));font:700 42px/1 Georgia,serif}
.confetti-piece:not(:empty){text-shadow:0 0 0 #ffca16}
.confetti-piece:empty{width:18px;height:58px;border-radius:12px;background:linear-gradient(145deg,#ff82b7,#ff2d91);box-shadow:inset 3px 2px 5px rgba(255,255,255,.55)}
.confetti-a{left:10%;top:8%;transform:rotate(-12deg)}
.confetti-b{left:3%;top:38%;transform:rotate(-48deg)}
.confetti-c{left:12%;bottom:8%;font-size:34px;transform:rotate(14deg)}
.confetti-d{left:10%;bottom:0;transform:rotate(58deg)}
.confetti-e{right:9%;top:14%;color:#ff4fa0;font-size:25px}
.confetti-f{right:2%;top:42%;height:64px!important;background:linear-gradient(145deg,#ffd928,#ffb700)!important;transform:rotate(52deg)}
.confetti-g{right:12%;bottom:8%;font-size:40px;transform:rotate(-8deg)}
.confetti-h{right:23%;bottom:0;height:50px!important;transform:rotate(-54deg)}
.hero.hero-centered .avatar.is-active:not(.expression-has-effects) .avatar-confetti{opacity:1;transform:scale(1)}
@media (prefers-reduced-motion:reduce){
  .hero.hero-centered .avatar,.hero.hero-centered .avatar img{transition:none}
}

/* Selected Work */
.work-section{width:min(100%,1500px);margin:0 auto;padding:110px clamp(32px,5vw,76px) 130px;background:linear-gradient(180deg,#fffaf5 0,#fff2f1 52%,#fffaf5 100%)}
.work-header{position:relative;max-width:720px;margin-bottom:105px}
.work-header:after{content:"curious minds, commercial impact";position:absolute;right:-370px;bottom:16px;color:var(--pink);font:20px "Comic Sans MS",cursive;transform:rotate(-3deg)}
.work-kicker{margin:0;color:var(--pink);font:700 24px "Comic Sans MS",cursive}
.work-header h2{margin:0;font:clamp(86px,9vw,138px)/.88 Georgia,serif;letter-spacing:-7px}
.work-header h2 span{color:var(--pink);font-size:.55em;vertical-align:top}
.work-header>p:last-child{margin:25px 0 0;font-size:18px;line-height:1.55}
.work-category{margin-top:120px}
.category-heading{display:flex;align-items:baseline;gap:24px;margin-bottom:38px;border-bottom:2px solid var(--ink);padding-bottom:13px}
.category-heading>span{color:var(--pink);font:700 17px "Comic Sans MS",cursive;white-space:nowrap}
.category-heading h3{margin:0;font:700 clamp(31px,3vw,46px) Georgia,serif}
.category-heading-right{justify-content:flex-end;text-align:right}
.project-layout{display:grid;gap:clamp(35px,5vw,78px);align-items:start}
.project-layout-two{grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr)}
.project-layout-reverse{grid-template-columns:minmax(300px,.75fr) minmax(0,1.25fr)}
.project-layout-three{grid-template-columns:1.05fr .95fr;grid-template-areas:"tall wide" "tall compact";gap:62px 75px}
.project-tall{grid-area:tall}.project-wide{grid-area:wide}.project-compact{grid-area:compact;max-width:78%;justify-self:end}.project-offset{margin-top:105px}
.project a{display:block;color:var(--ink);text-decoration:none}
.project-image{position:relative;display:grid;place-items:center;min-height:270px;overflow:hidden;border:1px solid #ead8d5;background-color:#f7dfdf;box-shadow:9px 10px 0 #ffc8d8;transition:transform 350ms ease-out}
.project-featured .project-image{min-height:455px}.project-medium .project-image{min-height:340px}.project-tall .project-image{min-height:610px}.project-wide .project-image{min-height:300px}.project-compact .project-image{min-height:255px}
.project-image:before{content:"";position:absolute;inset:0;opacity:.55;background-image:linear-gradient(rgba(255,255,255,.55) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.55) 1px,transparent 1px);background-size:26px 26px;transition:transform 350ms ease-out}
.project-image:after{content:"";position:absolute;width:58%;height:34%;left:20%;top:31%;background:rgba(255,255,255,.55);clip-path:polygon(3% 5%,100% 0,96% 92%,0 100%);transform:rotate(-3deg);transition:transform 350ms ease-out}
.project-image span{position:relative;z-index:2;padding:8px 15px;background:var(--ink);color:#fff;font:14px "Comic Sans MS",cursive;transform:rotate(-2deg)}
.project .project-image.project-cover{aspect-ratio:16/9;min-height:0}
.project-image.project-cover:before,.project-image.project-cover:after{display:none}
.project-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform 350ms ease-out}
.cover-pg img{object-position:center 54%}
.cover-jingxin img{object-position:center 48%}
.cover-d11 img{object-position:center center}
.cover-solid-gold-ip img{object-position:center 48%}
.cover-budweiser img{object-position:56% center}
.cover-harbin img{object-position:center center}
.cover-super-wings img{object-position:center 47%}
.cover-ai img{object-position:center center}
.placeholder-mothers,.placeholder-harbin{background-color:#ffe5bd}.placeholder-d11,.placeholder-superwings{background-color:#f4d5df}.placeholder-ip{background-color:#e9dce8}.placeholder-budweiser{background-color:#f8c6ca}
.project-meta{display:grid;grid-template-columns:auto 1fr;gap:22px;margin-top:24px;align-items:start}
.project-number{color:var(--pink);font:52px/.9 Georgia,serif}
.project h4{margin:0 0 7px;font:700 clamp(23px,2vw,31px) Georgia,serif}.project-meta p{margin:0 0 18px;font:700 15px "Comic Sans MS",cursive}.view-case{display:inline-block;border-bottom:2px solid var(--pink);padding-bottom:4px;font:700 15px "Comic Sans MS",cursive}.view-case b{display:inline-block;margin-left:7px;color:var(--pink);font-size:20px;transition:transform 350ms ease-out}
@media (hover:hover) and (pointer:fine){.project:hover .project-image{transform:translateY(-4px) scale(1.025)}.project:hover .project-image:before{transform:scale(1.02)}.project:hover .project-image:after{transform:rotate(-4deg) scale(1.02)}.project:hover .view-case b{transform:translateX(5px)}}
@media (hover:hover) and (pointer:fine){.project:hover .project-cover img{transform:scale(1.025)}}
@media (min-width:768px) and (max-width:1199px){.work-section{padding-top:85px}.work-header:after{right:-220px}.project-layout-two,.project-layout-reverse{grid-template-columns:1.1fr .9fr;gap:45px}.project-layout-three{gap:48px}.project-featured .project-image{min-height:390px}.project-tall .project-image{min-height:540px}.project-offset{margin-top:70px}}
@media (max-width:767px){.work-section{padding:75px 22px 90px}.work-header{margin-bottom:70px}.work-header:after{display:none}.work-header h2{font-size:82px;letter-spacing:-5px}.work-header>p:last-child{font-size:16px}.work-category{margin-top:80px}.category-heading,.category-heading-right{display:block;text-align:left;margin-bottom:28px}.category-heading h3{margin-top:7px}.project-layout,.project-layout-two,.project-layout-reverse,.project-layout-three{display:grid;grid-template-columns:1fr;grid-template-areas:none;gap:65px}.project,.project-tall,.project-wide,.project-compact{grid-area:auto;max-width:none;justify-self:stretch}.project-offset{margin-top:0}.project-image,.project-featured .project-image,.project-medium .project-image,.project-tall .project-image,.project-wide .project-image,.project-compact .project-image{min-height:300px}.project-meta{gap:16px}.project-number{font-size:44px}}

/* Category 04 — AI-powered Marketing Intelligence */
.ai-project-wrap{position:relative;width:min(100%,1120px);margin:0 auto}
.project-ai-feature .project-image{min-height:520px;background-color:#efdde8}
.project-ai-feature .project-image:after{width:48%;height:38%;left:26%;top:29%;transform:rotate(2deg)}
.project-ai-feature .project-meta{grid-template-columns:90px minmax(0,1fr);max-width:920px;margin:27px auto 0}
.project-ai-feature h4{font-size:clamp(27px,2.5vw,38px)}
.project-ai-feature .project-meta>div>p{margin-bottom:10px}
.project-ai-feature .capability-tags{color:#6e6262;font:15px "Comic Sans MS",cursive}
.ai-annotation{position:absolute;z-index:3;right:-8px;top:-45px;margin:0;color:var(--pink);font:19px "Comic Sans MS",cursive;transform:rotate(-3deg)}
@media (min-width:768px) and (max-width:1199px){.ai-project-wrap{width:92%}.project-ai-feature .project-image{min-height:440px}.project-ai-feature .project-meta{grid-template-columns:75px 1fr}.ai-annotation{right:0}}
@media (max-width:767px){.ai-project-wrap{width:100%}.project-ai-feature .project-image{min-height:320px}.project-ai-feature .project-meta{grid-template-columns:auto 1fr;margin-top:24px}.project-ai-feature h4{font-size:25px}.ai-annotation{position:static;margin:0 0 17px;text-align:right;font-size:16px}.project-ai-feature .capability-tags{font-size:14px;line-height:1.5}}

/* AI Lab overview */
.ai-lab-section{width:min(100%,1500px);margin:0 auto;padding:120px clamp(32px,5vw,76px) 135px;background:linear-gradient(180deg,#fff7f2 0,#fff0f1 48%,#fffaf5 100%)}
.ai-lab-header{position:relative;max-width:900px;margin-bottom:115px}
.ai-lab-kicker{margin:0;color:var(--pink);font:700 25px "Comic Sans MS",cursive}
.ai-lab-header h2{margin:0;font:clamp(90px,10vw,148px)/.85 Georgia,serif;letter-spacing:-8px}.ai-lab-header h2 span{color:var(--pink);font-size:.5em;vertical-align:top}
.ai-lab-subtitle{margin:28px 0 0;font-size:19px;line-height:1.55}
.ai-lab-annotation{position:absolute;right:-280px;bottom:16px;margin:0;color:var(--pink);font:20px "Comic Sans MS",cursive;transform:rotate(-3deg)}
.featured-experiment{position:relative}.experiment-heading{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);column-gap:80px;align-items:end;margin-bottom:60px}
.experiment-label{grid-column:1/-1;display:inline-block;justify-self:start;margin:0 0 20px;padding:7px 17px;background:var(--ink);color:#fff;font:16px "Comic Sans MS",cursive;clip-path:polygon(3% 5%,97% 0,100% 80%,4% 100%,0 35%)}
.experiment-heading h3{margin:0;font:clamp(48px,5.5vw,80px)/.94 Georgia,serif;letter-spacing:-3px}.experiment-cn{align-self:start;margin:18px 0 0;color:var(--pink);font:700 23px "Comic Sans MS",cursive}
.experiment-description{grid-column:2;grid-row:2/4;margin:0;font-size:17px;line-height:1.7;max-width:520px}
.research-workflow{display:flex;align-items:center;justify-content:space-between;gap:9px;margin:0 0 45px;padding:17px 20px;border-top:1px solid #d9c8c4;border-bottom:1px solid #d9c8c4;overflow:hidden}.research-workflow span{font:700 12px "Comic Sans MS",cursive;text-align:center}.research-workflow i{color:var(--pink);font:normal 22px Georgia,serif;transform:rotate(-90deg)}
.experiment-visual{position:relative;display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:center;gap:20px;min-height:510px;padding:68px 55px;background-color:#f6dfe5;background-image:linear-gradient(rgba(255,255,255,.62) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.62) 1px,transparent 1px);background-size:30px 30px;border:1px solid #e7d2d5;box-shadow:12px 13px 0 #ffc9da;transition:transform 350ms ease-out}
.experiment-visual:before{content:"";position:absolute;top:-15px;left:39%;width:220px;height:29px;background:rgba(255,137,172,.7);transform:rotate(2deg)}
.visual-stage{position:relative;z-index:2;min-height:240px;padding:28px 20px;background:#fffaf4;box-shadow:0 7px 17px #886f6824;transform:rotate(-1.5deg)}.visual-stage:nth-of-type(even){transform:rotate(1.5deg)}.visual-stage small{display:block;color:var(--pink);font:700 12px "Comic Sans MS",cursive}.visual-stage strong{display:block;margin:38px 0 16px;font:30px Georgia,serif}.visual-stage span{font-size:13px;line-height:1.5}.visual-arrow{position:relative;z-index:2;color:var(--pink);font:32px Georgia,serif;transition:transform 350ms ease-out}.visual-note{position:absolute;right:32px;bottom:19px;margin:0;color:var(--ink);font:17px "Comic Sans MS",cursive;transform:rotate(-2deg)}
.experiment-capabilities{display:flex;flex-wrap:wrap;gap:12px;margin:36px 0}.experiment-capabilities span{padding:8px 14px;border:1px solid var(--ink);border-radius:999px;background:#fffaf5;font:13px "Comic Sans MS",cursive;transition:transform 300ms ease-out,background-color 300ms ease-out}
.experiment-cta{display:inline-flex;align-items:center;gap:24px;padding:14px 27px;background:var(--ink);color:#fff;text-decoration:none;font:18px "Comic Sans MS",cursive;clip-path:polygon(3% 6%,97% 0,100% 78%,5% 100%,0 34%)}.experiment-cta span{color:var(--pink);font-size:27px;transition:transform 300ms ease-out}
.lab-notes{margin-top:150px;padding-top:34px;border-top:3px solid var(--ink)}.lab-notes>header{display:flex;align-items:end;justify-content:space-between;margin-bottom:55px}.lab-notes h3{margin:0;font:clamp(46px,5vw,68px) Georgia,serif}.lab-notes h3 span{color:var(--pink)}.lab-notes header p{margin:0 0 8px;font:19px "Comic Sans MS",cursive}.lab-note-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:25px}.lab-note-grid article{min-height:190px;padding:26px 22px;background:#fffaf1;border:1px solid #ead8d0;box-shadow:6px 7px 0 #ffd1df}.lab-note-grid article:nth-child(even){transform:translateY(26px) rotate(1deg)}.lab-note-grid article:nth-child(odd){transform:rotate(-1deg)}.lab-note-grid span{color:var(--pink);font:700 12px "Comic Sans MS",cursive}.lab-note-grid p{margin:46px 0 0;font:700 20px/1.35 Georgia,serif}.experiments-progress{margin:80px 0 0;text-align:right;font:20px "Comic Sans MS",cursive}.experiments-progress span{color:var(--pink)}
.ai-lab-section:not(.is-expanded){padding-top:90px;padding-bottom:105px}
.ai-lab-section:not(.is-expanded) .ai-lab-header{margin-bottom:65px}
.ai-lab-section:not(.is-expanded) .experiment-heading{margin-bottom:34px}
.ai-lab-toggle{display:inline-flex;align-items:center;gap:18px;padding:13px 24px;border:0;background:var(--ink);color:#fff;cursor:pointer;font:18px "Comic Sans MS",cursive;clip-path:polygon(3% 6%,97% 0,100% 78%,5% 100%,0 34%)}
.ai-lab-toggle span{color:var(--pink);font:27px/1 Georgia,serif;transition:transform 300ms ease-out}
.ai-lab-details{display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;transition:grid-template-rows 520ms cubic-bezier(.22,.8,.24,1),opacity 320ms ease-out,visibility 0s linear 520ms}
.ai-lab-details-inner{min-height:0;overflow:hidden}
.ai-lab-details .research-workflow{margin-top:55px}
.ai-lab-details .experiment-cta{margin-top:38px}
.ai-lab-section.is-expanded .ai-lab-details{grid-template-rows:1fr;opacity:1;visibility:visible;transition:grid-template-rows 560ms cubic-bezier(.22,.8,.24,1),opacity 380ms ease-out 90ms,visibility 0s}
.ai-lab-section .lab-notes{transition:margin-top 520ms cubic-bezier(.22,.8,.24,1)}
.ai-lab-section:not(.is-expanded) .lab-notes{margin-top:78px}
@media(hover:hover) and (pointer:fine){.ai-lab-toggle:hover span{transform:rotate(90deg)}}
@media(prefers-reduced-motion:reduce){.ai-lab-details,.ai-lab-section .lab-notes,.ai-lab-toggle span{transition:none}}
@media (hover:hover) and (pointer:fine){.experiment-visual:hover{transform:translateY(-4px)}.experiment-visual:hover .visual-arrow{transform:translateX(5px)}.experiment-capabilities span:hover{transform:translateY(-2px) rotate(-1deg);background:#ffe7ef}.experiment-cta:hover span{transform:translateX(6px)}.lab-note-grid article{transition:transform 320ms ease-out}.lab-note-grid article:nth-child(odd):hover{transform:translateY(-3px) rotate(-2deg)}.lab-note-grid article:nth-child(even):hover{transform:translateY(22px) rotate(2deg)}}
@media (min-width:768px) and (max-width:1199px){.ai-lab-section{padding-top:90px}.ai-lab-annotation{right:-70px}.experiment-heading{grid-template-columns:1fr .8fr;gap:50px}.research-workflow{gap:5px;padding-inline:10px}.research-workflow span{font-size:10px}.experiment-visual{gap:12px;padding:55px 25px}.visual-stage{padding:24px 14px}.visual-stage strong{font-size:23px}.lab-note-grid{grid-template-columns:repeat(2,1fr);gap:35px}.lab-note-grid article:nth-child(even){transform:translateY(0) rotate(1deg)}}
@media (max-width:767px){.ai-lab-section{padding:80px 22px 95px}.ai-lab-header{margin-bottom:80px}.ai-lab-header h2{font-size:86px;letter-spacing:-5px}.ai-lab-subtitle{font-size:16px}.ai-lab-subtitle br{display:none}.ai-lab-annotation{position:static;margin-top:20px;font-size:16px}.experiment-heading{display:block;margin-bottom:40px}.experiment-heading h3{font-size:49px}.experiment-cn{font-size:19px}.experiment-description{margin-top:25px;font-size:15px}.research-workflow{display:grid;justify-content:stretch;gap:8px;padding:18px}.research-workflow i{transform:none;text-align:center;line-height:1}.experiment-visual{display:grid;grid-template-columns:1fr;gap:14px;min-height:0;padding:42px 26px 65px}.visual-stage{min-height:175px}.visual-stage strong{margin:27px 0 13px}.visual-arrow{text-align:center;transform:rotate(90deg)}.visual-note{left:24px;right:auto;font-size:14px}.experiment-capabilities{gap:8px}.experiment-capabilities span{font-size:12px}.lab-notes{margin-top:105px}.lab-notes>header{display:block;margin-bottom:38px}.lab-notes h3{font-size:46px}.lab-notes header p{margin-top:8px}.lab-note-grid{grid-template-columns:1fr;gap:22px}.lab-note-grid article,.lab-note-grid article:nth-child(even),.lab-note-grid article:nth-child(odd){min-height:155px;transform:none}.lab-note-grid p{margin-top:34px}.experiments-progress{margin-top:45px;text-align:left;font-size:17px}}

/* About */
.about-section{width:min(100%,1500px);margin:0 auto;padding:120px clamp(32px,5vw,76px) 0;background:linear-gradient(180deg,#fffaf5,#fff0f1 58%,#fff9f3)}
.about-header{position:relative;max-width:900px;margin-bottom:100px}.about-kicker{margin:0;color:var(--pink);font:700 25px "Comic Sans MS",cursive}.about-header h2{margin:0;font:clamp(92px,10vw,150px)/.84 Georgia,serif;letter-spacing:-8px}.about-header h2 span{color:var(--pink);font-size:.5em;vertical-align:top}.about-annotation{position:absolute;right:-235px;bottom:14px;margin:0;color:var(--pink);font:20px "Comic Sans MS",cursive;transform:rotate(-3deg)}
.about-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(390px,.85fr);gap:90px;align-items:start}.section-label{display:inline-block;margin:0 0 20px;padding:6px 15px;background:var(--ink);color:#fff;font:14px "Comic Sans MS",cursive;transform:rotate(-1deg)}.positioning-copy h3{margin:0;font:clamp(43px,4vw,61px)/1 Georgia,serif}.positioning-line{max-width:650px;margin:24px 0 0;color:var(--pink);font:700 20px/1.5 "Comic Sans MS",cursive;border-bottom:3px solid var(--pink);padding-bottom:9px}.about-description{margin:27px 0 0;font-size:18px;line-height:1.65}.capability-board{position:relative;padding:38px 34px;background:#fff9ef;border:1px solid #ead7ce;box-shadow:9px 10px 0 #ffd1dd;transform:rotate(1deg)}.capability-board h3{margin:0 0 27px;font:23px Georgia,serif}.about-capabilities{display:flex;flex-wrap:wrap;gap:12px}.about-capabilities span{padding:9px 13px;border:1px solid var(--ink);background:#fffdf7;font:14px "Comic Sans MS",cursive;transition:transform 300ms ease-out}.about-capabilities span:nth-child(2n){transform:rotate(1deg)}.about-capabilities span:nth-child(3n){transform:rotate(-1deg)}.capability-board>p{margin:27px 0 0;text-align:right;color:var(--pink);font:16px "Comic Sans MS",cursive}
.experience-section{margin-top:155px}.about-section-heading{display:flex;align-items:end;justify-content:space-between;padding-bottom:20px;border-bottom:3px solid var(--ink)}.about-section-heading h3{margin:0;font:clamp(52px,6vw,82px) Georgia,serif}.about-section-heading h3 span{color:var(--pink)}.about-section-heading p{margin:0 0 9px;font:18px "Comic Sans MS",cursive}.experience-timeline{position:relative;list-style:none;margin:60px 0 0;padding:0}.experience-timeline:before{content:"";position:absolute;left:24%;top:11px;bottom:15px;width:2px;background:var(--ink)}.experience-timeline li{position:relative;display:grid;grid-template-columns:24% 1fr;min-height:132px;padding-bottom:35px}.experience-timeline li:after{content:"";position:absolute;left:calc(24% - 6px);top:8px;width:14px;height:14px;border-radius:50%;background:var(--pink);border:3px solid #fff5f1;box-shadow:0 0 0 1px var(--pink);transition:transform 300ms ease-out}.experience-timeline time{padding-right:45px;text-align:right;font:16px "Comic Sans MS",cursive}.experience-timeline li>div{padding-left:65px}.experience-timeline h4{margin:0 0 10px;font:700 31px Georgia,serif}.experience-timeline li p{margin:0;font:16px "Comic Sans MS",cursive}
.education-section{display:grid;grid-template-columns:28% 1fr;gap:50px;margin-top:100px;padding:42px 0;border-top:1px solid #d8c7c1;border-bottom:1px solid #d8c7c1}.education-section>h3{margin:0;font:38px Georgia,serif}.education-list{display:grid;grid-template-columns:repeat(2,1fr);gap:65px}.education-list article{display:grid;grid-template-columns:auto 1fr;gap:22px}.education-list time{color:var(--pink);font:14px "Comic Sans MS",cursive}.education-list h4{margin:0 0 8px;font:700 21px Georgia,serif}.education-list p{margin:0;font-size:14px;line-height:1.5}
.personal-section{margin-top:140px}.personal-section>header p{margin:0;color:var(--pink);font:20px "Comic Sans MS",cursive}.personal-section>header h3{margin:0;font:clamp(52px,6vw,85px)/.95 Georgia,serif}.personal-section>header h3 span{color:var(--pink);font-size:.6em}.personal-content{position:relative;display:grid;grid-template-columns:.8fr 1.2fr;gap:85px;align-items:center;margin-top:65px;padding:55px;background:#fffaf1;border:1px solid #eadbd5}.personal-labels{display:flex;flex-direction:column;align-items:flex-start;gap:18px}.personal-labels span{padding:10px 21px;background:var(--pink);font:700 18px "Comic Sans MS",cursive;box-shadow:5px 6px 0 var(--ink)}.personal-labels span:nth-child(2){margin-left:55px;transform:rotate(2deg)}.personal-labels span:nth-child(3){margin-left:15px;transform:rotate(-2deg)}.personal-statement{margin:0;font:clamp(23px,2.3vw,34px)/1.45 Georgia,serif}.personal-note{position:absolute;right:42px;bottom:-45px;margin:0;color:var(--pink);font:21px "Comic Sans MS",cursive;transform:rotate(-3deg)}
.connect-cta{display:flex;align-items:flex-end;justify-content:space-between;margin:150px calc(clamp(32px,5vw,76px) * -1) 0;padding:75px clamp(32px,5vw,76px);background:var(--ink);color:#fff;text-decoration:none}.connect-cta>span{font:clamp(62px,8vw,112px)/.82 Georgia,serif;letter-spacing:-5px}.connect-cta b{display:inline-block;color:var(--pink);font-weight:400;transition:transform 300ms ease-out}.connect-cta small{padding-bottom:8px;font:16px/1.5 "Comic Sans MS",cursive}
@media (hover:hover) and (pointer:fine){.about-capabilities span:hover{transform:translateY(-4px) rotate(-1deg)}.experience-timeline li:hover:after{transform:scale(1.35)}.about-annotation,.personal-note{transition:translate 300ms ease-out}.about-annotation:hover,.personal-note:hover{translate:3px -2px}.connect-cta:hover b{transform:translateX(9px)}}
@media (min-width:768px) and (max-width:1199px){.about-section{padding-top:90px}.about-annotation{right:-50px}.about-intro{grid-template-columns:1fr .8fr;gap:50px}.experience-timeline:before{left:27%}.experience-timeline li{grid-template-columns:27% 1fr}.experience-timeline li:after{left:calc(27% - 6px)}.education-section{grid-template-columns:1fr}.education-list{gap:40px}.personal-content{gap:45px}}
@media (max-width:767px){.about-section{padding:80px 22px 0}.about-header{margin-bottom:75px}.about-header h2{font-size:88px;letter-spacing:-5px}.about-annotation{position:static;margin-top:18px;font-size:16px}.about-intro{grid-template-columns:1fr;gap:55px}.positioning-copy h3{font-size:43px}.positioning-line{font-size:17px}.about-description{font-size:16px}.about-description br{display:none}.capability-board{padding:30px 24px}.experience-section{margin-top:105px}.about-section-heading{display:block}.about-section-heading h3{font-size:49px}.about-section-heading p{margin-top:12px;font-size:15px}.experience-timeline{margin-top:45px}.experience-timeline:before{left:8px}.experience-timeline li{display:block;min-height:145px;padding-left:38px}.experience-timeline li:after{left:2px}.experience-timeline time{display:block;padding:0;text-align:left;font-size:14px}.experience-timeline li>div{padding:14px 0 0}.experience-timeline h4{font-size:27px}.education-section{grid-template-columns:1fr;gap:30px;margin-top:60px}.education-list{grid-template-columns:1fr;gap:38px}.education-list article{grid-template-columns:1fr;gap:8px}.personal-section{margin-top:100px}.personal-section>header h3{font-size:50px}.personal-content{grid-template-columns:1fr;gap:50px;margin-top:45px;padding:38px 25px 60px}.personal-labels span:nth-child(2),.personal-labels span:nth-child(3){margin-left:0}.personal-statement{font-size:24px}.personal-statement br{display:none}.personal-note{right:20px;bottom:-38px;font-size:17px}.connect-cta{display:block;margin-top:120px;padding-block:60px}.connect-cta>span{font-size:60px}.connect-cta small{display:block;margin-top:35px;font-size:14px}}
@media (max-width:767px){.connect-cta{margin-left:-22px;margin-right:-22px}}

/* Selected Work: controlled editorial rhythm with only two card sizes. */
.work-project-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));column-gap:clamp(12px,1.35vw,22px);row-gap:105px;margin-top:120px}
.work-project-grid>.work-category,.work-project-grid .project-layout,.work-project-grid .ai-project-wrap{display:contents}
.work-project-grid .category-heading{display:none}
.work-project-grid .project,.work-project-grid .project-tall,.work-project-grid .project-wide,.work-project-grid .project-compact{position:relative;grid-area:auto;max-width:none;margin:0;justify-self:stretch}
.work-project-grid .project{grid-column:span 4}
.work-project-grid .work-card-feature{grid-column:span 6}
.work-project-grid .work-card-01{grid-column:1/span 6}
.work-project-grid .work-card-02{grid-column:7/span 4;margin-top:78px}
.work-project-grid .work-card-03{grid-column:2/span 4}
.work-project-grid .work-card-04{grid-column:7/span 4;margin-top:105px}
.work-project-grid .work-card-05{grid-column:4/span 6}
.work-project-grid .work-card-06{grid-column:1/span 4}
.work-project-grid .work-card-07{grid-column:6/span 4;margin-top:72px}
.work-project-grid .work-card-08{grid-column:3/span 4}
.work-project-grid .project-image,.work-project-grid .project-featured .project-image,.work-project-grid .project-medium .project-image,.work-project-grid .project-tall .project-image,.work-project-grid .project-wide .project-image,.work-project-grid .project-compact .project-image,.work-project-grid .project-ai-feature .project-image{width:100%;min-height:0;aspect-ratio:16/10}
.work-project-grid .project-cover img{width:100%;height:100%;object-fit:cover}
.work-project-grid .project-meta,.work-project-grid .project-ai-feature .project-meta{grid-template-columns:auto minmax(0,1fr);gap:18px;max-width:none;margin:24px 0 0}
.work-project-grid .project h4,.work-project-grid .project-ai-feature h4{font-size:clamp(23px,2vw,31px)}
.work-project-grid .ai-annotation{right:8px;top:-34px}
@media(min-width:768px) and (max-width:1199px){.work-project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:76px 38px}.work-project-grid .project,.work-project-grid .work-card-feature,.work-project-grid .work-card-01,.work-project-grid .work-card-02,.work-project-grid .work-card-03,.work-project-grid .work-card-04,.work-project-grid .work-card-05,.work-project-grid .work-card-06,.work-project-grid .work-card-07,.work-project-grid .work-card-08{grid-column:auto;margin-top:0}.work-project-grid .work-card-01,.work-project-grid .work-card-05{grid-column:span 2;width:75%}.work-project-grid .work-card-01{justify-self:start}.work-project-grid .work-card-05{justify-self:end}}
@media(max-width:767px){.work-project-grid{grid-template-columns:1fr;gap:65px;margin-top:80px}.work-project-grid .project,.work-project-grid .work-card-feature,.work-project-grid .work-card-01,.work-project-grid .work-card-02,.work-project-grid .work-card-03,.work-project-grid .work-card-04,.work-project-grid .work-card-05,.work-project-grid .work-card-06,.work-project-grid .work-card-07,.work-project-grid .work-card-08{grid-column:1;width:100%;margin-top:0}.work-project-grid .ai-annotation{position:absolute;right:0;top:-32px;margin:0}}

/* Pre-launch responsive bug fix: keep the editorial header note inside tablet bounds. */
@media(min-width:768px) and (max-width:1199px){.work-header:after{right:0;bottom:-48px}.ai-lab-annotation,.about-annotation{right:0}}

/* Production V1.1: approved motion system + mobile-safe Hero typography. */
.work-section{overflow-x:clip}
@media(max-width:767px){
  .hero.hero-centered{height:100vh;height:100svh;min-height:640px;max-height:none}
  .hero-name h1{font-size:clamp(68px,22vw,86px);line-height:.8;letter-spacing:-4.5px}
  .hero-name-left{left:10px;top:20%!important;transform:scaleX(.78)!important}
  .hero-name-right{right:10px;bottom:26%;transform:scaleX(.78)!important}
}

.hero-name{isolation:isolate}
.hero-name .hero-name-alternate{--lens-x:50%;--lens-y:50%;position:absolute;inset:0;z-index:2;color:var(--pink);font-family:"Comic Sans MS",cursive;font-style:italic;font-weight:700;letter-spacing:clamp(-8px,-.38vw,-4px);opacity:0;pointer-events:none;-webkit-mask-image:radial-gradient(circle 86px at var(--lens-x) var(--lens-y),#000 0 54%,rgba(0,0,0,.82) 66%,transparent 82%);mask-image:radial-gradient(circle 86px at var(--lens-x) var(--lens-y),#000 0 54%,rgba(0,0,0,.82) 66%,transparent 82%);transition:opacity 180ms ease-out;will-change:mask-position,opacity}
.hero-name .hero-name-alternate.is-lens-active{opacity:1}

.motion-enabled .work-project-grid .project.collage-pending{opacity:0;transform:translate3d(var(--collage-x,0),var(--collage-y,60px),0) rotate(var(--collage-r,0deg)) scale(var(--collage-scale,.95));transform-origin:center;will-change:transform,opacity}
.motion-enabled .work-project-grid .project.collage-pending.is-assembled{opacity:1;transform:translate3d(0,0,0) rotate(0) scale(1);transition:opacity 460ms ease-out,transform 760ms cubic-bezier(.16,.82,.22,1);transition-delay:var(--collage-delay,0ms)}

.project-cursor-label{position:fixed;z-index:100;left:0;top:0;padding:8px 11px 7px;background:var(--pink);color:var(--ink);border:1px solid var(--ink);box-shadow:3px 3px 0 var(--ink);font:700 12px/1 "Comic Sans MS",cursive;letter-spacing:.045em;pointer-events:none;opacity:0;scale:.82;rotate:-2deg;transition:opacity 130ms ease-out,scale 180ms cubic-bezier(.2,.82,.24,1.15);will-change:transform,opacity}
.project-cursor-label.is-visible{opacity:1;scale:1}

@media(max-width:767px){
  .hero-name .hero-name-alternate,.project-cursor-label{display:none!important}
  .motion-enabled .work-project-grid .project.collage-pending{--collage-x:0!important;--collage-y:34px!important;--collage-r:0deg!important;--collage-scale:.98!important}
}
@media(hover:none),(pointer:coarse){.hero-name .hero-name-alternate,.project-cursor-label{display:none!important}}
@media(prefers-reduced-motion:reduce){
  .hero-name .hero-name-alternate,.project-cursor-label{display:none!important}
  .motion-enabled .work-project-grid .project.collage-pending,.motion-enabled .work-project-grid .project.is-assembled{opacity:1!important;transform:none!important;transition:none!important}
}

/* Production refinement: readable supporting type, while titles and annotations retain their editorial voice. */
.work-project-grid .project-meta p{
  font-family:Arial,Helvetica,sans-serif;
  font-size:15px;
  font-style:normal;
  font-weight:500;
  line-height:1.5;
  letter-spacing:.01em;
}
.work-project-grid .project-ai-feature .capability-tags{
  font-family:Arial,Helvetica,sans-serif;
  font-style:normal;
  font-weight:500;
  line-height:1.55;
  letter-spacing:.01em;
}
@media(max-width:767px){
  .hero.hero-centered .cloud-one{left:50%;top:3%;width:22%}
  .work-project-grid .project-meta p{font-size:15px;line-height:1.55}
  .work-project-grid .project-ai-feature .capability-tags{font-size:14px;line-height:1.6}
}
