/* Client showcase only. Client screenshots retain their original branding. */
#services.services-synthwave { font-size: 16px; background: radial-gradient(ellipse at top right, #001b5f 0, transparent 65%), #030b21; }
#services.services-synthwave .section-heading { max-width: none; margin: 0 0 1.75rem; }
#services.services-synthwave .section-heading h2 { font-size: clamp(2.2rem, 4.8vw, 4.5rem); line-height: 1; margin: 0; }
#services.services-synthwave .services-heading-accent { color: #a8dfff; }
#services.services-synthwave .client-tabs { display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: clamp(2.5rem, 5vw, 4.5rem); }
#services.services-synthwave .client-tabs button { min-height: 48px; padding: .7rem 1.5rem; font: inherit; font-weight: 700; background: #030b2180; color: #e3f3ff; border: 1px solid #c4e7ff; border-radius: 6px; box-shadow: inset 0 0 8px #1685ff15; transition: background .2s, box-shadow .2s, border-color .2s; }
#services.services-synthwave .client-tabs button:is([aria-selected="true"], :hover) { color: #fff; background: linear-gradient(135deg, #0876ed, #003d9f); border-color: #d7f7ff; box-shadow: 0 0 5px #fff, 0 0 18px #1685ff, inset 0 0 12px #75dfff80; }
#services.services-synthwave :is(button, a, summary, [tabindex]):focus-visible { outline: 3px solid #75dfff; outline-offset: 4px; }
#services.services-synthwave .client-panel { display: grid; grid-template-columns: minmax(0, 42fr) minmax(0, 58fr); gap: clamp(2rem, 4vw, 4rem); padding: 0; border: 0; background: transparent; box-shadow: none; align-items: center; }
#services.services-synthwave .client-panel > div { min-width: 0; }
#services.services-synthwave .client-copy { align-self: center; }
#services.services-synthwave p { font-size: 1rem; line-height: 1.65; color: #d2e8ff; margin-bottom: 1rem; }
#services.services-synthwave .client-category { color: #75dfff; text-transform: uppercase; font-weight: 700; letter-spacing: .24em; }
#services.services-synthwave h3 { font-family: "Bebas Neue", sans-serif; font-size: clamp(2.5rem, 4.2vw, 4rem); line-height: 1.05; margin: 0 0 1rem; color: #fff; }
#services.services-synthwave #client-description { max-width: 30rem; font-size: clamp(1.05rem, 1.5vw, 1.25rem); }
#services.services-synthwave .client-name { color: #fff; font-weight: 800; margin-top: 1.5rem; margin-bottom: .65rem; }
#services.services-synthwave .client-features { display: flex; flex-wrap: wrap; gap: .5rem; padding: 0; margin-bottom: 1.5rem; list-style: none; }
#services.services-synthwave .client-features li { color: #e3f3ff; border: 1px solid #c4e7ff; border-radius: 5px; background: #030b2160; padding: .5rem 1.15rem; }
#services.services-synthwave .client-pricing { display: inline-flex; gap: 1rem; align-items: center; min-height: 48px; padding: .8rem 1.6rem; color: #fff; background: linear-gradient(135deg, #0876ed, #003d9f); border: 1px solid #d7f7ff; border-radius: 7px; box-shadow: 0 0 5px #fff, 0 0 20px #1685ff, inset 0 0 12px #75dfff80; font-weight: 800; text-decoration: none; transition: background .2s, box-shadow .2s; }
#services.services-synthwave .client-pricing:is(:hover, :focus-visible) { color: #001b5f; background: #b9edff; }

#services .service-page-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-top: 1.5rem; }
#services .service-page-links a { display: grid; gap: .35rem; min-height: 100%; padding: 1.1rem; border: 1px solid #75dfff; border-radius: 7px; background: #06142ecc; color: #fff; text-decoration: none; }
#services .service-page-links a:is(:hover, :focus-visible) { background: #0a2b59; box-shadow: 0 0 16px #1685ff70; }
#services .service-page-links span { color: #c1d6ed; line-height: 1.5; }
.portfolio-static-summaries { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.portfolio-static-summaries article { padding: 1rem; border: 1px solid #439dff70; background: #06142e; }
.portfolio-static-summaries h3 { color: #fff; }
.portfolio-static-summaries p { color: #c1d6ed; }
@media (max-width: 767.98px) {
    #services .service-page-links, .portfolio-static-summaries { grid-template-columns: 1fr; }
}
#services.services-synthwave .client-preview { perspective: 1200px; }
#services.services-synthwave .client-browser { border: 2px solid #c6f6ff; border-radius: 18px; overflow: hidden; box-shadow: 0 0 5px #fff, 0 0 22px #1685ffb0, 0 20px 40px #001b5f80, inset 0 0 12px #75dfff; background: #030b21; transform: rotateY(-5deg) rotateZ(-1deg); animation: client-display-float 7s ease-in-out infinite; }
#services.services-synthwave .client-browser:is(:hover, :focus-within) { animation-play-state: paused; }
#services.services-synthwave .client-browser-bar { display: flex; gap: .85rem; align-items: center; padding: .65rem .9rem; border-bottom: 1px solid #75dfff; color: #e3f3ff; background: linear-gradient(110deg, #75dfff, #1266bd 65%, #003d9f); }
#services.services-synthwave #client-domain { overflow-wrap: anywhere; min-width: 0; flex: 1; border: 1px solid #b9edff90; border-radius: 8px; padding: .2rem .65rem; background: #030b2130; font-size: .8rem; }
#services.services-synthwave .client-browser-dots { display: flex; gap: .3rem; flex-shrink: 0; }
#services.services-synthwave .client-browser-dots i { display: block; width: .5rem; height: .5rem; border-radius: 50%; background: #75dfff; }
#services.services-synthwave .client-browser-dots i:nth-child(2) { background: #439dff; }
#services.services-synthwave .client-browser-dots i:nth-child(3) { background: #3574b6; }
#services.services-synthwave .client-screenshot-region { max-height: 28rem; overflow-y: auto; overscroll-behavior-y: contain; scrollbar-color: #439dff #030b21; }
#services.services-synthwave .client-screenshot-region img { display: block; width: 100%; height: auto; }
#services.services-synthwave .client-preview-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; padding-top: .75rem; color: #a8dfff; }
#services.services-synthwave .client-preview-footer a { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; color: #75dfff; font-weight: 800; text-underline-offset: .25em; }
#services.services-synthwave .client-preview-footer a:is(:hover, :focus-visible) { color: #fff; }
#services.services-synthwave .client-scope { margin-top: 1.5rem; }
#services.services-synthwave .client-scope > p { color: #a8dfff; margin-bottom: .3rem; }
#services.services-synthwave summary { cursor: pointer; min-height: 44px; padding: .6rem 0; color: #75dfff; font-weight: 800; width: fit-content; }
#services.services-synthwave details p { max-width: 70rem; }
@keyframes client-display-float {
    0%, 100% { transform: translateY(0) rotateY(-5deg) rotateZ(-1deg); }
    50% { transform: translateY(-8px) rotateY(-3deg) rotateZ(-.5deg); }
}
@media (max-width: 767.98px) {
    #services.services-synthwave .client-panel { grid-template-columns: 1fr; gap: 2.5rem; }
    #services.services-synthwave .client-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #services.services-synthwave .client-tabs button { padding-inline: .5rem; }
    #services.services-synthwave .client-preview { padding: 0 .25rem; }
    #services.services-synthwave .client-browser { transform: none; animation-name: client-display-float-mobile; }
}
@keyframes client-display-float-mobile {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}
@media (prefers-reduced-motion: reduce) { #services.services-synthwave * { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }