/* Service detail only. Shared brand components retain their approved styles. */
.service-detail { background: #f8f9ff; color: #080e2c; }
.service-detail__inner.container { width: min(80rem,89%); }
.service-detail__hero { overflow: hidden; padding: 1.5rem 0 2.75rem; color: #f7f9ff; background: radial-gradient(ellipse at 85% 40%,#382274 0,transparent 48%),radial-gradient(ellipse at 60% 100%,#073763,transparent 55%),#030b23; }
.service-detail__hero--light { color: #080e2c; background: radial-gradient(ellipse at 88% 60%,#c3d8ff,transparent 60%),linear-gradient(110deg,#fff,#f1efff); }
.service-detail__breadcrumbs { display: flex; flex-wrap: wrap; gap: .65rem; margin-bottom: 2rem; font-size: .75rem; opacity: .8; }
.service-detail__breadcrumbs a { text-decoration: none; }
.service-detail__breadcrumbs a:hover { text-decoration: underline; }
.service-detail__hero-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: 3rem; align-items: center; }
.service-detail__eyebrow { margin: 0 0 1rem; color: #9bcfff; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }
.service-detail__hero--light .service-detail__eyebrow { color: #5a43cc; }
.service-detail h1 { margin: 0; font-size: clamp(2.5rem,4.2vw,4rem); line-height: 1.03; font-weight: 800; letter-spacing: -.045em; }
.service-detail__gradient { display: block; color: #69cfff; background: linear-gradient(105deg,#21d7f4,#65a5ff 48%,#bc77ff); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.service-detail__hero--light .service-detail__gradient { background-image: linear-gradient(100deg,#0084b4,#235ce4 45%,#7733ce); }
.service-detail__hero-copy > p:not(.service-detail__eyebrow) { max-width: 54ch; margin: 1.25rem 0 1.75rem; color: #d3dcf3; font-size: 1rem; line-height: 1.65; }
.service-detail__hero--light .service-detail__hero-copy > p:not(.service-detail__eyebrow) { color: #39416b; }
.service-detail__actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.service-detail__button { display: inline-flex; align-items: center; justify-content: center; gap: 1.25rem; min-height: 3rem; padding: .65rem 1.3rem; border: 1px solid #8176ef; border-radius: 3rem; background: linear-gradient(105deg,#137dc6,#6339cd); color: #fff; font: inherit; font-size: .875rem; font-weight: 650; text-decoration: none; cursor: pointer; }
.service-detail__button:hover { border-color: #bcefff; }
.service-detail__button--outline { background: transparent; border-color: #737baf; }
.service-detail__hero--light .service-detail__button--outline { color: #292051; }
.service-detail__button--light { background: #f4f6ff; color: #30216e; border-color: #d9d7ff; }
.service-detail__button:disabled { opacity: .7; cursor: default; }
.service-detail__hero-art { position: relative; min-width: 0; margin: 0; aspect-ratio: 600/430; display: grid; align-items: center; }
.service-detail__hero-art > svg { display: block; width: 100%; height: auto; }
.service-detail__hero-art > img { display: block; width: 100%; height: auto; border: 1px solid #7283c4; border-radius: 1.25rem; box-shadow: 0 20px 45px #01051b55; }
.service-detail__hero-art figcaption { position: absolute; bottom: 0; right: 0; font-size: .6875rem; color: #c5d0ec; }
.service-detail__hero--light .service-detail__hero-art figcaption { color: #465475; }
.service-detail__body { padding-block: 3rem; display: grid; gap: 3.25rem; }
.service-detail__body section { scroll-margin-top: 1.5rem; min-width: 0; }
.service-detail__section-heading { margin-bottom: 1.3rem; }
.service-detail h2 { margin: 0; font-size: clamp(1.5rem,2.2vw,2rem); line-height: 1.15; font-weight: 800; letter-spacing: -.035em; }
.service-detail__section-heading p { margin: .5rem 0 0; color: #505a7d; font-size: .9375rem; }
.service-detail__capabilities { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.service-detail__capabilities li { padding: 1.5rem 1.25rem; border: 1px solid #e1e5fb; border-radius: .9rem; background: #fff; text-align: center; box-shadow: 0 4px 14px #30306706; }
.service-detail__capabilities svg { display: block; width: 3rem; height: 3rem; margin: 0 auto 1rem; }
.service-detail h3 { margin: 0; font-size: 1rem; font-weight: 750; line-height: 1.3; }
.service-detail__capabilities p,.service-detail__process li p,.service-detail__work-card p { margin: .5rem 0 0; color: #505a7d; font-size: .8125rem; line-height: 1.55; }
.service-detail__process ol { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1.5rem; margin: 0; padding: 0; list-style: none; }
.service-detail__process li { position: relative; padding: 0 1.5rem 1rem 0; border-bottom: 1px solid #dce1f5; }
.service-detail__process li:not(:last-child)::after { content: '→'; position: absolute; right: -.35rem; top: 1rem; color: #6760c5; }
.service-detail__step-number { display: block; margin-bottom: .5rem; color: #1b75c8; font-size: 1.625rem; line-height: 1.1; font-weight: 750; }
.service-detail__work-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.25rem; }
.service-detail__work-card { min-width: 0; margin: 0; }
.service-detail__work-art { display: grid; place-items: center; aspect-ratio: 16/10; overflow: hidden; border: 1px solid #27345e; border-radius: .9rem; background: radial-gradient(ellipse at top right,#273a79,transparent 65%),#050c23; }
.service-detail__work-art--1 { background: radial-gradient(ellipse at bottom left,#38458e,transparent 70%),#081333; }
.service-detail__work-art--2 { background: radial-gradient(ellipse at top,#493075,transparent 70%),#040b20; }
.service-detail__work-art svg { display: block; width: 92%; height: 100%; }
.service-detail__work-art img { display: block; width: 100%; height: auto; }
.service-detail__work-card figcaption { padding: .85rem .15rem 0; }
.service-detail__work-card figcaption > span { display: block; margin-bottom: .25rem; color: #6356a2; font-size: .6875rem; text-transform: uppercase; letter-spacing: .08em; }
.service-detail__faq details { margin-bottom: .65rem; border: 1px solid #dfe3f7; border-radius: .65rem; background: #fbfcff; }
.service-detail__faq summary { position: relative; padding: 1rem 3rem 1rem 1.1rem; cursor: pointer; font-size: .9375rem; font-weight: 600; }
.service-detail__faq summary::marker { color: #6550ce; }
.service-detail__faq summary > span { position: absolute; right: 1.2rem; top: .8rem; color: #6350bd; font-size: 1.3rem; }
.service-detail__faq details[open] summary > span { transform: rotate(45deg); }
.service-detail__faq details > p { max-width: 90ch; margin: 0; padding: 0 1.25rem 1.15rem; font-size: .9375rem; line-height: 1.65; color: #424c71; }
.service-detail__closing { position: relative; overflow: hidden; isolation: isolate; padding-block: 3.5rem; background: radial-gradient(ellipse at 90% 70%,#44269f,transparent 60%),#040d2b; color: #fff; }
.service-detail__closing-inner { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.service-detail__closing-inner > div { max-width: 47rem; }
.service-detail__closing h2 { text-wrap: balance; }
.service-detail__closing p { margin: .75rem 0 0; color: #d4dcf1; }
.service-detail__closing .service-detail__button { flex-shrink: 0; }
.service-detail__closing-glass { position: absolute; z-index: -1; pointer-events: none; width: 26rem; max-width: none; height: auto; right: -7rem; top: -6rem; opacity: .5; }
.service-detail__setup { padding-block: 5rem; }
.service-detail :focus-visible { outline: 3px solid #227ef7; outline-offset: 4px; }
@media(max-width:63.99rem) {
 .service-detail__inner.container { width: calc(100% - 3rem); }
 .service-detail__hero-grid { gap: 1.75rem; grid-template-columns: 1fr 1fr; }
 .service-detail h1 { font-size: 2.5rem; }
 .service-detail__capabilities { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .service-detail__process ol { gap: 1rem; }
 .service-detail__work-grid { gap: 1rem; }
 .service-detail__closing-inner { align-items: flex-start; flex-direction: column; }
}
@media(max-width:39.99rem) {
 .service-detail__inner.container { width: calc(100% - 2.5rem); }
 .service-detail__hero { padding-bottom: 2rem; }
 .service-detail__breadcrumbs { margin-bottom: 1.75rem; font-size: .6875rem; }
 .service-detail__hero-grid { grid-template-columns: 1fr; gap: 1.25rem; }
 .service-detail h1 { font-size: 2.5rem; }
 .service-detail__hero-art { max-width: 30rem; width: 100%; margin: auto; }
 .service-detail__body { gap: 2.5rem; padding-block: 2.5rem; }
 .service-detail__capabilities { gap: .75rem; }
 .service-detail__capabilities li { padding: 1rem .75rem; }
 .service-detail__capabilities h3 { font-size: .9375rem; }
 .service-detail__capabilities p { font-size: .8125rem; }
 .service-detail__process ol { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.25rem; }
 .service-detail__process li::after { display: none; }
 .service-detail__work-grid { grid-template-columns: 1fr; gap: 1.5rem; }
 .service-detail__closing { padding-block: 2.5rem; }
 .service-detail__closing-glass { right: -13rem; opacity: .25; }
}
@media(prefers-reduced-motion:reduce) { .service-detail { scroll-behavior: auto; } }
@media(forced-colors:active) { .service-detail__gradient { background: none; -webkit-text-fill-color: currentColor; } }
