/* Minimalist service presentation: one paper surface, typographic emphasis. */
body.focus-site.focus-services {
  --services-ink: #181919;
  --services-muted: #686b6c;
  --services-rule: #d9dad6;
  --services-accent: #7040cc;
  --services-anchor-top: calc(var(--header-h) + var(--services-index-height) + 48px);
  background: var(--paper);
  color: var(--services-ink);
}
.focus-services ::selection { background: #e5def5; }
.focus-services .services-intro,
.focus-services .services-index-inner,
.focus-services .service-chapter-inner,
.focus-services .services-outro { max-width: 1520px; }
.focus-services .services-intro h1 { color: var(--services-ink); font-weight: 350; line-height: 1.02; }
.focus-services .services-intro h1 span { color: var(--services-ink); font-weight: 650; }
.focus-services .services-kicker { font-size: 11px; font-weight: 600; letter-spacing: .14em; color: var(--services-muted); }
.focus-services .services-intro-side > p { font-size: 20px; color: var(--services-muted); }
.focus-services .services-explore { font-size: 15px; }
.focus-services .services-intro-foot { font-size: 13px; }
.focus-services .services-index { background: var(--paper); backdrop-filter: none; -webkit-backdrop-filter: none; }
.focus-services .services-index a { font-size: 15px; color: var(--services-muted); }
.focus-services .services-index a::after { background: var(--services-ink); transition: transform .4s var(--ease); }
.focus-services .service-chapter:nth-child(n) { background: var(--paper); }
.focus-services .service-chapter-inner { grid-template-columns: minmax(0, .95fr) minmax(0, 1.1fr); gap: clamp(64px, 7vw, 106px); padding-bottom: 104px; }
.focus-services .service-anchor { min-width: 0; }
.focus-services .service-anchor h2 { color: var(--services-ink); font-size: clamp(46px, 5.35vw, 84px); font-weight: 350; line-height: 1.04; letter-spacing: -.055em; }
.focus-services .service-title-emphasis { font-weight: 650; }
.focus-services [data-service="environment"] .service-anchor h2 { font-size: clamp(34px, 3.9vw, 61px); }
html[lang="hu"] .focus-services .service-anchor h2 { font-size: clamp(32px, 3.65vw, 56px); }
html[lang="hu"] .focus-services [data-service="environment"] .service-anchor h2 { font-size: clamp(29px, 3.1vw, 48px); }
/* The active navigation supplies the focus instead of a duplicate phase title. */
.focus-services.services-enhanced .service-phase { display: none; }
.focus-services.services-enhanced .service-tagline { display: block; }
.focus-services .service-tagline { max-width: none; margin-top: 24px; color: var(--services-muted); font-size: 21px; }
.focus-services .service-stage-nav { max-width: none; margin-top: 42px; }
.focus-services .service-stage-nav a,
.focus-services .service-stage-nav a[aria-current] { display: block; min-height: 0; padding: 11px 0 11px 27px; color: var(--services-muted); font-size: 18px; line-height: 1.45; }
.focus-services .service-stage-nav a::before,
.focus-services .service-stage-nav a[aria-current]::before { content: ''; position: absolute; top: calc(11px + .725em - 3px); left: -2.5px; width: 6px; height: 6px; border-radius: 50%; background: #b1b3b1; }
.focus-services .service-stage-nav a > span { position: relative; }
.focus-services .service-stage-nav a > span::after { content: ''; position: absolute; left: 0; bottom: -7px; width: 32px; height: 1px; background: var(--services-ink); transform: scaleX(0); transform-origin: left; transition: transform .4s var(--ease); }
.focus-services .service-stage-nav a:hover,
.focus-services .service-stage-nav a[aria-current] { color: var(--services-ink); }
.focus-services .service-stage-nav a[aria-current] { font-weight: 650; }
.focus-services .service-stage-nav a[aria-current] > span::after { transform: scaleX(1); }
.focus-services .service-progress { top: 0; bottom: 0; background: var(--services-rule); }
.focus-services .service-progress > span { inset: auto; top: -5px; left: -4.5px; z-index: 1; width: 10px; height: 10px; border-radius: 50%; background: var(--services-accent); transform: translateY(var(--service-marker-y, 24px)); transition: transform .45s var(--ease); }
.focus-services .service-contact { margin-top: 42px; padding-bottom: 8px; font-size: 16px; color: var(--services-ink); }
.focus-services .service-contact span { font-size: 20px; }
.focus-services .service-overview-copy { padding-bottom: 58px; }
.focus-services .service-overview-copy .service-intro-title { max-width: none; font-size: clamp(25px, 2.3vw, 34px); font-weight: 600; line-height: 1.3; color: var(--services-ink); }
.focus-services .service-overview-copy > p + p,
.focus-services .service-step-body > p { color: var(--services-muted); font-size: clamp(18px, 1.45vw, 21px); line-height: 1.65; }
.focus-services .service-step { padding: 50px 0 72px; }
.focus-services .service-step::before { background: var(--services-rule); }
.focus-services .service-step::after { display: none; }
.focus-services .service-step-heading { margin-bottom: 28px; }
.focus-services .service-step h3,
.focus-services .service-step.is-current h3 { color: var(--services-ink); font-size: clamp(34px, 3.15vw, 49px); font-weight: 650; line-height: 1.12; letter-spacing: -.045em; }
.focus-services .step-title-short { position: relative; padding-bottom: 19px; }
.focus-services .step-title-short::after { content: ''; position: absolute; inset: auto auto 0 0; width: 42px; height: 2px; background: var(--services-ink); transform-origin: left; }
.focus-services .step-tagline { margin-top: 20px; color: var(--services-muted); font-size: clamp(19px, 1.65vw, 24px); line-height: 1.45; letter-spacing: -.025em; }
.focus-services .service-step-body > p { margin-bottom: 28px; }
.focus-services .service-step-body li { margin: 0; padding: 15px 0; border-top: 1px solid var(--services-rule); font-size: clamp(18px, 1.45vw, 21px); line-height: 1.5; color: var(--services-muted); }
.focus-services .service-step-body li::before { display: none; }
.focus-services .service-step-body li:last-child { border-bottom: 1px solid var(--services-rule); }
.focus-services .service-step-body strong { font-weight: 650; color: var(--services-ink); }
.focus-services .service-step-body > .service-note { border: 0; padding: 0; margin-top: 24px; font-size: 13px; line-height: 1.7; color: var(--services-muted); }
.focus-services .services-outro h2 { font-weight: 600; }

/* Readable at rest; motion is an optional progressive enhancement. */
.focus-services.services-motion .service-step .step-title-short { opacity: 1; transform: none; transition: none; }
.focus-services.services-motion .service-step-heading,
.focus-services.services-motion .service-step-body { opacity: .45; transform: translateY(9px); transition: opacity .6s ease, transform .7s var(--ease); }
.focus-services.services-motion .service-step-heading.has-entered,
.focus-services.services-motion .service-step-body.has-entered,
.focus-services.services-motion .service-step:focus-within :is(.service-step-heading, .service-step-body) { opacity: 1; transform: none; }
.focus-services.services-motion .step-title-short::after { transform: scaleX(0); transition: transform .7s var(--ease); }
.focus-services.services-motion .has-entered .step-title-short::after,
.focus-services.services-motion .service-step:focus-within .step-title-short::after { transform: scaleX(1); }

@media (max-width: 1100px) {
  .focus-services .service-chapter-inner { column-gap: 55px; }
  .focus-services .services-index a { font-size: 13px; }
  .focus-services .service-stage-nav a { font-size: 16px; }
}
@media (min-width: 801px) and (max-height: 800px) {
  body.focus-site.focus-services { --services-anchor-top: calc(var(--header-h) + var(--services-index-height) + 24px); }
  .focus-services .service-anchor h2 { font-size: clamp(42px, 4.8vw, 69px); }
  .focus-services .service-anchor .services-kicker { margin-bottom: 20px; }
  .focus-services .service-tagline { margin-top: 18px; font-size: 19px; }
  .focus-services .service-stage-nav { margin-top: 28px; }
  .focus-services .service-stage-nav a,
  .focus-services .service-stage-nav a[aria-current] { padding-block: 9px; font-size: 16px; }
  .focus-services .service-stage-nav a::before,
  .focus-services .service-stage-nav a[aria-current]::before { top: calc(9px + .725em - 3px); }
  .focus-services .service-contact { margin-top: 26px; font-size: 15px; }
}
@media (max-width: 800px) {
  .focus-services .service-chapter-inner { grid-template-columns: 1fr; gap: 48px; padding-block: 56px 72px; }
  .focus-services .service-anchor h2 { font-size: 68px; }
  .focus-services [data-service="environment"] .service-anchor h2 { font-size: 54px; }
  .focus-services .service-contact { margin-top: 24px; }
  .focus-services .service-overview-copy { padding-bottom: 42px; }
  .focus-services .service-step { padding-block: 38px 52px; }
  .focus-services .service-step h3 { font-size: 36px; }
  .focus-services .services-intro-side > p { font-size: 17px; }
}
@media (max-width: 520px) {
  .focus-services .service-anchor h2 { font-size: clamp(44px, 13vw, 64px); }
  .focus-services [data-service="environment"] .service-anchor h2 { font-size: clamp(31px, 9.3vw, 46px); }
  html[lang="hu"] .focus-services .service-anchor h2 { font-size: clamp(29px, 8.8vw, 44px); }
  html[lang="hu"] .focus-services [data-service="environment"] .service-anchor h2 { font-size: clamp(26px, 7.8vw, 38px); }
  .focus-services .service-tagline { margin-top: 18px; font-size: 19px; }
  .focus-services .service-overview-copy .service-intro-title { font-size: 25px; }
  .focus-services .service-step h3 { font-size: 31px; }
  .focus-services .step-tagline { font-size: 19px; }
  .focus-services .service-step-body li { padding-block: 14px; }
  .focus-services .services-intro-foot { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .focus-services *, .focus-services *::after { transition: none !important; }
  .focus-services :is(.service-step-heading, .service-step-body) { opacity: 1 !important; transform: none !important; }
  .focus-services .step-title-short::after { transform: none !important; }
}
@media print {
  .focus-services :is(.service-step-heading, .service-step-body) { opacity: 1 !important; transform: none !important; }
  .focus-services .service-step h3 { font-size: 24px; }
  .focus-services .service-step-body li { font-size: 14px; }
  .focus-services .service-title-emphasis { font-weight: 650; }
}
