/* C2 design – 15-what-we-do. Extracted verbatim from claude-design/c2-website/pages/*.html (lines 589-657). Load order matters: keep the numeric prefix order. */
.intro-p{margin:0;max-width:640px;text-align:left;font-size:clamp(18px,1.7vw,22px);line-height:1.6;font-weight:500;color:#6B6F73}
.wg{position:relative;z-index:0}
.wg-grid{position:relative}
.wg-dots{position:absolute;z-index:-1;top:-40px;bottom:-48px;left:calc(100% - (100% - 40px) / 6);width:100vw;pointer-events:none;background-image:radial-gradient(circle,rgba(0,159,227,0.4) 1.6px,transparent 1.8px);background-size:16px 16px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14%);mask-image:linear-gradient(90deg,transparent 0,#000 14%)}
@media(max-width:900px){.wg-dots{left:50%}}
.wg-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding-top:8px}
.wg-c{position:relative;box-sizing:border-box;padding:32px 32px 36px;background:#F5F5F5;border:0;border-radius:32px;outline:none;cursor:pointer;transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s ease,background .3s ease}
.wg-c:hover,.wg-c:focus-visible{transform:translateY(-8px);background:#FFFFFF;box-shadow:0 22px 44px rgba(15,25,35,.14),0 0 0 1px rgba(0,159,227,.35)}
.wg-c:hover .wg-n{background:#009FE3;border-color:#009FE3;color:#fff}
.wg-c>*{opacity:.55;transition:opacity .35s ease}
.wg-c.on>*,.wg-c:hover>*{opacity:1}
.wg-c:focus-visible{box-shadow:0 0 0 3px #009FE3;border-radius:12px}
.wg-n{display:flex;align-items:center;justify-content:center;width:34px;height:34px;box-sizing:border-box;margin-bottom:28px;border:1px solid #BDBFC2;border-radius:50%;font-size:15px;font-weight:700;color:#0B0D10;transition:background .3s,color .3s,border-color .3s}
.wg-c.on .wg-n{background:#009FE3;border-color:#009FE3;color:#fff}
.wg-c h3{margin:0 0 14px;font-size:clamp(24px,2.3vw,32px);line-height:1.15;font-weight:800;letter-spacing:-.02em;color:#0B0D10}
.wg-c p{margin:0;font-size:18px;line-height:1.5;font-weight:500;color:#6B6F73}
@media(max-width:900px){.wg-grid{grid-template-columns:1fr}.wg-photo{aspect-ratio:16/10}}
@media(prefers-reduced-motion:reduce){.wg-c,.wg-n{transition:none}.wg-c:hover{transform:none}}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.chip{min-height:46px;padding:0 24px;border:0;border-radius:999px;background:#F2F2F2;color:#15171A;font-family:inherit;font-size:15px;font-weight:700;cursor:pointer;transition:background .25s ease,color .25s ease}
.chip:hover{background:#E6E6E6}
.chip:focus-visible{outline:2px solid #15171A;outline-offset:2px}
.chip.on{background:#15171A;color:#FFFFFF}
.wd{max-width:900px;margin:20px auto 0;box-sizing:border-box;padding:0 32px;display:grid;grid-template-columns:1fr 1fr;gap:20px}
.wd{position:relative;z-index:0}
.wd::before{display:none;content:"";position:absolute;z-index:-1;left:0;top:0;bottom:0;width:50%;pointer-events:none;opacity:0.22;filter:blur(40px);background:radial-gradient(circle at 22% 18%,rgba(0,159,227,0.55) 0,rgba(0,159,227,0) 52%),radial-gradient(circle at 70% 62%,rgba(120,215,250,0.6) 0,rgba(120,215,250,0) 55%),radial-gradient(circle at 18% 88%,rgba(64,185,235,0.4) 0,rgba(64,185,235,0) 50%)}
.wd-card{display:grid;border-radius:36px;background:rgba(244,244,244,0.78);border:1px solid rgba(255,255,255,0.9);box-shadow:0 6px 20px rgba(15,25,35,0.05),inset 0 1px 0 rgba(255,255,255,0.95);-webkit-backdrop-filter:blur(26px) saturate(180%);backdrop-filter:blur(26px) saturate(180%);min-height:490px;overflow:hidden}
.wd-slide{grid-area:1/1;display:flex;flex-direction:column;justify-content:space-between;gap:32px;box-sizing:border-box;padding:48px 40px 40px;opacity:0;visibility:hidden;transform:translateY(14px);transition:opacity .5s ease,transform .6s cubic-bezier(.22,1,.36,1),visibility 0s linear .5s}
.wd-slide.on{opacity:1;visibility:visible;transform:none;transition-delay:.12s,.12s,0s}
.wd-slide h3{margin:0 0 22px;font-size:clamp(30px,3.2vw,44px);line-height:1.1;font-weight:800;letter-spacing:-0.02em;color:#0B0D10}
.wd-slide p{margin:0;max-width:440px;font-size:18px;line-height:1.6;font-weight:500;color:#6B6F73}
.wd-btn{display:flex;align-items:center;justify-content:center;gap:10px;min-height:60px;border-radius:999px;background:#0B0D10;color:#FFFFFF;text-decoration:none;font-size:17px;font-weight:700;transition:background .25s ease,transform .25s ease}
.wd-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s cubic-bezier(.22,1,.36,1)}
.wd-btn:hover{background:#009FE3}
.wd-btn:hover svg{transform:translateX(5px)}
.wd-btn:focus-visible{outline:3px solid #009FE3;outline-offset:3px}
.wd-photo{position:relative;border-radius:36px;overflow:hidden;min-height:490px;background:#0B0D10}
.wd-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;opacity:0;transform:scale(1.04);transition:opacity .7s ease,transform 1.2s cubic-bezier(.22,1,.36,1)}
.wd-img.on{opacity:1;transform:scale(1)}
.wd-photo:hover .wd-img.on{transform:scale(1.03)}
.wd-dots{position:relative;width:fit-content;margin:28px auto 0;display:flex;align-items:center;gap:2px;padding:4px 8px;border-radius:999px;background:#F0F0F0}
.wd-dot{width:22px;height:22px;padding:0;border:0;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:999px}
.wd-dot::after{content:"";display:block;width:7px;height:7px;border-radius:999px;background:rgba(21,23,26,0.28);transition:width .35s cubic-bezier(.22,1,.36,1),background .25s ease}
.wd-dot:hover::after{background:rgba(21,23,26,0.6)}
.wd-dot.on{width:34px}
.wd-dot.on::after{width:26px;background:#15171A}
.wd-dot:focus-visible{outline:2px solid #009FE3;outline-offset:1px}
@media(max-width:900px){.wd::before{width:100%}.wd{grid-template-columns:1fr}.wd-card{min-height:440px}.wd-photo{min-height:380px;order:-1}.wd-slide{padding:40px 28px 32px}}
@media(prefers-reduced-motion:reduce){.wd-slide,.wd-img,.wd-btn svg,.wd-dot::after{transition:none}}

.cr-vp{position:relative;overflow:hidden;width:100%;margin-top:40px;padding:12px 0 48px}
.cr-in{display:block}
.cr-track{display:flex;gap:24px;box-sizing:border-box;padding-left:max(32px,calc((100% - 1280px)/2 + 32px));padding-right:32px;transform:translateX(calc(var(--i) * -1 * (min(880px,82vw) + 24px)));transition:transform .8s cubic-bezier(.22,1,.36,1)}
.ccard{position:relative;flex:none;width:min(880px,82vw);height:340px;border-radius:28px;overflow:hidden;background:#0B0D10;box-shadow:0 30px 60px rgba(10,20,30,0.22);opacity:.45;transform:scale(0.97);transition:opacity .6s ease,transform .6s cubic-bezier(.22,1,.36,1),box-shadow .5s ease}
.ccard:not(.on){cursor:pointer}
.ccard:not(.on):hover{opacity:.8;transform:scale(0.985)}
.ccard.on:hover{transform:translateY(-6px);box-shadow:0 40px 72px rgba(10,20,30,0.32)}
.ccard img{transition:transform .9s cubic-bezier(.22,1,.36,1)}
.ccard:hover img{transform:scale(1.06)}
.ccard.on{opacity:1;transform:none}
.ccard img{position:absolute;right:0;top:0;height:100%;width:64%;object-fit:cover;display:block}
.ccard .shade{position:absolute;left:0;top:0;right:0;bottom:0;background:linear-gradient(90deg,#0B0D10 0%,#0B0D10 36%,rgba(11,13,16,0) 66%)}
.ccard .txt{position:absolute;left:44px;top:44px;max-width:min(420px,46%);color:#FFFFFF}
.ccard h3{margin:0 0 14px;font-size:34px;line-height:1.2;font-weight:300}
.ccard h3 strong{font-weight:800}
.ccard p{margin:0;font-size:15px;line-height:1.6;font-weight:600;color:rgba(255,255,255,0.9)}
@media(max-width:700px){.ccard img{width:100%}.ccard .shade{background:linear-gradient(180deg,rgba(11,13,16,0.9) 0%,rgba(11,13,16,0.55) 100%)}.ccard .txt{left:26px;top:26px;max-width:calc(100% - 52px)}.ccard h3{font-size:26px}}
@supports (animation-timeline: view()){@media (prefers-reduced-motion: no-preference){.cr-in{animation:cr-enter linear both;animation-timeline:view();animation-range:entry 0% entry 70%}@keyframes cr-enter{from{opacity:0;transform:translateX(180px)}to{opacity:1;transform:none}}}}
@media(prefers-reduced-motion:reduce){.cr-track,.ccard{transition:none}}
