/* ================= XIONGDA case page ================= */
.xd .cb-hero .wrap{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
.xd-hero-img{background:var(--tile);border-radius:var(--r);overflow:hidden;aspect-ratio:3/4;max-width:420px;justify-self:end;width:100%}
.xd-hero-img img{width:100%;height:100%;object-fit:cover;display:block}
[data-theme="dark"] .xd-hero-img{background:none}   /* dark mode: the robot is cut out and sits on the black page, no light box */
/* hero: award logos under the meta (logos exported from Figma, London from the studio logo set) — sized by eye, not to one height */
.xd-awards{margin-top:34px}
.xd-awards>b{display:block;color:var(--ink);font-family:var(--display);font-size:14px;margin-bottom:14px}
.xd-awards .logos{display:flex;flex-wrap:wrap;align-items:center;gap:18px 30px}
.xd-awards img{display:block;width:auto;height:var(--h)}
.xd-awards .rd{--h:58px}.xd-awards .muse{--h:72px}.xd-awards .ny{--h:72px}.xd-awards .ldn{--h:28px}.xd-awards .fr{--h:72px}
/* London: the official Platinum site badge is not in Figma, so the LDA logo + the tier set in the certificate's platinum gradient */
.xd-awards .ldn-plat{display:flex;flex-direction:column;align-items:flex-start;gap:7px}
.xd-awards .ldn-plat .tier{font-family:var(--display);line-height:1}
.xd-awards .ldn-plat .tier b{display:block;font-size:17px;font-weight:800;letter-spacing:.03em;background:linear-gradient(90deg,#a48fd6 0%,#7f8fdc 40%,#5e9fdc 72%,#7cc3e4 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.xd-awards .ldn-plat .tier span{display:block;margin-top:4px;font-size:9.5px;font-weight:600;letter-spacing:.18em;color:var(--ink-2)}
.xd .split{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);gap:clamp(24px,4vw,56px);align-items:center}
.xd .split.flip .txt{order:2}
.xd .split h2{font-size:clamp(26px,3vw,38px);line-height:1.08;margin-bottom:16px}
.xd .split p{color:var(--ink-2);font-size:16px;max-width:52ch;margin:0 0 12px;line-height:1.55}
.xd .split p b{color:var(--ink);font-weight:600}
.xd-board{margin:0;min-width:0}
.xd-board img{width:100%;display:block;border-radius:18px;background:var(--tile);cursor:zoom-in}
.xd-board figcaption{font-size:13px;color:var(--ink-2);margin-top:10px}
.xd-gaps{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}
.xd-gaps div{background:var(--tile);border-radius:14px;padding:14px 16px;font-size:13px;color:var(--ink-2);line-height:1.4}
.xd-gaps b{display:block;font:600 15px var(--display);color:var(--ink);margin-bottom:2px}
.xd-feats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 20px}
.xd-feats figure{margin:0;min-width:0}
.xd-feats img{width:100%;aspect-ratio:10/7;object-fit:cover;display:block;border-radius:18px;background:var(--tile)}
.xd-feats figcaption{padding:14px 4px 0;font-size:14px;color:var(--ink-2);line-height:1.45}
.xd-feats figcaption b{display:block;font:600 18px/1.2 var(--display);letter-spacing:-.015em;color:var(--ink);margin-bottom:6px}
.xd-mats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.xd-mats>div{background:var(--tile);border-radius:18px;padding:18px 18px 20px;font-size:13px;color:var(--ink-2);line-height:1.45}
.xd-mats i{display:block;width:100%;aspect-ratio:2.2;border-radius:12px;margin-bottom:14px;border:1px solid var(--line)}
.xd-mats b{display:block;font:600 16px/1.2 var(--display);letter-spacing:-.01em;color:var(--ink);margin-bottom:6px}
.xd-clients{margin-top:36px;text-align:center}
.xd-clients p{max-width:70ch;margin:0 auto;font-size:15px;line-height:1.6}
@media(max-width:900px){
  .xd .cb-hero .wrap{grid-template-columns:1fr}
  .xd-hero-img{max-width:min(100%,58svh);aspect-ratio:1;justify-self:center}
  .xd .split{grid-template-columns:1fr}
  .xd .split.flip .txt{order:0}
  .xd-feats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .xd-mats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  .xd-awards .logos{gap:14px}
  .xd-awards img{height:calc(var(--h) * .8)}
  .xd-awards .ldn-plat{gap:5px}.xd-awards .ldn-plat .tier b{font-size:14px}.xd-awards .ldn-plat .tier span{font-size:8px}
  .xd-feats{grid-template-columns:1fr}
  .xd-gaps{grid-template-columns:1fr}
}