/* Three service families retain the portfolio's expanding-panel interaction. */
.acc--services { height: clamp(580px, 48vw, 640px); }
.acc--services .ap-inner { gap: 14px; }
.acc--services .ap-art { background: var(--bg-peach); }
.service-visual { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(10px, 2vw, 24px); padding: 18px; overflow: hidden; }
.service-visual::after { display: none; }
.service-visual img { display: block; width: 100%; height: 100%; min-height: 0; object-fit: contain; object-position: top center; border-radius: 8px; }
.service-visual--ads { background: var(--bg-warm) !important; }
.service-visual--ads img { object-position: center; }
.acc--services .ap-head { color: var(--body); }
.acc--services .ap-v { font-size: clamp(2rem, 3.3vw, 3rem); }
.acc--services .ap-head:focus-visible { outline: 2px solid var(--orange-deep); outline-offset: 6px; border-radius: 2px; }
@media (max-width: 860px) {
  .acc--services { height: auto; }
  .acc--services .ap-inner { gap: 14px; }
  .acc--services .ap-art { height: auto; min-height: 0; aspect-ratio: 4 / 3; flex: none; }
  .acc--services .ap-head { font-size: clamp(11px, 2.6vw, 13px); gap: 10px; }
  .acc--services .ap-head span:first-child { white-space: normal; }
  .service-visual { padding: 12px; gap: 10px; }
  .acc--services h3 { font-size: clamp(1.8rem, 5.5vw, 2.6rem); }
  .acc--services .chips { gap: 6px; }
  .acc--services .chips li { padding: 6px 10px; font-size: 12px; }
}
@media (max-width: 600px) {
  .service-visual { grid-template-columns: 1fr; }
  .service-visual img:nth-child(2) { display: none; }
  .service-visual--cro img, .service-visual--web img { object-fit: cover; }
}
@media (prefers-reduced-motion: reduce) {
  .acc--services .ap, .acc--services .ap-body, .acc--services .ap-v { transition: none; }
}