/* Technology expertise page only; shared navigation and footer stay unchanged. */
.sd-page { --sd-ink: #12243b; --sd-muted: #536278; --sd-blue: #0057d9; --sd-line: #dce6f1; color: var(--sd-ink); background: #fff; font-size: 16px; line-height: 1.75; }
.sd-page .sd-container { width: min(1340px, 100%); padding: 0 28px; margin: 0 auto; }
.sd-page h1, .sd-page h2, .sd-page h3 { color: var(--sd-ink); font-weight: 800; }
.sd-page h1 { font-size: clamp(36px, 4.2vw, 60px); line-height: 1.12; letter-spacing: -2px; margin: 18px 0 24px; }
.sd-page h2 { font-size: clamp(28px, 3vw, 42px); line-height: 1.2; letter-spacing: -1.2px; margin: 12px 0 20px; }
.sd-page h3 { font-size: 20px; line-height: 1.4; margin: 16px 0 12px; }
.sd-page p { font-size: 16px; line-height: 1.8; color: var(--sd-muted); margin: 0 0 20px; }
.sd-page a { color: var(--sd-blue); text-decoration: none; }
.sd-page a:hover { text-decoration: underline; }
.sd-page a:focus-visible, .sd-page button:focus-visible, .sd-page summary:focus-visible { outline: 3px solid #008886; outline-offset: 5px; }
.sd-page [id] { scroll-margin-top: 120px; }
.sd-skip { position: fixed; top: 8px; left: 16px; transform: translateY(-160%); z-index: 1000002; background: #fff; color: #0057d9; padding: 12px 20px; border: 2px solid #0057d9; border-radius: 8px; }
.sd-skip:focus { transform: none; }
.sd-page .sd-section { padding: 88px 0; }
.sd-page .sd-tint { background: #f5f8fc; }
.sd-page .sd-eyebrow { display: inline-block; color: #0057d9; font-size: 12px; letter-spacing: 1.8px; font-weight: 800; text-transform: uppercase; }
.sd-page .sd-heading { display: flex; justify-content: space-between; align-items: end; gap: 40px; margin-bottom: 32px; }
.sd-page .sd-heading > p { max-width: 460px; }
.sd-page .sd-heading h2 { margin-bottom: 0; }
.sd-page .sd-split { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.sd-page .sd-grid { display: grid; gap: 22px; }
.sd-page .sd-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sd-page .sd-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sd-page .sd-actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; margin-top: 28px; }
.sd-page .sd-button { display: inline-flex; justify-content: center; align-items: center; gap: 14px; border: 1px solid #0057d9; border-radius: 9px; padding: 14px 22px; min-height: 52px; background: #0057d9; color: #fff; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; transition: background .2s, transform .2s; }
.sd-page .sd-button:hover { color: #fff; background: #003f9e; text-decoration: none; transform: translateY(-2px); }
.sd-page .sd-button-light { background: #fff; color: #0057d9; }
.sd-page .sd-button-light:hover { background: #edf4ff; color: #003f9e; }
.sd-page .sd-link { font-size: 14px; font-weight: 700; display: inline-flex; align-items: center; gap: 10px; min-height: 44px; }
.sd-page .sd-hero { position: relative; isolation: isolate; overflow: hidden; padding: 70px 0 64px; background: radial-gradient(900px 480px at 85% 18%, #0e5f6b66, transparent 60%), radial-gradient(720px 440px at 8% 92%, #0057d955, transparent 60%), #071e3c; }
.sd-page .sd-hero::after { content: ''; position: absolute; inset: -20%; z-index: 0; pointer-events: none; background: conic-gradient(from 0deg at 70% 28%, transparent 0 68%, #61e7c214 82%, transparent 93%); animation: sd-hero-spin 28s linear infinite; }
.sd-page .sd-hero .sd-container { position: relative; z-index: 1; }
.sd-page .sd-hero h1 { color: #fff; }
.sd-page .sd-hero h1 span { color: #75e7cf; }
.sd-page .sd-hero p { color: #c9daef; font-size: 18px; max-width: 580px; }
.sd-page .sd-hero .sd-eyebrow { color: #8ae9db; }
.sd-page .sd-hero .sd-split { grid-template-columns: 1.15fr 1fr; gap: 30px; }
.sd-page .sd-hero .sd-button { background: #77edcc; color: #062e37; border-color: #77edcc; }
.sd-page .sd-hero .sd-button:hover { background: #a4f4df; }
.sd-page .sd-hero .sd-button-light { background: transparent; color: #fff; border-color: #7191b8; }
.sd-page .sd-hero .sd-button-light:hover { background: #18385c; }
.sd-page .sd-hero a:focus-visible, .sd-page .sd-hero button:focus-visible { outline-color: #a4f4df; }
/* >>> breadcrumb row (shared block, see tools/fix-breadcrumb-css.js) */
/* The trail is <nav class="sd-breadcrumb"><ol><li>..</li></ol></nav>, so the
   FLEX CONTEXT is the inner <ol> - the <li>s are its children. Styling the
   nav instead would lay its single <ol> out as one flex item and leave the
   crumbs stacked vertically. nowrap + flex-start keeps every crumb on ONE
   horizontal line, starting from the left. */
.sd-page .sd-breadcrumb ol {
  display: flex; flex-wrap: nowrap; align-items: center; justify-content: flex-start;
  gap: 10px; margin: 0; padding: 0; list-style: none;
  /* A fixed line-height puts every crumb on the same baseline, so the row
     measures one line tall even when a link and a <span> differ. */
  line-height: 20px;
  color: #b9d0eb;
}
.sd-page .sd-breadcrumb li {
  display: inline-flex; align-items: center; min-width: 0; white-space: nowrap;
}
.sd-page .sd-breadcrumb a { color: #d0e5ff; }
.sd-page .sd-breadcrumb li:last-child { color: #eaf3ff; }
.sd-page .sd-breadcrumb a { text-decoration: none; }
.sd-page .sd-breadcrumb a:hover { text-decoration: underline; }
.sd-page .sd-breadcrumb li + li::before { content: '/'; margin-right: 10px; color: #8ba6c7; }
.sd-page .sd-breadcrumb a:focus-visible { outline: 2px solid #77edcc; outline-offset: 3px; border-radius: 3px; }
/* Horizontal geometry: the trail lines up with the page content gutter
   instead of starting hard against the edge of the banner. */
.sd-page .sd-hero > .sd-breadcrumb {
  width: min(1340px, 100%); margin: 0 auto; padding: 0 28px;
  box-sizing: border-box; background: none; border-radius: 0;
}
/* Overlay: the hero reserves a tall top padding for the fixed header, and
   the trail is pinned into that empty band rather than placed in the flow.
   Left in flow it would push the hero content down and make every banner
   taller than the reference, so the offset is part of the shared look. */
.sd-page .sd-hero > .sd-breadcrumb {
  position: absolute; left: 0; right: 0; top: 96px; z-index: 1;
  font-size: 12px;
  /* A long trail must not wrap onto a second line and grow the overlay. */
  overflow: hidden;
}
@media (max-width: 575px) {
  /* Keep the row to one line by trimming the ancestors, so the current page
     - the part that carries the information - always stays readable. */
  .sd-page .sd-breadcrumb li:not(:last-child) { overflow: hidden; text-overflow: ellipsis; }
  .sd-page .sd-breadcrumb ol { flex-direction: row; }
  .sd-page .sd-hero > .sd-breadcrumb { top: 78px; padding: 0 20px; }
}
/* <<< breadcrumb row */
.sd-page .sd-hero-notes { display: flex; flex-wrap: wrap; gap: 10px 24px; list-style: none; padding: 0; margin: 26px 0 0; color: #d3e2f4; font-size: 12px; }
.sd-page .sd-hero-notes li::before { content: '✓'; color: #77edcc; margin-right: 7px; }

.sd-page .sd-hero-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.sd-page .sd-hero-bg svg { width: 100%; height: 100%; display: block; animation: sd-hero-drift 18s ease-in-out infinite alternate; transform-origin: center; }
.sd-page .sd-art { min-width: 0; }
.sd-page .sd-art > svg { width: 100%; height: auto; display: block; }
.sd-page .sd-art-caption { color: #b9d0eb; font-size: 12px; text-align: center; }
.sd-page .sd-art-caption span { display: inline-block; width: 6px; height: 6px; background: #77edcc; border-radius: 50%; margin-right: 7px; }
.sd-page .sd-motion { display: block; margin: 28px 0 0 auto; background: transparent; border: 1px solid #587b9e; color: #c9daef; font: inherit; font-size: 12px; padding: 8px 14px; border-radius: 6px; min-height: 44px; cursor: pointer; }
.sd-page .sd-motion[hidden] { display: none; }
.sd-page .sd-jump { position: relative; isolation: isolate; overflow: hidden; border-bottom: 1px solid var(--sd-line); background: linear-gradient(112deg, #f5f9ff, #ecf8f3); }
.sd-page .sd-jump::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='720' height='120' viewBox='0 0 720 120'%3E%3Cg fill='none' stroke='%230057d9' stroke-opacity='.12'%3E%3Cpath d='M0 78H180L240 34h240'/%3E%3Ccircle cx='238' cy='34' r='4'/%3E%3Ccircle cx='420' cy='34' r='4'/%3E%3C/g%3E%3C/svg%3E"); background-size: 720px 120px; background-position: 0 center; animation: sd-jump-pan 16s ease-in-out infinite alternate; }
.sd-page .sd-jump .sd-container { position: relative; z-index: 1; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 20px; padding-top: 14px; padding-bottom: 14px; }
.sd-page .sd-jump a { font-size: 13px; color: #344962; font-weight: 700; padding: 12px 0; }
.sd-page .sd-card { padding: 28px; border: 1px solid var(--sd-line); border-radius: 16px; background: #fff; display: flex; flex-direction: column; transition: border-color .2s, box-shadow .2s, transform .2s; }
.sd-page .sd-card:hover { border-color: #9cbedf; box-shadow: 0 16px 38px #153d6710; transform: translateY(-3px); }
.sd-page .sd-card p { font-size: 15px; }
.sd-page .sd-card .sd-link { margin-top: auto; }
.sd-page .sd-icon { display: inline-flex; justify-content: center; align-items: center; width: 48px; height: 48px; border-radius: 12px; background: #eaf2ff; color: #0057d9; font-size: 21px; animation: sd-icon-spin 14s ease-in-out var(--sd-delay, 0ms) infinite alternate; animation-play-state: paused; }
.sd-page .sd-in-view .sd-icon { animation-play-state: running; }
.sd-page .sd-card:nth-child(3n+2) .sd-icon { background: #e6f7f2; color: #007b66; }
.sd-page .sd-card:nth-child(3n+3) .sd-icon { background: #f0ecff; color: #6948bb; }
.sd-page .sd-card-cta { background: #0e3157; border-color: #0e3157; }
.sd-page .sd-card-cta h3 { color: #fff; font-size: 26px; }
.sd-page .sd-card-cta p { color: #cee0f3; }
.sd-page .sd-card-cta .sd-link, .sd-page .sd-card-cta .sd-eyebrow { color: #8bf0d8; }
.sd-page .sd-benefits { list-style: none; padding: 0; margin: 0; }
.sd-page .sd-benefits li { display: grid; grid-template-columns: 42px 1fr; gap: 16px; padding: 18px; border: 1px solid transparent; border-bottom: 1px solid var(--sd-line); border-radius: 12px; }
.sd-page .sd-benefits strong { display: block; margin-bottom: 4px; }
.sd-page .sd-benefits p { font-size: 14px; margin: 0; }
.sd-page .sd-benefits span { color: #0057d9; font-weight: 800; font-size: 14px; padding-top: 2px; }
.sd-page .sd-note { border-left: 3px solid #008a7a; padding: 14px 20px; background: #eff8f5; font-size: 14px; color: #36544f; margin-top: 26px; }
.sd-page .sd-cap-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.sd-page .sd-cap-grid .sd-card { padding: 24px; }
.sd-page .sd-cap-grid h3 { font-size: 18px; }
.sd-page .sd-cap-grid p { font-size: 14px; margin-bottom: 0; }
.sd-page .sd-process { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; counter-reset: steps; }
.sd-page .sd-process li { counter-increment: steps; border-top: 2px solid #b9d2f1; padding-top: 22px; padding-left: 16px; padding-right: 16px; border-left: 1px solid transparent; border-right: 1px solid transparent; border-bottom: 1px solid transparent; border-radius: 0 0 12px 12px; }
.sd-page .sd-process li::before { content: '0' counter(steps) ' →'; color: #0057d9; font-size: 14px; font-weight: 800; }
.sd-page .sd-process p { font-size: 15px; }
.sd-page .sd-process small { display: block; font-size: 12px; color: #00796b; font-weight: 700; }
.sd-page .sd-tech-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; list-style: none; padding: 0; margin: 0; }
.sd-page .sd-tech-grid li { display: flex; align-items: center; gap: 20px; padding: 24px; background: #fff; border: 1px solid var(--sd-line); border-radius: 12px; }
.sd-page .sd-tech-grid img { width: 46px; height: 46px; object-fit: contain; flex-shrink: 0; }
.sd-page .sd-tech-grid strong { display: block; font-size: 17px; }
.sd-page .sd-tech-grid small { display: block; color: #536278; font-size: 12px; }

.sd-page .sd-stack-grid, .sd-page .sd-company-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.sd-page .sd-company-card { padding: 28px; border: 1px solid var(--sd-line); border-radius: 16px; background: #fff; display: flex; flex-direction: column; transition: border-color .2s, box-shadow .2s, transform .2s; }
.sd-page .sd-company-card:hover { border-color: #9cbedf; box-shadow: 0 16px 38px #153d6710; transform: translateY(-3px); }
.sd-page .sd-company-card p { font-size: 15px; }
.sd-page .sd-company-card .sd-link { margin-top: auto; }
.sd-page .sd-company-links { list-style: none; padding: 0; margin: 16px 0 0; display: grid; gap: 6px; }
.sd-page .sd-company-links a { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; padding: 8px 0; }
.sd-page .sd-stack-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }

.sd-page .sd-stack-card { padding: 28px; border: 1px solid var(--sd-line); border-radius: 16px; background: #fff; transition: border-color .2s, box-shadow .2s, transform .2s; }
.sd-page .sd-stack-card:hover { border-color: #9cbedf; box-shadow: 0 16px 38px #153d6710; transform: translateY(-3px); }
.sd-page .sd-stack-card h3 { display: flex; align-items: center; gap: 12px; }
.sd-page .sd-stack-card h3 small { display: block; font-size: 13px; font-weight: 500; color: var(--sd-muted); margin-top: 2px; }
.sd-page .sd-stack-card .sd-ico { display: inline-flex; justify-content: center; align-items: center; flex: 0 0 44px; width: 44px; height: 44px; border-radius: 12px; background: #eaf2ff; color: #0057d9; font-size: 18px; }
.sd-page .sd-stack-card:nth-child(3n+2) .sd-ico { background: #e6f7f2; color: #007b66; }
.sd-page .sd-stack-card:nth-child(3n+3) .sd-ico { background: #f0ecff; color: #6948bb; }
.sd-page .sd-stack-list { list-style: none; padding: 0; margin: 18px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
.sd-page .sd-stack-list li { display: inline-flex; align-items: center; background: #f2f7ff; border: 1px solid #dce6f1; border-radius: 100px; padding: 6px 14px; font-size: 13px; font-weight: 600; color: #23364e; }
.sd-page .sd-case { border: 1px solid var(--sd-line); border-radius: 16px; overflow: hidden; background: #fff; }
.sd-page .sd-case-art { height: 190px; padding: 26px; background: linear-gradient(135deg, #edf4ff, #e6f6f3); display: flex; align-items: center; justify-content: center; }
.sd-page .sd-case-art svg { width: 100%; height: 100%; }
.sd-page .sd-case-body { padding: 28px; }
.sd-page .sd-case-body p { font-size: 14px; }
.sd-page .sd-case-body .sd-eyebrow { font-size: 10px; }
.sd-page .sd-faq-layout { display: grid; grid-template-columns: 1fr 1.65fr; gap: 64px; }
.sd-page .sd-faq details { position: relative; isolation: isolate; overflow: hidden; border-bottom: 1px solid #cbd9e9; transition: background-color .25s ease; }
.sd-page .sd-faq details::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(112deg, #0057d90f, #00a58912 55%, transparent 75%); opacity: 0; transform: translateX(-8%); transition: opacity .35s ease, transform .35s ease; }
.sd-page .sd-faq details:hover::before, .sd-page .sd-faq details[open]::before { opacity: 1; transform: translateX(0); }
.sd-page .sd-faq summary { padding: 22px 36px 22px 0; position: relative; list-style: none; cursor: pointer; font-size: 16px; font-weight: 700; transition: color .2s ease, padding-left .25s ease; }
.sd-page .sd-faq summary:hover, .sd-page .sd-faq summary:focus-visible { color: #003f9e; padding-left: 8px; }
.sd-page .sd-faq summary::-webkit-details-marker { display: none; }
.sd-page .sd-faq summary::after { content: '+'; position: absolute; right: 6px; top: 19px; color: #0057d9; font-size: 23px; line-height: 1; transition: transform .25s ease; }
.sd-page .sd-faq details[open] summary::after { content: '+'; transform: rotate(45deg); }
.sd-page .sd-faq p { font-size: 15px; padding-right: 16px; }
.sd-page .sd-contact { position: relative; isolation: isolate; overflow: hidden; background: linear-gradient(120deg, #eaf2ff, #e9faf3); padding: 48px; border: 1px solid #cddfeb; border-radius: 22px; }
.sd-page .sd-contact::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(420px 220px at 92% 8%, #0057d91f, transparent 65%), radial-gradient(380px 210px at 6% 94%, #00a58922, transparent 65%), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='240' viewBox='0 0 360 240'%3E%3Cg fill='none' stroke='%230057d9' stroke-opacity='.12'%3E%3Cpath d='M0 210Q120 130 200 190T360 160'/%3E%3Ccircle cx='200' cy='190' r='5'/%3E%3C/g%3E%3C/svg%3E"); background-size: auto, auto, 360px 240px; background-position: center; animation: sd-contact-drift 15s ease-in-out infinite alternate; }
.sd-page .sd-next { background: #fff; padding: 28px; border: 1px solid var(--sd-line); border-radius: 14px; }
.sd-page .sd-next h3 { margin-top: 0; }
.sd-page .sd-next ol { padding-left: 20px; margin: 0; color: #536278; font-size: 14px; }
.sd-page .sd-next li { padding: 8px 0; }
.sd-page .sd-contact p.sd-small { font-size: 13px; margin: 22px 0 0; }
.sd-page .sd-cities { position: relative; isolation: isolate; overflow: hidden; padding: 36px 0; border-top: 1px solid var(--sd-line); background: linear-gradient(112deg, #f7faff, #eef8f4); }
.sd-page .sd-cities .sd-container { position: relative; z-index: 1; }
.sd-page .sd-cities h2 { font-size: 20px; letter-spacing: -.3px; }
.sd-page .sd-cities ul { display: flex; flex-wrap: wrap; gap: 4px 24px; list-style: none; padding: 0; margin: 0; }
.sd-page .sd-cities a { display: inline-block; padding: 10px 0; font-size: 13px; }
.sd-page .sd-float { animation: sd-float 7s ease-in-out infinite; }
.sd-page .sd-float-alt { animation: sd-float 9s ease-in-out infinite reverse; }
.sd-page .sd-drift { animation: sd-drift 12s ease-in-out infinite alternate; }
.sd-page .sd-flow { animation: sd-flow 22s linear infinite; }
.sd-page.sd-paused *, .sd-page.sd-paused *::before, .sd-page.sd-paused *::after { animation-play-state: paused !important; }
@keyframes sd-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes sd-drift { to { transform: translate(22px, -18px); } }
@keyframes sd-flow { to { stroke-dashoffset: -280; } }
@media (max-width: 991px) {
  .sd-page .sd-section { padding: 64px 0; }
  .sd-page .sd-split, .sd-page .sd-hero .sd-split, .sd-page .sd-faq-layout { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .sd-page .sd-hero { padding-top: 120px; }
  .sd-page .sd-hero h1 { max-width: 700px; }
  .sd-page .sd-art { width: min(520px, 100%); margin: 0 auto; }
  .sd-page .sd-heading { display: block; }
  .sd-page .sd-heading > p { margin-top: 20px; max-width: 650px; }
  .sd-page .sd-three, .sd-page .sd-cap-grid, .sd-page .sd-stack-grid, .sd-page .sd-company-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sd-page .sd-tech-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sd-page .sd-process { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sd-page .sd-contact { padding: 32px; }
}
@media (max-width: 575px) {
  .sd-page .sd-container { padding-left: 20px; padding-right: 20px; }
  .sd-page .sd-section { padding: 48px 0; }
  .sd-page .sd-section::before, .sd-page .sd-cities::before { background-size: 800px 480px; animation-duration: 32s; }
  .sd-page .sd-section::after, .sd-page .sd-cities::after { animation-duration: 14s; }
  .sd-page .sd-hero::after, .sd-page .sd-jump::before, .sd-page .sd-contact::before { animation-duration: 20s; }
  .sd-page .sd-arrived { animation-duration: .5s; }
  .sd-page h1 { letter-spacing: -1.3px; }
  .sd-page h2 { letter-spacing: -.7px; }
  .sd-page .sd-hero { padding: 105px 0 32px; }
  .sd-page .sd-hero p { font-size: 16px; }
  .sd-page .sd-three, .sd-page .sd-two, .sd-page .sd-cap-grid, .sd-page .sd-company-grid, .sd-page .sd-stack-grid, .sd-page .sd-process { grid-template-columns: minmax(0, 1fr); }
  .sd-page .sd-button { width: 100%; }
  .sd-page .sd-jump .sd-container { justify-content: flex-start; gap: 0 22px; }
  .sd-page .sd-card, .sd-page .sd-company-card, .sd-page .sd-case-body { padding: 24px; }
  .sd-page .sd-tech-grid li { padding: 18px 12px; flex-direction: column; gap: 12px; text-align: center; }
  .sd-page .sd-tech-grid strong { font-size: 15px; }
  .sd-page .sd-tech-grid small { font-size: 11px; }
  .sd-page .sd-contact { padding: 26px 20px; }
  .sd-page .sd-next { padding: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  html:has(.sd-page) { scroll-behavior: auto; }
  .sd-page *, .sd-page *::before, .sd-page *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .sd-page .sd-card:hover, .sd-page .sd-company-card:hover, .sd-page .sd-button:hover, .sd-page .sd-benefits li:hover, .sd-page .sd-tech-grid li:hover, .sd-page .sd-case:hover, .sd-page .sd-next:hover, .sd-page .sd-process li:hover, .sd-page .sd-card:hover .sd-icon, .sd-page .sd-link:hover > span, .sd-page .sd-button:hover > span, .sd-page .sd-jump a:hover, .sd-page .sd-cities a:hover { transform: none; }
  .sd-page .sd-benefits li::after, .sd-page .sd-card::after, .sd-page .sd-company-card::after, .sd-page .sd-tech-grid li::after, .sd-page .sd-case::after, .sd-page .sd-next::after { opacity: 1; transform: none; }
  .sd-page .sd-hero::after, .sd-page .sd-jump::before, .sd-page .sd-contact::before, .sd-page .sd-hero-bg svg { animation: none; }
}

/* Animated vector artwork on every content section: decorative only, behind readable content. */
.sd-page .sd-section, .sd-page .sd-cities { position: relative; isolation: isolate; }
.sd-page .sd-section::before, .sd-page .sd-cities::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='650' viewBox='0 0 1200 650'%3E%3Cg fill='none' stroke='%230057d9' stroke-opacity='.10'%3E%3Cpath d='M0 160H130L220 250H410M1200 460H1040L950 370H820M0 560Q300 340 600 520T1200 490'/%3E%3Ccircle cx='1100' cy='130' r='180'/%3E%3Ccircle cx='1100' cy='130' r='220'/%3E%3Cpath d='M40 40h45m-22-22v44M910 560h30m-15-15v30'/%3E%3C/g%3E%3Cg fill='%23008b7a' fill-opacity='.16'%3E%3Ccircle cx='220' cy='250' r='5'/%3E%3Ccircle cx='410' cy='250' r='4'/%3E%3Ccircle cx='950' cy='370' r='5'/%3E%3Ccircle cx='820' cy='370' r='4'/%3E%3C/g%3E%3C/svg%3E"); background-size: 1200px 650px; background-position: center; animation: sd-vector-pan 24s ease-in-out infinite alternate; animation-play-state: paused; }
.sd-page .sd-section::after, .sd-page .sd-cities::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(ellipse at 8% 80%, #00adee0c, transparent 40%), radial-gradient(ellipse at 94% 15%, #61e7c21a, transparent 40%); animation: sd-ambient 10s ease-in-out infinite alternate; animation-play-state: paused; }
.sd-page .sd-section:nth-of-type(even)::before, .sd-page .sd-cities::before { animation-direction: alternate-reverse; background-position: right center; }
.sd-page .sd-in-view::before, .sd-page .sd-in-view::after { animation-play-state: running; }
.sd-page .sd-hero.sd-in-view::after, .sd-page .sd-hero.sd-in-view .sd-hero-bg svg, .sd-page .sd-jump.sd-in-view::before, .sd-page .sd-contact.sd-in-view::before { animation-play-state: running; }
.sd-page .sd-hero::after, .sd-page .sd-hero-bg svg, .sd-page .sd-jump::before, .sd-page .sd-contact::before { animation-play-state: paused; }
.sd-page .sd-arrived { animation: sd-enter .7s cubic-bezier(.2,.65,.25,1) var(--sd-delay, 0ms) backwards; }
.sd-page .sd-hero .sd-arrived { animation-name: sd-hero-enter; }
.sd-page .sd-tech-grid img { animation: sd-logo-float 6s ease-in-out var(--sd-delay, 0ms) infinite; animation-play-state: paused; }
.sd-page .sd-in-view .sd-tech-grid img { animation-play-state: running; }
.sd-page .sd-case-art svg { animation: sd-art-breathe 8s ease-in-out infinite; animation-play-state: paused; transform-origin: center; }
.sd-page .sd-in-view .sd-case-art svg { animation-play-state: running; }
.sd-page .sd-benefits li, .sd-page .sd-card, .sd-page .sd-process li, .sd-page .sd-tech-grid li, .sd-page .sd-case, .sd-page .sd-next, .sd-page .sd-contact { position: relative; }
.sd-page .sd-benefits li, .sd-page .sd-card, .sd-page .sd-tech-grid li, .sd-page .sd-case, .sd-page .sd-next, .sd-page .sd-contact { overflow: hidden; }
.sd-page .sd-benefits li::after, .sd-page .sd-card::after, .sd-page .sd-tech-grid li::after, .sd-page .sd-case::after, .sd-page .sd-next::after { content: ''; position: absolute; right: -22%; bottom: -42%; width: 68%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, #00adee1f, #61e7c212 52%, transparent 70%); pointer-events: none; transform: translate3d(22%, 22%, 0) scale(.88); opacity: 0; transition: opacity .45s ease, transform .55s ease; }
.sd-page .sd-in-view .sd-benefits li::after, .sd-page .sd-in-view .sd-card::after, .sd-page .sd-in-view .sd-tech-grid li::after, .sd-page .sd-in-view .sd-case::after, .sd-page .sd-in-view .sd-next::after { opacity: 1; transform: translate3d(0, 0, 0) scale(1); animation: sd-bubble-drift 13s ease-in-out var(--sd-delay, 0ms) infinite alternate; }
.sd-page .sd-benefits li::after, .sd-page .sd-card::after, .sd-page .sd-tech-grid li::after, .sd-page .sd-case::after, .sd-page .sd-next::after, .sd-page .sd-contact::before { z-index: 0; }
.sd-page .sd-benefits li > *, .sd-page .sd-card > *, .sd-page .sd-tech-grid li > *, .sd-page .sd-case > *, .sd-page .sd-next > *, .sd-page .sd-contact > * { position: relative; z-index: 1; }
.sd-page .sd-process li::after { content: ''; position: absolute; top: -3px; left: 0; width: 34px; height: 4px; border-radius: 4px; background: linear-gradient(90deg, #0057d9, #00a589); animation: sd-process-signal 5s ease-in-out var(--sd-delay, 0ms) infinite; animation-play-state: paused; }
.sd-page .sd-in-view .sd-process li::after { animation-play-state: running; }
.sd-page .sd-tech-grid li, .sd-page .sd-case, .sd-page .sd-next { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.sd-page .sd-benefits li { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.sd-page .sd-icon, .sd-page .sd-link > span, .sd-page .sd-button > span { transition: transform .25s ease; }
.sd-page .sd-jump a, .sd-page .sd-cities a { transition: color .2s ease, transform .2s ease; }
.sd-page .sd-faq details[open] p { animation: sd-answer .3s ease-out; }
.sd-page .sd-faq details[open] summary { color: #003f9e; }
@media (hover: hover) and (pointer: fine) {
  .sd-page .sd-process li { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease, background-color .25s ease; }
  .sd-page .sd-benefits li:hover, .sd-page .sd-company-card:hover, .sd-page .sd-tech-grid li:hover, .sd-page .sd-case:hover, .sd-page .sd-next:hover, .sd-page .sd-process li:hover { transform: translateY(-5px); border-color: #9cbedf; box-shadow: 0 18px 38px #153d6712; }
  .sd-page .sd-process li:hover { background: linear-gradient(180deg, #ffffff, #eef5ff88 70%, #e6f6f388); }
  .sd-page .sd-card:hover .sd-icon { transform: translateY(-3px) rotate(-6deg); }
  .sd-page .sd-link:hover > span, .sd-page .sd-button:hover > span { transform: translateX(4px); }
  .sd-page .sd-jump a:hover, .sd-page .sd-cities a:hover { transform: translateY(-2px); color: #007b66; }
}
@keyframes sd-vector-pan { from { background-position: 45% 0; } to { background-position: 55% 55px; } }
@keyframes sd-hero-spin { to { transform: rotate(360deg); } }
@keyframes sd-hero-drift { from { transform: translate3d(0, 0, 0) scale(1); } to { transform: translate3d(24px, -18px, 0) scale(1.035); } }
@keyframes sd-bubble-drift { from { translate: 0 8px; scale: .96; } to { translate: 0 -10px; scale: 1.04; } }
@keyframes sd-jump-pan { from { background-position: 0 center; } to { background-position: 120px center; } }
@keyframes sd-contact-drift { from { background-position: 0 0, 0 0, 0 center; } to { background-position: 40px -20px, -30px 20px, 48px center; } }
@keyframes sd-icon-spin { from { rotate: -7deg; scale: 1; } to { rotate: 7deg; scale: 1.055; } }
@keyframes sd-ambient { from { opacity: .4; } to { opacity: 1; } }
@keyframes sd-enter { from { opacity: .25; translate: 0 20px; } to { opacity: 1; translate: 0 0; } }
@keyframes sd-hero-enter { from { opacity: .25; translate: 0 14px; } to { opacity: 1; translate: 0 0; } }
@keyframes sd-logo-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes sd-art-breathe { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
@keyframes sd-process-signal { 0%, 100% { left: 0; opacity: .5; } 50% { left: calc(100% - 34px); opacity: 1; } }
@keyframes sd-answer { from { opacity: .3; translate: 0 -4px; } to { opacity: 1; translate: 0 0; } }
/* Pause applies to hover/reveal effects as well as continuous vector motion. */
.sd-page.sd-tab-hidden *, .sd-page.sd-tab-hidden *::before, .sd-page.sd-tab-hidden *::after { animation-play-state: paused !important; }
.sd-page.sd-paused *, .sd-page.sd-paused *::before, .sd-page.sd-paused *::after { transition: none !important; }
.sd-page.sd-paused .sd-arrived, .sd-page.sd-paused .sd-faq details[open] p { animation: none; }
.sd-page.sd-paused .sd-benefits li:hover, .sd-page.sd-paused .sd-card:hover, .sd-page.sd-paused .sd-company-card:hover, .sd-page.sd-paused .sd-button:hover, .sd-page.sd-paused .sd-tech-grid li:hover, .sd-page.sd-paused .sd-case:hover, .sd-page.sd-paused .sd-next:hover, .sd-page.sd-paused .sd-process li:hover, .sd-page.sd-paused .sd-card:hover .sd-icon, .sd-page.sd-paused .sd-link:hover > span, .sd-page.sd-paused .sd-button:hover > span, .sd-page.sd-paused .sd-jump a:hover, .sd-page.sd-paused .sd-cities a:hover { transform: none; }
@media print {
  .sd-page *, .sd-page *::before, .sd-page *::after { animation: none !important; transition: none !important; }
  .sd-page .sd-hero::after, .sd-page .sd-jump::before, .sd-page .sd-contact::before, .sd-page .sd-section::before, .sd-page .sd-section::after, .sd-page .sd-cities::before, .sd-page .sd-cities::after, .sd-page .sd-motion { display: none; }
}

