.wf-work{scroll-margin-top:95px}.wf-hint{color:#b4a79c;font-size:13px;margin:0}.wf-hint span{color:#ff7b34}.wf-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;padding:25px 10px 45px}.wf-lane{height:610px;display:flex;align-items:flex-end;justify-content:center;position:relative;background:radial-gradient(ellipse at 50% 95%,#ff782015,transparent 60%)}.wf-folder{position:relative;width:min(250px,90%);height:165px;isolation:isolate}.wf-back{position:absolute;inset:0;border-radius:16px;background:#a33e12;box-shadow:0 20px 40px #0006}.wf-back:before{content:'';position:absolute;top:-19px;left:0;width:43%;height:33px;border-radius:13px 13px 0 0;background:inherit}.wf-paper{position:absolute;inset:12px 16px 18px;background:#ead9c4;border-radius:10px;transition:transform .5s}.wf-front{position:absolute;inset:24px 0 0;display:flex;align-items:flex-end;padding:26px 22px;border-radius:15px;background:linear-gradient(145deg,#ff9b54,#fa742c 55%,#c64a13);box-shadow:inset 0 1px #ffd4a5,0 -7px 18px #0003;transform-origin:bottom;transform:perspective(700px) rotateX(-12deg);transition:transform .55s cubic-bezier(.2,.8,.2,1)}.wf-front strong{font-size:23px;letter-spacing:-.7px;color:#24130a}.wf-toggle{position:absolute;inset:0;border:0;background:transparent;border-radius:16px;cursor:pointer}.wf-toggle:focus-visible{outline:3px solid #ffd4a5;outline-offset:5px}.wf-cloud{position:absolute;left:50%;top:0;z-index:5}.wf-shot{position:absolute;left:0;top:0;width:94px;opacity:0;pointer-events:none;text-decoration:none;color:#fff;transform:translate(-50%,60px) scale(.16) rotate(0);transition:transform .65s cubic-bezier(.22,1.45,.36,1),opacity .25s;transition-delay:calc(var(--i)*55ms);transform-origin:50% 100%;will-change:transform,opacity}.wf-float{display:block;border:1px solid #ffffff30;background:#201b17;border-radius:10px;padding:4px;box-shadow:0 12px 24px #0007;animation:wf-drift var(--duration) ease-in-out infinite;animation-delay:calc(var(--i)*-.61s);animation-play-state:paused;transition:scale .25s,border-color .25s}.wf-shot img{width:100%;height:112px;object-fit:cover;display:block;border-radius:6px}.wf-caption{display:flex;justify-content:space-between;gap:3px;padding:7px 1px 3px;font-size:9px;line-height:1.3;font-weight:600}.wf-caption b{color:#ff893e}.wf-folder[data-open] .wf-front{transform:perspective(700px) rotateX(-35deg)}.wf-folder[data-open] .wf-paper{transform:translateY(-12px)}.wf-folder[data-open] .wf-cloud:before{content:'';position:absolute;left:-158px;top:-480px;width:316px;height:500px}.wf-folder[data-open] .wf-shot{opacity:1;pointer-events:auto;transform:translate(calc(-50% + var(--x)),var(--y)) scale(var(--depth)) rotate(var(--r))}.wf-folder[data-open] .wf-float{animation-play-state:running}.wf-shot:hover,.wf-shot:focus-visible{z-index:12;outline:none}.wf-shot:hover .wf-float,.wf-shot:focus-visible .wf-float{animation-play-state:paused;scale:1.13;border-color:#ff873d;box-shadow:0 16px 30px #0009,0 0 0 2px #ff873d}.wf-folder[data-open]{z-index:10}@keyframes wf-drift{0%,100%{translate:0 0;rotate:-1.5deg}35%{translate:4px -9px;rotate:2deg}70%{translate:-3px -4px;rotate:-.5deg}}@media(min-width:1350px){.wf-cloud{scale:1.12;transform-origin:top center}.wf-lane{height:665px}.wf-folder{width:280px;height:180px}.wf-front strong{font-size:26px}}@media(max-width:900px){.wf-grid{gap:14px;padding-inline:0}.wf-cloud{scale:.77;transform-origin:top center}.wf-lane{height:490px}.wf-folder{height:135px;width:95%}.wf-front{padding:20px 12px}.wf-front strong{font-size:18px}}@media(max-width:620px){.wf-grid{grid-template-columns:1fr;gap:18px}.wf-lane{height:580px}.wf-cloud{scale:1;transform-origin:top center}.wf-folder{width:260px;height:165px}.wf-front{padding:25px}.wf-front strong{font-size:24px}}@media(prefers-reduced-motion:reduce){.wf-shot,.wf-front,.wf-paper{transition:none}.wf-float{animation:none}}body.motion-off .wf-float,body.reduce-motion .wf-float{animation:none}
/* Reserve room for floating cards only while a collection is open. */
.wf-grid{padding-top:34px}.wf-lane{height:190px;transition:height .65s cubic-bezier(.22,1,.36,1)}
.wf-grid:has(.wf-folder[data-open]) .wf-lane{height:650px}
@media(min-width:1350px){.wf-lane{height:205px}.wf-grid:has(.wf-folder[data-open]) .wf-lane{height:730px}}
@media(min-width:621px) and (max-width:900px){.wf-lane{height:160px}.wf-grid:has(.wf-folder[data-open]) .wf-lane{height:530px}}
@media(max-width:620px){.wf-lane{height:190px}.wf-grid:has(.wf-folder[data-open]) .wf-lane{height:190px}.wf-grid .wf-lane:has(.wf-folder[data-open]){height:650px}}
@media(prefers-reduced-motion:reduce){.wf-lane{transition:none}}
/* Floating previews overlay the heading; opening never changes layout. */
#work{position:relative;overflow:visible}
#work>.sec-head{margin-bottom:12px;transition:filter .35s ease,opacity .35s ease}
.wf-hint{transition:filter .35s ease,opacity .35s ease}
.wf-grid{padding-top:25px;padding-bottom:25px}
.wf-grid .wf-lane,.wf-grid:has(.wf-folder[data-open]) .wf-lane,.wf-grid .wf-lane:has(.wf-folder[data-open]){height:180px;transition:none}
#work:has(.wf-folder[data-open])>.sec-head,#work:has(.wf-folder[data-open]) .wf-hint{filter:blur(7px);opacity:.3;pointer-events:none}
.wf-work{position:relative;z-index:5}
.wf-folder[data-open] .wf-cloud{z-index:20}
@media(min-width:1350px){.wf-grid .wf-lane,.wf-grid:has(.wf-folder[data-open]) .wf-lane{height:195px}}
@media(min-width:621px) and (max-width:900px){.wf-grid .wf-lane,.wf-grid:has(.wf-folder[data-open]) .wf-lane{height:150px}}
@media(max-width:620px){.wf-grid .wf-lane,.wf-grid:has(.wf-folder[data-open]) .wf-lane,.wf-grid .wf-lane:has(.wf-folder[data-open]){height:180px}}
/* A rising fan: small at the mouth, wide and larger at the crown. */
.wf-folder{transition:transform .48s cubic-bezier(.22,1.5,.36,1);transform-origin:50% 100%}
.wf-folder[data-open]{transform:translateY(-10px) scale(1.045)}
.wf-cloud{scale:1;transform-origin:top center}
.wf-shot{width:110px;transition:transform .72s cubic-bezier(.22,1.4,.36,1),opacity .25s;transition-delay:calc(var(--i)*70ms)}
.wf-shot img{height:123px}
.wf-folder[data-open] .wf-cloud:before{left:-255px;top:-530px;width:510px;height:555px;clip-path:polygon(0 0,100% 0,80% 100%,20% 100%)}
.wf-lane:has(.wf-folder[data-open]){z-index:15}
@media(max-width:900px){.wf-cloud{scale:.8}}
@media(max-width:620px){.wf-cloud{scale:.65}}
@media(prefers-reduced-motion:reduce){.wf-folder,.wf-shot{transition:none}}
/* Two-row fans retain their hover bridge across the wider top row. */
.wf-folder[data-open] .wf-cloud:before{left:-325px;top:-365px;width:650px;height:390px;clip-path:polygon(0 0,100% 0,76% 100%,24% 100%)}
/* Warm image hover glow, also available to keyboard users. */
.wf-float{transition:scale .25s ease,border-color .25s ease,box-shadow .3s ease}
.wf-shot:hover .wf-float,.wf-shot:focus-visible .wf-float{border-color:#ffa263;box-shadow:0 0 0 1px #ff943e,0 0 16px #ff7b35aa,0 0 38px #ff681b70,0 0 64px #ff681b35,0 16px 30px #0009}
/* Folder lift signals that each work collection can be opened. */
.wf-front strong{color:#fff;text-shadow:0 2px 6px #6f240c88}
.wf-folder:hover,.wf-folder:focus-within,.wf-folder[data-open]{transform:translateY(-18px) scale(1.085)}
.wf-folder:hover .wf-back,.wf-folder:focus-within .wf-back{box-shadow:0 26px 46px #0008,0 0 28px #ff792e55}
.wf-folder:hover .wf-front,.wf-folder:focus-within .wf-front{filter:brightness(1.08)}
.wf-folder{cursor:pointer}
@media(prefers-reduced-motion:reduce){.wf-folder{transition:none}}
/* Phone layout keeps the cards inside the selected folder's own space. */
@media(max-width:620px){
  html,body{max-width:100%;overflow-x:clip}
  .wf-grid{grid-template-columns:1fr;gap:22px;padding:20px 0 28px}
  .wf-grid .wf-lane,.wf-grid:has(.wf-folder[data-open]) .wf-lane,.wf-grid .wf-lane:has(.wf-folder[data-open]){height:175px;transition:height .55s cubic-bezier(.22,1,.36,1)}
  .wf-grid .wf-lane:has(.wf-folder[data-open]){height:470px}
  .wf-grid .wf-lane:has(.wf-folder[data-open] .wf-shot:nth-child(8)){height:580px}
  .wf-folder{width:min(260px,76vw);height:155px}
  .wf-front{padding:23px}
  .wf-front strong{font-size:23px}
  .wf-cloud{scale:.75;transform-origin:top center}
  .wf-shot{width:108px}
  .wf-shot img{height:117px}
  .wf-caption{font-size:10px}
  #work:has(.wf-folder[data-open])>.sec-head,#work:has(.wf-folder[data-open]) .wf-hint{filter:none;opacity:1;pointer-events:auto}
  .wf-folder[data-open] .wf-cloud:before{display:none}
  .wf-folder:hover,.wf-folder:focus-within,.wf-folder[data-open]{transform:translateY(-8px) scale(1.025)}
  .wf-toggle{touch-action:manipulation}
}
@media(max-width:360px){.wf-cloud{scale:.68}.wf-folder{width:min(245px,76vw)}}
@media(prefers-reduced-motion:reduce){.wf-grid .wf-lane,.wf-grid:has(.wf-folder[data-open]) .wf-lane,.wf-grid .wf-lane:has(.wf-folder[data-open]){transition:none}}