/* Figma 99:635 and 99:702. Content-only selectors preserve the existing hero. */
.wf-components .wufu-case-heading > p { max-width: 861px; }
.wf-components__columns { display: grid; grid-template-columns: 552fr 650fr 512fr; align-items: start; gap: 44px; margin-top: clamp(32px,3.2vw,62px); }
.wf-components__columns article { min-width: 0; }
.wf-components__columns h3 { display: flex; align-items: baseline; gap: 10px; margin: 0 0 18px; color: #fff; font-family: "PingFang SC","Microsoft YaHei",sans-serif; font-size: clamp(16px,1.46vw,28px); font-weight: 600; line-height: 1.35; letter-spacing: 0; }
.wf-components__columns figure { min-width: 0; margin: 0; }
.wf-components__columns img { display: block; max-width: 100%; height: auto; }
.wf-components__columns figcaption { color: rgba(244,247,242,.52); font-family: "PingFang SC","Microsoft YaHei",sans-serif; font-size: 16px; font-weight: 400; line-height: 1.4; }
.wf-components__description { margin: 0 0 21px; color: rgba(244,247,242,.52); font-family: "PingFang SC","Microsoft YaHei",sans-serif; font-size: 16px; font-weight: 400; line-height: 1.45; }
.wf-components__core-grid { container-type: inline-size; display: grid; grid-template-columns: 266fr 265fr; gap: 28px; }
.wf-components__sample > figcaption { margin: 0 0 2.54cqw; }
.wf-components__top > img { width: 95.86%; aspect-ratio: 255 / 101; object-fit: cover; border-radius: 11px; }
.wf-components__lettering-stage { position: relative; width: 96.23%; aspect-ratio: 255 / 113; overflow: hidden; border-radius: 11px; }
.wf-components__lettering-stage > img { width: 100%; height: 100%; object-fit: cover; }
.wf-components__lettering-crop { position: absolute; left: 7.06%; top: 0; width: 87.45%; height: 100%; overflow: hidden; mix-blend-mode: screen; }
.wf-components__lettering-crop img { position: absolute; left: 0; top: -13%; width: 100%; height: 112.73%; max-width: none; }
.wf-components__opening { margin-top: 5.25cqw !important; }
.wf-components__opening-phones { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 3.57%; padding-inline: 1.88%; }
.wf-components__opening-phones img { width: 100%; aspect-ratio: 56 / 120; object-fit: cover; }
.wf-components__actions { margin-top: 6.52cqw !important; }
.wf-components__actions > img { width: 100%; aspect-ratio: 266 / 48; object-fit: cover; }
.wf-components__badges { margin-top: 7.07cqw !important; }
.wf-components__badge-row { display: flex; align-items: flex-start; gap: 4.16cqw; padding-left: 1.45cqw; padding-top: 1.26cqw; }
.wf-components__badge-row .wf-components__badge-a { width: 25.94%; aspect-ratio: 69 / 67; }
.wf-components__badge-row .wf-components__badge-b { width: 21.05%; aspect-ratio: 56 / 52; }
.wf-components__badge-row .wf-components__badge-c { width: 16.54%; aspect-ratio: 44 / 40; }
.wf-components__secondary-actions { width: 91.73%; aspect-ratio: 244 / 47; object-fit: cover; margin-top: 4.16cqw; }
.wf-components__comments { margin-top: 3.08cqw !important; }
.wf-components__comment-stage { position: relative; width: 100%; aspect-ratio: 265 / 240; }
.wf-components__comment-stage > img { position: absolute; object-fit: cover; }
.wf-components__comment-a { left: 1.51%; top: 0; width: 50.57%; aspect-ratio: 134 / 48; }
.wf-components__comment-b { position: absolute; left: 54.34%; top: 7.08%; width: 45.66%; height: 12.08%; overflow: hidden; }
.wf-components__comment-b img { position: absolute; left: -.03%; top: 0; width: 100.88%; height: 100%; max-width: none; }
.wf-components__comment-c { left: 0; top: 22.92%; width: 67.93%; aspect-ratio: 180 / 70; }
.wf-components__comment-d { left: 80%; top: 28.75%; width: 12.45%; aspect-ratio: 33 / 35; opacity: .67; }
.wf-components__comment-e { left: 2.64%; top: 59.17%; width: 84.15%; aspect-ratio: 223 / 98; }
.wf-components__guide { margin-top: 7.25cqw !important; }
.wf-components__guide-stage { position: relative; width: 98.49%; aspect-ratio: 261 / 153; }
.wf-components__guide-stage > img { width: 100%; aspect-ratio: 261 / 106; object-fit: cover; }
.wf-components__guide-button { position: absolute; left: 24.9%; top: 68.63%; width: 53.64%; height: 31.37%; overflow: hidden; }
.wf-components__guide-button img { position: absolute; left: -46.28%; top: 0; width: 191.14%; height: 100%; max-width: none; }
.wf-components__venue-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.wf-components__venue-grid img { width: 100%; aspect-ratio: 153 / 331; object-fit: cover; }
.wf-components__venue-grid figcaption { margin-top: 15px; text-align: center; white-space: nowrap; }
.wf-components__state-grid { display: grid; grid-template-columns: 127fr 121fr 122fr 228fr; align-items: end; gap: 12px; margin-top: 34px; }
.wf-components__state-grid > figure > img { width: 100%; height: auto; }
.wf-components__state-grid > figure:nth-child(3) > img { clip-path: inset(0 round 8% / 6.5%); }
.wf-components__state-grid figcaption { margin-top: 16px; text-align: center; white-space: normal; overflow-wrap: anywhere; }
.wf-components__breakdown-stage { position: relative; width: 100%; aspect-ratio: 228 / 158; }
.wf-components__breakdown-stage img { position: absolute; object-fit: cover; }
.wf-components__piece-badge { left: 4.82%; top: 0; width: 29.82%; aspect-ratio: 68 / 30; }
.wf-components__piece-label { left: 6.14%; top: 22.78%; width: 26.75%; aspect-ratio: 61 / 20; }
.wf-components__piece-character { left: 0; top: 38.61%; width: 39.47%; aspect-ratio: 90 / 89; }
.wf-components__piece-background { left: 46.49%; top: 3.16%; width: 53.51%; aspect-ratio: 122 / 153; }
.wf-components__theme-stage { position: relative; width: 100%; aspect-ratio: 512 / 457; }
.wf-components__theme-stage img { position: absolute; object-fit: cover; }
.wf-components__theme-banner { left: 0; top: 0; width: 58.2%; aspect-ratio: 298 / 134; }
.wf-components__theme-card { left: 61.13%; top: 2.19%; width: 38.28%; aspect-ratio: 196 / 211; }
.wf-components__theme-selected { left: 0; top: 32.82%; width: 57.23%; aspect-ratio: 293 / 76; }
.wf-components__theme-task { left: 0; top: 55.36%; width: 99.8%; aspect-ratio: 511 / 204; }
.wf-components__principles { container-type: inline-size; display: flex; align-items: center; min-height: 112px; aspect-ratio: 512 / 150; margin-top: 25px; padding: 18px 27px; border: 1px solid rgba(255,255,255,.09); border-radius: 28px; background: linear-gradient(155deg, #282828 0%, #1d1d1d 48%, #101010 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 22px 45px rgba(0,0,0,.14); }
.wf-components__principles p { display: grid; gap: 6px; margin: 0; color: rgba(244,247,242,.52); font-size: clamp(10px,4.5cqw,18px); line-height: 1.4; }
.wf-components__principles p > span { white-space: nowrap; }
.wf-components__principles strong { color: #f4f7f2; font-weight: 600; }
.wf-ip .wufu-case-heading { margin-bottom: 34px; }
.wf-ip__scroll { overflow-x: auto; scrollbar-width: thin; scrollbar-color: rgba(137,81,255,.6) rgba(255,255,255,.08); -webkit-overflow-scrolling: touch; }
.wf-ip__scroll:focus-visible { outline: 2px solid #8951ff; outline-offset: 6px; }
.wf-ip__gallery { display: grid; grid-template-columns: 112fr 1639fr; gap: 31px; align-items: stretch; min-width: 850px; padding: 0 0 10px 22px; }
.wf-ip__labels { display: grid; grid-template-rows: repeat(3,minmax(0,1fr)); row-gap: 5.24%; padding-block: .76%; }
.wf-ip__labels span { display: flex; align-items: center; justify-content: center; border-radius: 14px; background: linear-gradient(180deg,rgba(255,55,0,.38),rgba(153,33,0,.38)); box-shadow: inset 0 0 11.5px rgba(255,255,255,.3); color: #fff; font-family: "Xiangxiang Display","PingFang SC","Microsoft YaHei",sans-serif; font-size: clamp(20px,2.19vw,42px); line-height: 1.5; letter-spacing: 0; writing-mode: vertical-rl; text-orientation: upright; }
.wf-ip__screens { display: block; width: 100%; height: auto; aspect-ratio: 1639 / 917; object-fit: cover; }
@media (max-width: 1350px) and (min-width: 1001px) {
  .wf-components__columns { gap: 26px; }
  .wf-components__core-grid { gap: 18px; }
  .wf-components__columns h3 { gap: 7px; }
  .wf-components__principles { padding: 12px 16px; }
}
@media (max-width: 1000px) {
  .wf-components__columns { grid-template-columns: 1fr 1.15fr; gap: 42px 30px; }
  .wf-components__columns h3 { font-size: 21px; }
  .wf-components__themes { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: 0 30px; }
  .wf-components__themes h3, .wf-components__themes > .wf-components__description { grid-column: 1 / -1; }
  .wf-components__principles { margin-top: 0; padding: 20px 24px; }
  .wf-ip__gallery { gap: 20px; padding-left: 0; }
}
@media (max-width: 640px) {
  .wf-components__columns { display: flex; flex-direction: column; gap: 42px; margin-top: 32px; }
  .wf-components__columns article { width: 100%; }
  .wf-components__columns h3 { margin-bottom: 16px; font-size: 21px; }
  .wf-components__core-grid { gap: 22px; }
  .wf-components__venue-grid { gap: 6px; }
  .wf-components__venue-grid figcaption { margin-top: 10px; }
  .wf-components__state-grid { gap: 8px; margin-top: 25px; }
  .wf-components__themes { display: block; }
  .wf-components__themes > .wf-components__description { margin-bottom: 20px; }
  .wf-components__principles { margin-top: 24px; }
  .wf-components__principles { padding: 12px 14px; }
  .wf-ip .wufu-case-heading { margin-bottom: 24px; }
  .wf-ip__gallery { min-width: 990px; gap: 20px; }
  .wf-ip__labels span { font-size: 24px; border-radius: 9px; }
}