/* Service-detail headings, reading area and process lists. */
body.is-service-page { background: #070707; }
.service-page { --service-accent: #0cc982; --service-rgb: 12,201,130; min-height: calc(100vh - var(--site-header-height)); min-height: calc(100dvh - var(--site-header-height)); background: #070707; background-blend-mode: normal; color: #eee; }
.service-page[data-kind=exchange] { --service-accent: #eb424c; --service-rgb: 235,66,76; }
.service-page[data-kind=setup] { --service-accent: #f0f0f0; --service-rgb: 240,240,240; }
.service-page .service-main { width: min(1120px,calc(100% - 80px)); padding: 48px 0 72px; }
.service-page .service-panel { min-height: 0; padding: 44px 54px 40px; border: 1px solid rgba(var(--service-rgb),.4); border-radius: 26px; background: #191919; box-shadow: none; }
.service-page .service-panel>.back { display: inline-flex; align-items: center; justify-content: center; position: absolute; top: 28px; right: 28px; width: 42px; height: 42px; border: 1px solid rgba(var(--service-rgb),.35); border-radius: 11px; background: rgba(var(--service-rgb),.06); color: #eee; font: 400 25px/1 Arial,Helvetica,sans-serif; transition: background .2s,border-color .2s; }
.service-page .service-panel>.back:hover { transform: none; border-color: var(--service-accent); background: rgba(var(--service-rgb),.14); }
.service-page .service-heading { display: flex; flex-wrap: nowrap; align-items: center; gap: 30px; margin: 14px 0 36px; padding: 0 52px 32px 0; border-bottom: 1px solid #ffffff16; }
.service-page .service-heading img { width: 108px; height: 134px; object-fit: contain; opacity: .88; }
.service-page .service-heading h1 { min-width: 0; max-width: 100%; color: #f5f5f5; font: 700 clamp(38px,4.2vw,60px)/1.08 Arial,Helvetica,sans-serif; letter-spacing: -.045em; overflow-wrap: anywhere; }
.service-page .service-copy { max-width: 83ch; color: #bcbcbc; font-size: 17px; line-height: 1.7; font-weight: 400; }
.service-page .service-copy p { margin: 0 0 22px; line-height: 1.7; }
.service-page .service-copy>p:first-child { color: #e5e5e5; font-size: 20px; line-height: 1.65; margin-bottom: 28px; }
.service-page .service-copy>p:has(+ul),.service-page .service-copy>p:has(+ol) { margin-top: 32px; margin-bottom: 16px; color: #f0f0f0; font-weight: 600; }
.service-page .service-copy h1,.service-page .service-copy h2,.service-page .service-copy h3,.service-page .service-copy h4,.service-page .service-copy h5 { color: #f0f0f0; font-size: 25px; line-height: 1.25; letter-spacing: -.025em; margin: 32px 0 18px; }
.service-page .service-copy ul { margin: 12px 0 28px; padding-left: 22px; }
.service-page .service-copy ul>li { padding-left: 8px; margin-bottom: 12px; }
.service-page .service-copy ul>li::marker { color: var(--service-accent); }
.service-page .service-copy li p { margin: 0; }
.service-page .service-copy ol { counter-reset: service-step; display: grid; gap: 10px; margin: 12px 0 28px; padding: 0; list-style: none; }
.service-page .service-copy ol>li { counter-increment: service-step; position: relative; margin: 0; padding: 18px 20px 18px 60px; border: 1px solid rgba(var(--service-rgb),.18); border-radius: 12px; background: var(--service-field); }
.service-page .service-copy ol>li::before { content: counter(service-step,decimal-leading-zero); position: absolute; left: 20px; top: 21px; color: var(--service-accent); font: 500 13px/1.5 Arial,Helvetica,sans-serif; }
.service-page .service-panel>.return-link { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; margin: 12px 0 0; padding: 12px 22px; border: 1px solid rgba(var(--service-rgb),.4); border-radius: 11px; background: rgba(var(--service-rgb),.08); color: #eee; font-size: 14px; font-weight: 600; line-height: 1.4; transition: background .2s,border-color .2s; }
.service-page .service-panel>.return-link:hover { background: rgba(var(--service-rgb),.18); border-color: var(--service-accent); }
.service-page a:focus-visible { outline-color: var(--service-accent); }
@media(min-width:1800px) { .service-page .service-main { padding-block: 60px 88px; } .service-page .service-panel { padding: 52px 66px 48px; } }
@media(max-width:900px) {
 .service-page .service-main { width: calc(100% - 48px); padding: 32px 0 48px; }
 .service-page .service-panel { padding: 36px; }
 .service-page .service-heading { gap: 24px; }
 .service-page .service-heading h1 { font-size: 46px; }
 .service-page .service-heading img { width: 90px; height: 116px; }
 .service-page .service-copy { font-size: 16px; }
 .service-page .service-copy>p:first-child { font-size: 19px; }
}
@media(max-width:650px) {
 .service-page .service-main { width: calc(100% - 36px); padding: 24px 0 40px; }
 .service-page .service-panel { padding: 24px 22px; border-radius: 23px; }
 .service-page .service-panel>.back { top: 18px; right: 18px; width: 36px; height: 36px; font-size: 22px; border-radius: 9px; }
 .service-page .service-heading { flex-wrap: wrap; gap: 18px; margin: 16px 0 26px; padding: 0 0 26px; }
 .service-page .service-heading img { width: 68px; height: 84px; margin-right: 40px; }
 .service-page .service-heading h1 { flex: 1 1 100%; font-size: clamp(34px,8vw,45px); }
 .service-page .service-copy { font-size: 15px; line-height: 1.7; }
 .service-page .service-copy>p:first-child { font-size: 17px; }
 .service-page .service-copy p { margin-bottom: 20px; }
 .service-page .service-copy ol>li { padding: 16px 14px 16px 49px; }
 .service-page .service-copy ol>li::before { left: 15px; top: 19px; font-size: 12px; }
 .service-page .service-panel>.return-link { width: 100%; min-height: 46px; }
}
@media(max-width:350px) { .service-page .service-panel { padding-inline: 18px; } .service-page .service-heading h1 { font-size: 32px; } }
@media(prefers-reduced-motion:reduce) { .service-page .back,.service-page .return-link { transition: none; } }
@media print {
 body.is-service-page,.service-page,.service-page .service-panel { background: #fff; color: #111; }
 .service-page { --service-accent: #111; --service-rgb: 17,17,17; }
 .service-page .service-main { width: 100%; padding: 0; }
 .service-page .service-panel { padding: 0; border: 0; }
 .service-page .service-copy,.service-page .service-copy p,.service-page .service-copy>p:first-child,.service-page .service-heading h1 { color: #111; }
 .service-page .service-heading { border-bottom-color: #ddd; }
 .service-page .service-panel>.back,.service-page .service-panel>.return-link,.service-page .service-heading img { display: none; }
}
