/* Service articles share the site's typography, colours, header and footer. */
.service-detail { background:var(--nerivo-ink); color:var(--color-text); }
.service-detail .header { position:sticky; top:0; z-index:1000; }
.service-detail main { padding-top:0; overflow-wrap:break-word; }
.service-detail { isolation:isolate; }
.service-detail main { position:relative; z-index:1; }
.service-detail .service-hero { position:relative; padding:36px 0 64px; border-bottom:1px solid var(--nerivo-line); background:transparent; }
.service-detail .service-page-media { position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; background:#0b111d; }
.service-detail .service-page-media img,.service-detail .service-page-media video { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.service-detail .service-page-media video { opacity:0; transition:opacity 600ms ease; }
.service-detail .service-page-media.is-playing video { opacity:1; }
.service-detail .service-page-media::after { position:absolute; inset:0; content:''; background:linear-gradient(100deg,rgba(5,12,23,.76),rgba(5,12,23,.53) 65%,rgba(5,12,23,.66)); }
.service-detail .footer { position:relative; z-index:1; background:rgba(7,16,29,.76); }
@media(prefers-reduced-motion:reduce) { .service-detail .service-page-media video { display:none; transition:none; } }
.service-detail .breadcrumbs { margin-bottom:40px; }
.service-detail .breadcrumbs ol { display:flex; flex-wrap:wrap; gap:8px 12px; margin:0; padding:0; list-style:none; color:var(--color-text-secondary); font-size:13px; line-height:1.6; }
.service-detail .breadcrumbs li+li::before { content:'/'; margin-right:12px; color:#6d8ba3; }
.service-detail .breadcrumbs a { color:var(--nerivo-signal); text-decoration:underline; text-underline-offset:4px; }
.service-detail .service-eyebrow { font:11px/1.6 var(--font-family-mono); letter-spacing:.1em; color:var(--nerivo-signal); margin:0 0 20px; }
.service-detail h1 { max-width:1050px; font-size:clamp(36px,4.6vw,68px); line-height:1.08; font-weight:600; letter-spacing:-.035em; text-wrap:balance; margin:0 0 24px; }
.service-detail .service-lead { max-width:760px; font-size:clamp(17px,1.6vw,21px); line-height:1.65; color:#d4dfeb; margin:0 0 24px; }
.service-detail .service-location { max-width:760px; color:var(--color-text-secondary); font-size:14px; line-height:1.7; margin:22px 0 0; }
.service-detail .service-actions { display:flex; flex-wrap:wrap; align-items:center; gap:18px 26px; }
.service-detail .service-actions .btn { white-space:normal; text-align:center; line-height:1.4; min-height:48px; }
.service-detail .service-layout { display:grid; grid-template-columns:240px minmax(0,1fr); gap:clamp(32px,5vw,80px); padding-top:60px; padding-bottom:72px; align-items:start; }
.service-detail .service-toc { position:sticky; top:calc(var(--header-height) + 24px); border:1px solid var(--nerivo-line-strong); padding:20px; border-radius:8px; background:rgba(7,17,30,.78); }
.service-detail .service-toc p { margin:0 0 16px; font-size:13px; color:var(--color-text-secondary); }
.service-detail .service-toc ol { padding-left:20px; margin:0; list-style:decimal; }
.service-detail .service-toc li { padding:5px 0 5px 5px; font-size:14px; line-height:1.6; color:#9db1c5; }
.service-detail a { text-underline-offset:4px; }
.service-detail .service-toc a { color:#dbe8f2; }
.service-detail .service-article { min-width:0; max-width:780px; }
.service-detail .service-article>nav { padding:24px 28px; border:1px solid var(--nerivo-line); border-radius:8px; background:rgba(7,17,30,.74); }
.service-detail .service-article section { margin-bottom:28px; padding:28px; border:1px solid var(--nerivo-line); border-radius:8px; background:rgba(7,17,30,.74); scroll-margin-top:calc(var(--header-height) + 24px); }
.service-detail h2 { font-size:clamp(25px,2.4vw,36px); font-weight:550; line-height:1.22; letter-spacing:-.025em; margin:0 0 20px; color:#f2f6fa; text-wrap:balance; }
.service-detail h3 { margin:24px 0 10px; font-size:19px; line-height:1.4; color:#deedf7; }
.service-detail .service-article p,.service-detail .service-article li { font-size:16px; line-height:1.8; color:#bfccda; }
.service-detail .service-article p { margin:0 0 18px; }
.service-detail .service-article ul,.service-detail .service-article ol { padding-left:23px; margin:16px 0 24px; }
.service-detail .service-article ul { list-style:disc; }
.service-detail .service-article ol { list-style:decimal; }
.service-detail .service-article li { padding:4px 0 4px 5px; }
.service-detail .service-example { padding:22px 24px; border-left:2px solid var(--nerivo-signal); background:rgba(17,35,52,.66); margin:24px 0; }
.service-detail .service-example p:last-child { margin-bottom:0; }
.service-detail .service-example strong { color:#e5f3fc; }
.service-detail .scope-columns { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.service-detail .scope-columns>div { min-width:0; }
.service-detail .service-faq details { padding:20px 0; border-top:1px solid var(--nerivo-line); }
.service-detail .service-faq summary { cursor:pointer; color:#edf6fc; font-size:17px; line-height:1.6; padding-right:12px; }
.service-detail .service-faq details p { padding-top:14px; margin-bottom:0; }
.service-detail .service-concept { display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:start; }
.service-detail .service-concept img { display:block; width:100%; height:auto; border:1px solid var(--nerivo-line); border-radius:8px; }
.service-detail .service-article .content-link,.service-detail .service-actions .content-link { color:var(--nerivo-signal); }
.service-detail .service-article .service-cta { background:rgba(17,44,62,.83); border:1px solid var(--nerivo-line-strong); border-radius:8px; padding:32px; }
.service-detail .service-cta p { max-width:62ch; }
.service-detail a:focus-visible,.service-detail summary:focus-visible { outline:2px solid var(--nerivo-signal); outline-offset:5px; }
@media(max-width:1000px) { .service-detail .service-layout { grid-template-columns:190px minmax(0,1fr); gap:32px; } .service-detail .scope-columns,.service-detail .service-concept { grid-template-columns:1fr; gap:8px; } }
@media(max-width:767px) { .service-detail .service-hero { padding:28px 0 40px; } .service-detail .breadcrumbs { margin-bottom:28px; } .service-detail .service-layout { display:block; padding-top:32px; padding-bottom:44px; } .service-detail .service-toc { position:static; margin-bottom:40px; } .service-detail .service-toc ol { display:grid; grid-template-columns:1fr 1fr; gap:0 18px; } .service-detail .service-toc li { font-size:13px; } .service-detail .service-article section { margin-bottom:24px; padding:22px 18px; } .service-detail .service-article .service-cta { padding:24px 20px; } .service-detail .service-example { padding:18px; } .service-detail .service-actions { align-items:stretch; } .service-detail .service-actions .btn { width:100%; } }
@media(max-width:359px) { .service-detail h1 { font-size:33px; } .service-detail .service-toc ol { grid-template-columns:1fr; } }
