.service-article__header { padding: 9rem 0 3.5rem; color: var(--color-white); background: linear-gradient(115deg, #082a45ed, #123b5de8), url('../images/background/back_deepblue.webp') center / cover; border-bottom: 4px solid var(--color-accent); }
.service-breadcrumb { display: flex; flex-wrap: wrap; gap: .65rem; margin: 0; color: var(--color-muted); font-size: .85rem; }
.service-article__breadcrumb { padding-top: 1.25rem; }
.service-breadcrumb a:hover { color: var(--color-text-link); }
.service-article__header .eyebrow { color: var(--color-accent-light); }
.service-article__header h1 { color: white; margin: .8rem 0 1rem; font: 700 clamp(2rem, 4vw, 3.5rem) / 1.35 var(--font-body); }
.service-article__summary { color: #d5e3ed; max-width: 42rem; }
.service-article__points { display: flex; flex-wrap: wrap; gap: .6rem; list-style: none; padding: 0; margin: 1.6rem 0 0; }
.service-article__points li { padding: .35rem .9rem; border: 1px solid #ffffff35; border-radius: 2rem; font-size: .8rem; }
.service-article__layout { display: grid; grid-template-columns: minmax(0, 1fr) 19rem; gap: clamp(2rem, 4vw, 4rem); align-items: start; padding-top: 1.5rem; padding-bottom: 5rem; }
.service-article__body { min-width: 0; }
.service-article__section-title { font-size: 1.3rem; border-left: 3px solid var(--color-accent); padding-left: 1rem; margin: 0 0 2rem; }
.service-article__copy p { margin: 0 0 1.5rem; line-height: 2.05; font-size: 1.05rem; }
.service-article__copy p:last-child { color: var(--color-primary); font-weight: 600; }
.service-article__aside { display: grid; gap: 1.5rem; }
.service-consult { padding: 2rem; background: var(--color-primary-dark); color: white; border-radius: .6rem; }
.service-consult .eyebrow { color: var(--color-accent-light); }
.service-consult h2 { color: white; font: 500 1.65rem / 1.5 var(--font-display); margin: 1rem 0; }
.service-consult p:not(.eyebrow) { font-size: .9rem; color: #d5e3ed; margin-bottom: 1.5rem; }
.service-consult .button { width: 100%; }
.service-related { padding: 1.6rem; border: 1px solid var(--color-border); border-radius: .6rem; background: white; }
.service-related h2 { font-size: 1.05rem; margin: 0 0 1rem; }
.service-related ul { list-style: none; padding: 0; margin: 0; }
.service-related a { display: flex; justify-content: space-between; gap: .5rem; padding: .8rem 0; border-top: 1px solid var(--color-border); font-size: .9rem; }
.service-related a[aria-current], .service-related a:hover { color: var(--color-text-link); }
.service-gallery { margin-top: 3.5rem; padding-top: 2.5rem; border-top: 1px solid var(--color-border); }
.service-gallery h2 { margin: .5rem 0; font: 500 2rem / 1.4 var(--font-display); }
.service-gallery__intro { color: var(--color-muted); font-size: .9rem; margin: 0 0 1.5rem; }
.service-carousel { --gallery-visible: 2; --gallery-gap: 1.25rem; }
.service-carousel__viewport { overflow: hidden; touch-action: pan-y; }
.service-gallery__grid { display: flex; gap: var(--gallery-gap); align-items: start; transition: transform .5s ease; }
.service-gallery__grid.is-resetting { transition: none; }
.service-carousel .service-gallery__item { flex: 0 0 calc((100% - (var(--gallery-visible) - 1) * var(--gallery-gap)) / var(--gallery-visible)); }
.service-gallery__item { margin: 0; min-width: 0; }
.service-gallery__item a { display: block; position: relative; border-radius: 1.5rem; overflow: hidden; background: #e7edf0; }
.service-gallery__item img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.service-gallery__zoom { position: absolute; right: .7rem; bottom: .7rem; width: 2rem; height: 2rem; border-radius: 50%; display: grid; place-items: center; background: var(--color-primary-dark); color: white; }
.service-gallery__item a:hover .service-gallery__zoom { background: var(--color-text-link); }
.service-gallery__item figcaption { padding: .75rem 0; font-size: .85rem; line-height: 1.75; color: var(--color-muted); overflow-wrap: anywhere; }
.service-carousel__controls { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: .75rem; margin-top: .5rem; }
.service-carousel__dots { display: flex; flex-wrap: wrap; justify-content: center; }
.service-carousel__dot { display: grid; place-items: center; width: 1.7rem; height: 2rem; padding: 0; border: 0; background: transparent; cursor: pointer; }
.service-carousel__dot::after { content: ''; width: .65rem; height: .65rem; border-radius: 50%; background: #cdd6de; }
.service-carousel__dot[aria-current="true"]::after { background: var(--color-primary-dark); }
.service-carousel__pause { font: inherit; font-size: .75rem; color: var(--color-primary); background: transparent; border: 1px solid var(--color-border); border-radius: 1rem; padding: .25rem .7rem; cursor: pointer; }
@media (prefers-reduced-motion: reduce) { .service-gallery__grid { transition: none; } }
.service-lightbox { width: min(72rem, 96vw); max-width: 96vw; max-height: 95dvh; border: 1px solid #ffffff40; border-radius: .6rem; padding: 1rem; background: #082a45; color: white; }
.service-lightbox::backdrop { background: #041522ec; }
.service-lightbox__toolbar { display: flex; align-items: center; justify-content: space-between; padding: 0 0 .75rem; }
.service-lightbox button { cursor: pointer; background: #ffffff15; color: white; border: 1px solid #ffffff50; border-radius: .3rem; padding: .5rem .8rem; font: inherit; }
.service-lightbox__stage { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .7rem; align-items: center; }
.service-lightbox__stage img { display: block; max-height: 70dvh; width: 100%; object-fit: contain; }
.service-lightbox > p { text-align: center; margin: .8rem 0 0; font-size: .9rem; }
.service-photo-open { overflow: hidden; }
.service-detail__symbol { display: grid; place-content: center; width: 100%; height: 100%; min-height: 20rem; background: linear-gradient(135deg, #edf4f8e8, #dce7ede8), url('../images/background/back_gray.webp') center / cover; color: var(--color-primary); }
.service-detail__symbol .icon { width: 7rem; height: 7rem; stroke-width: .65; }
@media (max-width: 1000px) { .service-article__layout { grid-template-columns: minmax(0, 1fr) 16rem; gap: 2rem; } .service-consult { padding: 1.4rem; } }
@media (max-width: 767px) {
    .service-article__header { padding: 8rem 0 2.5rem; }
    .service-breadcrumb { font-size: .75rem; }
    .service-article__layout { grid-template-columns: minmax(0, 1fr); padding-top: 1.5rem; padding-bottom: 3rem; }
    .service-article__copy p { font-size: 1rem; }
    .service-carousel { --gallery-visible: 1; --gallery-gap: 1rem; }
    .service-lightbox { padding: .6rem; }
    .service-lightbox__stage { gap: .35rem; }
    .service-lightbox__stage button { padding: .5rem; }
}