/* Hero review: one real project, with the established type and dark palette. */
.home-hero--work .home-hero__stage {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(40px, 5vw, 88px);
  width: min(1440px, calc(100% - 88px));
  min-height: 0;
  margin: 0 auto;
  padding: calc(var(--header-h) + var(--adminbar-h) + 64px) 0 64px;
}
.home-hero--work .home-hero__stage-inner {
  display: block;
  width: 100%;
  min-height: 0;
  max-width: none;
  padding: 0;
  margin: 0;
}
.home-hero--work .home-hero__headline-wrap { width: 100%; max-width: none; padding: 0; }
.home-hero--work::before, .home-hero--work::after { display: none; }
.home-hero--work .home-hero__headline { font-size: clamp(44px, 4.55vw, 72px); }
.home-hero--work .home-hero__intro { max-width: 640px; font-size: 18px; line-height: 1.55; }
.home-hero--work .home-hero__work { margin: 0; min-width: 0; }
.home-hero__work-link { display: block; color: inherit; text-decoration: none; }
.home-hero__work-link img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: center; }
.home-hero__work-link figcaption {
  display: flex; justify-content: space-between; gap: 16px;
  padding-top: 18px; font-size: 16px; line-height: 1.4;
  border-top: 1px solid rgba(255,255,255,.18);
}
.home-hero__work-link figcaption span:last-child { color: rgba(255,255,255,.7); }
.home-hero__work-link:focus-visible { outline: 2px solid #ff8561; outline-offset: 8px; }
@media (max-width: 1000px) {
  .home-hero--work .home-hero__stage { grid-template-columns: 1fr; width: calc(100% - 48px); gap: 32px; }
  .home-hero--work .home-hero__work { width: min(640px, 100%); }
}
@media (max-width: 767px) {
  .home-hero--work .home-hero__stage { width: calc(100% - 36px); padding-top: calc(var(--header-h) + var(--adminbar-h) + 36px); padding-bottom: 36px; }
  .home-hero--work .home-hero__headline { font-size: clamp(36px, 9vw, 48px); }
  .home-hero--work .home-hero__intro { font-size: 16px; line-height: 1.55; }
}

/* One identical CSS frame, independent screen, device and floating work layers. */
.wb-hero-devices{position:relative;isolation:isolate;width:100%;max-width:640px;aspect-ratio:.86;margin:0;align-self:center;min-width:0}
.wb-hero-devices__canvas{position:absolute;inset:0}
.wb-hero-device{position:absolute;width:43%;margin:0;will-change:transform;transition:transform .12s ease-out}
.wb-hero-device--web{left:5%;top:13%;z-index:1;transform:translate3d(0,var(--wb-parallax-y,0px),0) rotate(-6deg)}
.wb-hero-device--social{left:46%;top:4%;z-index:2;transform:translate3d(0,var(--wb-parallax-y,0px),0) rotate(6deg)}
.wb-device-shell{position:relative;aspect-ratio:.485;width:100%;border:1px solid #747883;border-radius:13.6%/6.6%;background:linear-gradient(110deg,#7d818a,#15181d 6%,#41454c 50%,#12141a 94%,#7e838b);box-shadow:inset 0 0 0 2px #111319,0 22px 30px #0005;isolation:isolate;overflow:hidden}
.wb-device-glass{position:absolute;inset:1.5% 3%;border-radius:12.5%/6.1%;background:#0a1017;z-index:0}
.wb-device-status{position:absolute;left:9%;right:9%;top:4%;height:3%;display:flex;justify-content:space-between;align-items:center;color:#fff;font:700 clamp(6px,.7vw,10px)/1 Effra,sans-serif;z-index:4}
.wb-device-status svg{width:13%;height:auto}
.wb-device-island{position:absolute;z-index:5;left:36%;top:3.3%;width:28%;height:3.8%;border-radius:30px;background:#010204;box-shadow:inset 0 1px 2px #ffffff0c}
.wb-device-island:after{content:'';position:absolute;width:9%;aspect-ratio:1;right:11%;top:20%;border-radius:50%;background:radial-gradient(circle at 45% 40%,#203860,#060a15 55%,#000)}
.wb-device-viewport{container-type:inline-size;position:absolute;inset:8.5% 3.5% 2%;border-radius:0 0 11.5% 11.5%/0 0 5.8% 5.8%;overflow:hidden;z-index:1;background:#101419}
.wb-device-slide{position:absolute;inset:0;opacity:0;transform:translateY(7px);transition:opacity .8s ease,transform 1s ease;pointer-events:none}
.wb-device-slide[data-active=true]{opacity:1;transform:translateY(0);z-index:1}
.wb-device-slide img{display:block;position:absolute;max-width:none!important;width:var(--source-w);height:auto;left:var(--source-x);top:var(--source-y)}
.wb-device-home-indicator{position:absolute;bottom:1.9%;left:37%;width:26%;height:.65%;border-radius:10px;background:#ffffffaa;z-index:4}
.wb-hero-reviews{position:absolute;left:0;top:69%;width:clamp(150px,39%,230px);z-index:4;transform:translate3d(0,var(--wb-parallax-y,0px),0) rotate(-5deg);filter:drop-shadow(0 8px 15px #0003)}
.wb-hero-reviews img{display:block;width:100%;height:auto}
.wb-hero-reactions{position:absolute;right:-2%;top:40%;width:clamp(116px,30%,175px);z-index:5;transform:translate3d(0,var(--wb-parallax-y,0px),0);pointer-events:none}
.wb-hero-reactions__svg{display:block;width:100%;height:auto;overflow:visible}
.wb-heart-particle{transform-box:fill-box;transform-origin:center;animation:wb-hero-heart-rise var(--duration) linear var(--delay) infinite;will-change:transform,opacity}
@keyframes wb-hero-heart-rise{0%{transform:translate(var(--birth-x),var(--birth-y)) scale(.45);opacity:0}12%{opacity:.95}72%{opacity:.65}100%{transform:translate(var(--end-x),var(--end-y)) scale(.95);opacity:0}}
.wb-work-orbit{position:absolute;z-index:6;pointer-events:none;transform:translate3d(0,var(--wb-parallax-y,0px),0)}
.wb-work-orbit__float{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;border:1px solid #ffffff38;border-radius:14px;box-shadow:0 12px 26px #0003;background:#f6f4ee;color:#0d1116;font:700 clamp(10px,1.1vw,15px)/1.2 Effra,sans-serif;white-space:nowrap;animation:wb-work-float 7s ease-in-out infinite alternate}
.wb-work-orbit__float img{display:block;object-fit:contain;width:auto;max-width:62px;height:30px}
.wb-work-orbit--wordpress{left:0;top:3%}.wb-work-orbit--wordpress .wb-work-orbit__float{border-radius:50%;padding:12px}.wb-work-orbit--wordpress img{width:30px;height:30px}
.wb-work-orbit--commerce{right:0;top:13%}.wb-work-orbit--commerce .wb-work-orbit__float{animation-delay:-3s;background:#f6f4ee}
.wb-work-orbit--design{left:17%;top:1.5%}.wb-work-orbit--design .wb-work-orbit__float{background:#fca5a5;animation-delay:-2s}
.wb-work-orbit--content{left:34%;bottom:3%}.wb-work-orbit--content .wb-work-orbit__float{background:#adbcff;animation-delay:-4s}
.wb-work-orbit__dot{width:8px;height:8px;border-radius:50%;background:#0d1116;opacity:.7}
@keyframes wb-work-float{from{transform:translateY(-4px) rotate(-2deg)}to{transform:translateY(4px) rotate(1deg)}}
.wb-hero-devices[data-active=false] :is(.wb-heart-particle,.wb-work-orbit__float){animation-play-state:paused}
.wb-hero-devices[data-motion=reduced] :is(.wb-heart-particle,.wb-work-orbit__float){animation:none;transform:none}
.wb-hero-devices[data-motion=reduced] .wb-heart-particle{opacity:.55}
.wb-hero-devices[data-motion=reduced] :is(.wb-hero-device,.wb-device-slide){transition:none}
@media(max-width:1000px){.wb-hero-devices{max-width:540px;justify-self:center;aspect-ratio:.86}.home-hero--work .home-hero__stage{gap:24px}}
@media(max-width:767px){.wb-hero-devices{max-width:430px;aspect-ratio:.84;margin:16px auto 10px}.wb-hero-device--web{top:12%}.wb-hero-device--social{top:3%}.wb-device-status{font-size:7px}.wb-hero-reviews{top:66%;width:43%;min-width:140px}.wb-hero-reactions{right:0;top:36%;width:33%;min-width:105px}.wb-work-orbit__float{padding:8px;gap:5px;border-radius:10px;font-size:10px}.wb-work-orbit__float img{max-width:44px;height:23px}.wb-work-orbit--wordpress .wb-work-orbit__float{padding:8px}.wb-work-orbit--wordpress img{width:23px;height:23px}.wb-work-orbit--design{left:17%;top:1.5%}.wb-work-orbit--content{left:32%;bottom:3%}}
@media(prefers-reduced-motion:reduce){.wb-heart-particle,.wb-work-orbit__float{animation:none!important;transform:none!important}.wb-heart-particle{opacity:.55}.wb-hero-device,.wb-hero-reviews,.wb-hero-reactions,.wb-device-slide{transition:none;will-change:auto}}
/* Hero release: Sanuk only in this hero; Graphik remains a separate local study. */
html body .home-hero--work h1.home-hero__headline{font-family:"FF Sanuk Round",sans-serif!important;font-weight:900!important;text-transform:none!important;letter-spacing:-.025em;line-height:1.04}
.wb-work-orbit--design .wb-work-orbit__float,.wb-work-orbit--content .wb-work-orbit__float{background:#f6f4ee;padding:12px;border-radius:50%}
.wb-work-orbit--design img{width:30px;height:30px}
.wb-work-orbit--content svg{display:block;width:30px;height:30px}
@media(max-width:767px){.wb-work-orbit--design .wb-work-orbit__float,.wb-work-orbit--content .wb-work-orbit__float{padding:8px}.wb-work-orbit--design img,.wb-work-orbit--content svg{width:23px;height:23px}}

@media(max-width:767px){html body .home-hero--work h1.home-hero__headline{font-size:clamp(26px,8.2vw,38px)!important;text-wrap:initial}}

/* Ben review: original star field, open technology marks, static work overview. */
.home-hero--work::before,.home-hero--work::after{display:block}
.wb-work-orbit .wb-work-orbit__float{background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:5px!important}
.wb-work-orbit--wordpress img{filter:brightness(0) invert(1)}
.wb-work-orbit--commerce img{height:34px;max-width:65px}
.wb-work-orbit--design{left:16%;top:auto;bottom:3%}
.wb-work-orbit--content{left:39%;bottom:1%}

@media(max-width:767px){.wb-work-orbit--design{left:15%;top:auto;bottom:3%}.wb-work-orbit--content{left:39%;bottom:1%}}