/* r43: three "Get your free AI prototype" buttons (green, red, black down the page) */
.pc{display:flex;justify-content:center;padding:clamp(28px,4vw,48px) 24px;background:#FAF8F2}
.pc-in{padding:clamp(28px,3.5vw,44px) 24px 0;background:transparent}
.pc-btn{--bg:#6CBF5B;--fg:#0F0F0F;position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:12px;
  min-height:58px;padding:0 1.6rem 0 1.75rem;border-radius:100px;background:var(--bg);color:var(--fg);
  font:700 1.02rem/1 "Work Sans",sans-serif;letter-spacing:-.005em;text-decoration:none;
  box-shadow:0 6px 18px -8px rgba(15,15,15,.45);transition:transform .25s ease,box-shadow .25s ease;
  opacity:0;transform:translateY(14px)}
.pc-btn.is-in{opacity:1;transform:none;transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1),box-shadow .25s ease}
.pc-red{--bg:#A73632;--fg:#fff}.pc-black{--bg:#0F0F0F;--fg:#FAF8F2}
.pc-ar{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.22);transition:transform .3s ease}
.pc-btn:not(.pc-red):not(.pc-black) .pc-ar{background:rgba(15,15,15,.12)}
.pc-ar svg{width:14px;height:14px}
.pc-btn::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent);transform:skewX(-18deg);opacity:0;pointer-events:none}
.pc-btn.is-run .pc-ar{animation:pcNudge 5.5s ease-in-out infinite}
.pc-btn.is-in:hover,.pc-btn.is-in:focus-visible{transform:translateY(-2px);box-shadow:0 10px 24px -10px rgba(15,15,15,.55)}
.pc-btn:hover .pc-ar,.pc-btn:focus-visible .pc-ar{transform:translateX(4px);animation:none}
.pc-btn:hover::after,.pc-btn:focus-visible::after{opacity:1;animation:pcSheen .9s ease forwards}
.pc-btn:focus-visible{outline:3px solid #0F0F0F;outline-offset:3px}.pc-black:focus-visible{outline-color:#6CBF5B}
@keyframes pcNudge{0%,84%,100%{transform:none}90%{transform:translateX(4px)}95%{transform:translateX(0)}}
@keyframes pcSheen{from{left:-40%}to{left:120%}}
@media (max-width:640px){.pc{padding:28px 20px}.pc-in{padding:26px 20px 0}.pc-btn{width:100%;max-width:420px;min-height:56px}}
@media (prefers-reduced-motion:reduce){.pc-btn{transform:none}.pc-btn.is-in{transition:opacity .5s ease}
  .pc-btn.is-run .pc-ar,.pc-btn:hover::after,.pc-btn:focus-visible::after{animation:none}.pc-btn:hover .pc-ar,.pc-btn.is-in:hover{transform:none}}
.pc-btn{white-space:nowrap}
@media (max-width:640px){.pc-btn{font-size:.86rem;letter-spacing:.04em;gap:10px;padding:0 1.1rem 0 1.3rem}}
/* r43b: squarer buttons, no capsule */
.pc-btn{border-radius:7px}.pc-ar{border-radius:4px}
/* r43c: match hero "Build my AI prototype" button shape; no arrow */
.pc-btn{border-radius:10px;min-height:58px;padding:0 22px;font-size:16px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;justify-content:center;gap:0}
.pc-ar{display:none}
@media (max-width:640px){.pc-btn{min-height:58px;padding:0 22px;font-size:16px;letter-spacing:.08em}}
/* r45: Services panels share one grid cell so rotating tabs never changes height (CLS 0) */
#services .cf8-panels{display:grid}
#services .cf8-panels > .cf8-panel{grid-area:1/1;display:grid;align-self:start}
#services .cf8-panels > .cf8-panel:not(.is-active){visibility:hidden;pointer-events:none}
/* r45b: every panel (grey) fills the shared height; card centred in the stage so no dead strip */
#services .cf8-panels > .cf8-panel{align-self:stretch}
#services .cf8-panels > .cf8-panel > .cf8-stage{align-items:center;justify-content:center}
@media (max-width:900px){#services .cf8-panels > .cf8-panel{grid-template-rows:auto 1fr}}
/* r46: on desktop the tabs + whole panel fit one viewport (1280x720, 1366x768, 1440x900). Scales with viewport height; shared-height grid kept (CLS 0). */
@media (min-width:901px){
 #services .cf8-tabs{margin:clamp(1.2rem,3.2svh,2.6rem) 0 clamp(.8rem,2svh,1.4rem)}
 #services .cf8-panel{min-height:0}
 #services .cf8-copy{padding:clamp(1.4rem,4.5svh,3.2rem) clamp(1.6rem,3.4vw,3.2rem);gap:clamp(.7rem,1.8svh,1.1rem)}
 #services .cf8-stage{padding:clamp(1rem,3.4svh,2.6rem) clamp(1.2rem,3vw,2.8rem)}
}
@media (min-width:901px) and (max-height:820px){
 #services .cf8-card{zoom:.86;max-width:500px}
 #services .cf8-copy h3{font-size:1.55rem}
 #services .cf8-copy p{font-size:1rem}
}
@media (min-width:901px) and (max-height:740px){
 #services .cf8-card{zoom:.8}
}
/* r48: service-led intro line under the hero tagline (in the initial layout, so CLS 0; fade only) */
#top .bw-intro{margin:18px auto 0;max-width:36ch;padding:0 20px;font:500 clamp(1rem,1.4vw,1.15rem)/1.5 "Work Sans",Arial,sans-serif;color:#3a3a36;text-align:center;text-wrap:balance;animation:bwIntroIn .8s ease 1.9s both}
@keyframes bwIntroIn{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){#top .bw-intro{animation-duration:.6s;animation-delay:.4s}}