.service-page { overflow: hidden; }
.service-hero { position: relative; isolation: isolate; overflow: hidden; padding: clamp(70px,10vw,124px) 0; background: #071a36; border-bottom: 1px solid var(--line); }.service-hero-image,.service-hero-overlay { position: absolute; inset: 0; width: 100%; height: 100%; }.service-hero-image { z-index: -2; object-fit: cover; object-position: center; }.service-hero-overlay { z-index: -1; background: linear-gradient(90deg,rgba(5,20,45,.94) 0%,rgba(5,20,45,.83) 40%,rgba(5,20,45,.28) 74%,rgba(5,20,45,.12) 100%); }.service-hero-content { position: relative; }.service-hero :is(h1,.service-intro) { color: #fff; }.service-hero .service-intro { color: #d6e5fb; }
.service-eyebrow,.service-kicker { margin: 0 0 14px; color: var(--section-accent); font-size: .78rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.service-hero h1 { max-width: 850px; margin: 0; font-size: clamp(2.35rem,6vw,4.7rem); letter-spacing: -.055em; }
.service-intro { max-width: 700px; margin: 24px 0 30px; color: var(--muted); font-size: clamp(1.06rem,2vw,1.25rem); line-height: 1.7; }
.service-section { padding: var(--section-space) 0; }.service-soft { background: var(--surface); border-block: 1px solid var(--line); }
.service-split { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: clamp(24px,6vw,80px); }.service-split h2,.service-heading h2,.service-case h2,.service-final h2 { margin: 0; font-size: clamp(1.55rem,3vw,2.25rem); letter-spacing: -.03em; }.service-split > p,.service-heading p,.service-case > p,.service-final p { color: var(--muted); line-height: 1.7; }.service-heading { max-width: 760px; margin-bottom: 28px; }
.service-cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }.service-cards article,.service-case,.service-before-after article { min-width: 0; background: var(--card); border: 1px solid rgba(7,21,54,.07); border-radius: 16px; box-shadow: 0 2px 6px rgba(7,21,54,.035),0 10px 24px rgba(7,21,54,.055); transition: box-shadow .25s ease,transform .25s ease; }.service-cards article,.service-case { padding: 24px; }.service-cards h3 { margin: 0 0 10px; font-size: 1.06rem; }.service-cards p { margin: 0; color: var(--muted); line-height: 1.65; }
.service-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px 32px; margin: 0; padding: 0; list-style: none; }.service-list li { padding: 15px 16px 15px 38px; position: relative; border-bottom: 1px solid var(--line); color: var(--muted); }.service-list li::before { content: ""; position: absolute; left: 12px; top: 23px; width: 10px; height: 10px; border-radius: 99px; background: var(--section-accent); }
.service-page .wrap,.service-page :is(p,li,article,span,strong,h1,h2,h3) { overflow-wrap: normal; word-break: normal; }
.service-page :is(.service-intro,.service-heading p,.service-split > p,.service-case > p,.service-final p,.service-process-content span) { max-width: 72ch; }
.service-diagram { margin: 24px 0 0; padding: 24px; overflow: auto; border: 1px solid var(--line); border-radius: 16px; background: var(--card); color: var(--text); font: 600 clamp(.77rem,1.5vw,1rem)/1.65 ui-monospace,SFMono-Regular,Consolas,monospace; white-space: pre-wrap; }
.service-process { display: grid; grid-template-columns: minmax(280px,.8fr) minmax(0,1.2fr); gap: clamp(32px,6vw,80px); align-items: start; }.service-process-intro { min-width: 0; }.service-process-list { display: grid; width: 100%; min-width: 0; gap: 24px; margin: 0; padding: 0; list-style: none; counter-reset: process; }.service-process-item { counter-increment: process; display: grid; grid-template-columns: 56px minmax(0,1fr); gap: 16px; align-items: start; min-width: 0; }.service-process-item::before { content: counter(process, decimal-leading-zero); display: grid; place-items: center; width: 56px; height: 56px; border-radius: 14px; background: var(--section-tint); border: 1px solid var(--section-track); color: var(--section-accent); font-weight: 800; font-variant-numeric: tabular-nums; }.service-process-content { min-width: 0; padding-top: 2px; }.service-process-content strong,.service-process-content span { display: block; }.service-process-content strong { font-size: 1.06rem; line-height: 1.35; }.service-process-content span { margin-top: 6px; color: var(--muted); line-height: 1.65; }.service-tags { display: flex; flex-wrap: wrap; gap: 10px; }.service-tags span { padding: 9px 13px; border: 1px solid var(--section-track); border-radius: var(--radius-pill); background: var(--card); font-weight: 650; }.service-final { padding: clamp(42px,6vw,70px) 0; background: #081a31; color: #fff; }.service-final .wrap { display: flex; align-items: center; justify-content: space-between; gap: 28px; }.service-final h2 { color: #fff; }.service-final p { max-width: 720px; color: #c7d5e7; }.service-final .btn { flex: 0 0 auto; }
@media(max-width:800px) { .service-split,.service-process { grid-template-columns: 1fr; gap: 22px; }.service-cards { grid-template-columns: repeat(2,minmax(0,1fr)); }.service-final .wrap { align-items: flex-start; flex-direction: column; } }
@media(max-width:560px) { .service-cards,.service-list { grid-template-columns: 1fr; }.service-cards article,.service-case { padding: 20px; }.service-diagram { padding: 16px; font-size: .76rem; }.service-hero { padding-block: 58px; }.service-hero-image { object-position: 64% center; }.service-hero-overlay { background: linear-gradient(90deg,rgba(5,20,45,.95),rgba(5,20,45,.78)); }.service-hero h1 { font-size: clamp(2rem,10vw,2.75rem); } }
.service-statement { max-width: 900px; margin: 40px 0 0; padding-left: 24px; border-left: 3px solid var(--section-accent); font-size: clamp(1.45rem,3vw,2.25rem); line-height: 1.35; }.service-before-after { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }.service-before-after article { padding:26px; }.service-before-after ul { color:var(--muted); line-height:1.7; }.service-consultation { padding:64px 0; text-align:center; background:var(--surface); }.service-consultation p { max-width:720px; margin:16px auto 26px; color:var(--muted); }.service-consultation h2 { font-size:clamp(1.7rem,3vw,2.5rem); }
@media(hover:hover) { .service-cards article:hover,.service-case:hover,.service-before-after article:hover { transform:translateY(-2px); box-shadow:0 4px 10px rgba(7,21,54,.05),0 14px 30px rgba(7,21,54,.08); } }
html[data-theme=dark] .service-cards article,html[data-theme=dark] .service-case,html[data-theme=dark] .service-before-after article { border-color:rgba(255,255,255,.07); box-shadow:0 2px 6px rgba(0,0,0,.20),0 12px 28px rgba(0,0,0,.24); }
@media(hover:hover) { html[data-theme=dark] .service-cards article:hover,html[data-theme=dark] .service-case:hover,html[data-theme=dark] .service-before-after article:hover { box-shadow:0 4px 10px rgba(0,0,0,.25),0 16px 32px rgba(0,0,0,.30); } }
@media(prefers-reduced-motion:reduce) { .service-cards article,.service-case,.service-before-after article { transition:none; } .service-cards article:hover,.service-case:hover,.service-before-after article:hover { transform:none; } }
@media(max-width:560px){.service-before-after{grid-template-columns:1fr}.service-statement{padding-left:18px}}
