/* Services page (mockup 2026-10-05). Builds on /assets/css/event-page.css. */
.sv-list { display: flex; flex-direction: column; gap: 18px; margin-top: 40px; }
.sv-item { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 20px 56px; padding: clamp(26px, 3.4vw, 40px); border-radius: var(--ev-card-radius); background: var(--ev-card); box-shadow: 0 24px 50px -36px rgba(27, 43, 58, .45); }
.sv-item:nth-child(even) { border-radius: 34px 24px 40px 26px; }
.sv-num { display: block; font-family: var(--ev-label); font-size: .875rem; font-weight: 600; letter-spacing: .1em; color: var(--ev-blue); }
.sv-main h3 { margin: 6px 0 12px; font: 700 clamp(1.6rem, 2.6vw, 2.125rem)/1.1 var(--ev-sans); letter-spacing: -.02em; color: var(--ev-ink); }
.sv-main p { margin: 0; font-size: 1.0625rem; line-height: 1.6; color: var(--ev-copy); }
.sv-labels { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.sv-labels li { padding: 6px 12px; border-radius: 999px; background: var(--ev-blue-tint); color: var(--ev-ink); font-family: var(--ev-label); font-size: .9375rem; font-weight: 600; }
.sv-ev { margin: 18px 0 0; padding-top: 16px; border-top: 1px solid var(--ev-rule); font-size: .9875rem; line-height: 1.55; color: var(--ev-copy); }
.sv-ev span { display: block; margin-bottom: 4px; font-family: var(--ev-label); font-size: .8125rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ev-blue); }
.sv-ev a, .sv-main a { color: var(--ev-blue); }
.sv-steps { display: flex; flex-wrap: wrap; gap: 10px; margin: 32px 0 8px; padding: 0; list-style: none; }
.sv-steps li { display: inline-flex; align-items: center; gap: 10px; padding: 9px 16px 9px 10px; border-radius: 999px; background: var(--ev-card); box-shadow: 0 14px 30px -24px rgba(27, 43, 58, .5); font-weight: 600; color: var(--ev-ink); }
.sv-steps li span { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--ev-blue); color: #fff; font-family: var(--ev-label); font-size: .8125rem; }
.sv-practices { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 16px; margin: 36px 0 0; padding: 0; list-style: none; }
.sv-practices li { padding: 22px 22px 24px; border-top: 3px solid var(--ev-blue); background: var(--ev-card); border-radius: 0 0 16px 16px; box-shadow: 0 18px 36px -30px rgba(27, 43, 58, .45); }
.sv-practices h3 { margin: 0 0 8px; font: 600 1.125rem/1.25 var(--ev-sans); color: var(--ev-ink); }
.sv-practices p { margin: 0; font-size: .9875rem; line-height: 1.55; color: var(--ev-copy); }
@media (max-width: 860px) { .sv-item { grid-template-columns: minmax(0, 1fr); } }
.sv-ev .ext, .sv-main .ext { width: .62em; height: .62em; margin-left: 3px; vertical-align: .05em; }
.ev-chapter + .vh + .sv-list { margin-top: 0; }

/* ---------- Hero: animated panel with jump links (2026-10-05 mockup) ---------- */
.sv-hero { display: grid; grid-template-columns: minmax(0, 1fr) 430px; gap: clamp(40px, 5vw, 80px); align-items: center; }
.sv-hero > * { min-width: 0; }
.sv-hero .ab-panel.hero { position: relative; min-height: 400px; margin: 0; padding: 0; }
.sv-hero .hero-enclosure, .sv-hero .hero-depth, .sv-hero .hero-membrane { position: absolute; inset: 0; width: 100%; height: 100%; }
.sv-jump.hero-copy { position: relative; z-index: 2; min-height: 400px; display: flex; flex-direction: column; justify-content: center; margin: 0; padding: 64px clamp(40px, 4.6vw, 64px) 84px; background: transparent; box-shadow: none; border-radius: 0; text-align: left; }
.sv-jump-label { display: block; margin-bottom: 14px; font-family: "Atkinson Hyperlegible Next", system-ui, sans-serif; font-size: .8125rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #b9d4ea; }
.sv-jump ul { list-style: none; margin: 0; padding: 0; }
.sv-jump li { border-top: 1px solid rgba(247, 243, 235, .22); }
.sv-jump li:first-child { border-top: 0; }
.sv-jump a { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 0; color: #f7f3eb; font-size: 1.1875rem; font-weight: 600; text-decoration: none; }
.sv-jump-arrow { transition: transform 200ms cubic-bezier(.22,1,.36,1); color: #b9d4ea; }
.sv-jump a:hover, .sv-jump a:focus-visible { color: #fff; }
.sv-jump a:hover .sv-jump-arrow, .sv-jump a:focus-visible .sv-jump-arrow { transform: translateX(5px); color: #fff; }
.sv-hero .hero-motion-control { top: auto; bottom: 40px; right: 40px; }
html { scroll-behavior: smooth; }
#svc, #practices, #work, #hire { scroll-margin-top: 90px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .sv-jump-arrow { transition: none; } }
@media (max-width: 1179px) {
  .sv-hero { grid-template-columns: minmax(0, 1fr); }
  .sv-hero .ab-panel.hero { width: 100%; max-width: 480px; }
}
@media (max-width: 760px) {
  .sv-hero .ab-panel.hero, .sv-jump.hero-copy { min-height: 0; }
  .sv-jump.hero-copy { padding: 52px 36px 76px; }
  .sv-jump a { font-size: 1.0625rem; padding: 11px 0; }
  .sv-hero .hero-motion-control { bottom: 32px; right: 30px; }
}

/* Eight steps fit on one row at desktop widths */
@media (min-width: 1200px) {
  .sv-steps { gap: 8px; }
  .sv-steps li { gap: 8px; padding: 8px 14px 8px 8px; font-size: .9375rem; }
  .sv-steps li span { width: 24px; height: 24px; font-size: .75rem; }
}

/* Service icons: Clear Box blue tile to the right of each heading (2026-10-05) */
.sv-icon { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 16px 20px 15px 19px; background: var(--ev-blue); color: #fff; }
.sv-icon svg { display: block; width: 30px; height: 30px; }
.sv-main { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 18px; align-items: center; align-content: start; }
.sv-main .sv-icon { grid-column: 2; grid-row: 1; }
.sv-main h3 { grid-column: 1; grid-row: 1; margin: 0; }
.sv-main p { grid-column: 1 / -1; margin-top: 16px; }