/* Service detail: light display type and clear, content-led sections. */
body.service-page { background: #f8f9fa; color: #0a192f; }
body.service-page::before { content: none; }
.service-page .service-detail { max-width: 1600px; margin-inline: auto; padding: 124px clamp(24px, 5.5vw, 88px) 64px; }
.service-page .service-detail :is(section, article, div, figure) { min-width: 0; }
.service-page .service-kicker { display: flex; align-items: center; gap: 12px; color: #63707e; font-size: 11px; font-weight: 500; letter-spacing: .08em; }
.service-page .service-kicker > span { margin-inline-start: auto; color: #007cff; }
.service-page .service-intro__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(28px, 6vw, 88px); align-items: start; padding-block: 32px 40px; }
body.service-page #main h1 { max-width: 16ch; margin: 0; font-size: clamp(38px, 4.4vw, 64px) !important; line-height: 1.12; letter-spacing: -.04em; }
.service-page .service-intro__copy .service-prose { font-size: 17px; }
.service-page .service-prose { color: #536171; font-size: 16px; line-height: 1.8; overflow-wrap: anywhere; text-align: start; }
.service-page .service-prose :is(p, li) { font-size: inherit; line-height: inherit; }
.service-page .service-prose :is(p, li, span)[style*="font-size"] { font-size: inherit !important; }
.service-page .service-prose :is(p, ul, ol, blockquote, table) + :is(p, ul, ol, blockquote, table, h2, h3, h4, h5) { margin-top: 18px; }
.service-page .service-prose :is(h2, h3, h4, h5, h6) { margin-block: 24px 12px; color: #0a192f; line-height: 1.3; }
.service-page .service-prose > :first-child { margin-top: 0; }
.service-page .service-prose :is(ul, ol) { padding-inline-start: 22px; list-style: revert; }
.service-page .service-prose li + li { margin-top: 8px; }
.service-page .service-prose a { color: #075bbb; text-decoration: underline; text-underline-offset: 3px; }
.service-page .service-prose :is(img, iframe, video) { max-width: 100%; height: auto; }
.service-page .service-prose table { display: block; width: 100%; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.service-page .service-prose :is(td, th) { padding: 10px; border: 1px solid #dce3ea; }
.service-page .service-prose blockquote { margin-inline: 0; padding-inline-start: 20px; border-inline-start: 2px solid #007cff; }
.service-page .service-action { display: inline-flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 44px; margin-top: 24px; padding: 10px 16px; border-radius: 999px; background: #0a192f; color: #fff; font-size: 13px; font-weight: 500; text-decoration: none; transition: background .2s; }
.service-page .service-action > span { color: #00f6ed; font-size: 20px; }
.service-page .service-action:hover { background: #075bbb; }
.service-page .service-action:focus-visible { outline: 2px solid #007cff; outline-offset: 4px; }
.service-page .service-intro__visual { overflow: hidden; border-radius: 16px; background: #e7edf4; }
.service-page .service-intro__visual img { display: block; width: 100%; height: clamp(220px, 26vw, 380px); object-fit: cover; object-position: center; }
.service-page :is(.service-capabilities, .service-packages, .service-feedback) { padding-top: clamp(40px, 5vw, 72px); }
.service-page .service-section-head { margin-bottom: 28px; }
.service-page .service-section-head .service-kicker { margin-bottom: 14px; }
body.service-page #main .service-section-head h2 { max-width: 24ch; margin: 0; font-size: clamp(30px, 3.4vw, 46px) !important; line-height: 1.16; }
.service-page .service-section-head--split { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 24px 56px; align-items: end; }
.service-page .service-section-lede { max-width: 40ch; color: #63707e; font-size: 15px; line-height: 1.75; }
.service-page :is(.service-capability-grid, .service-package-grid) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 16px; }
.service-page :is(.service-capability, .service-package) { padding: clamp(18px, 2vw, 24px); border: 1px solid #dce3ea; border-radius: 10px; background: #fff; }
.service-page .service-card-heading { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; margin-bottom: 12px; }
.service-page .service-card-heading img { width: 30px; height: 30px; object-fit: contain; }
.service-page .service-index { color: #007cff; font-size: 12px; letter-spacing: .06em; }
body.service-page #main :is(.service-capability, .service-package) > .service-card-heading h3 { margin: 0; font-size: clamp(21px, 1.9vw, 26px) !important; line-height: 1.25; }
.service-page .service-capability .service-prose { font-size: 15px; line-height: 1.6; }
.service-page .service-capability .service-prose :is(p, ul, ol, blockquote, table) + :is(p, ul, ol, blockquote, table) { margin-top: 10px; }
.service-page .service-capability .service-prose :is(h2, h3, h4, h5, h6) { margin-block: 14px 8px; }
.service-page .service-capability .service-prose li + li { margin-top: 4px; }
body.service-page #main .service-prose h2 { font-size: clamp(26px, 2.8vw, 38px) !important; }
body.service-page #main .service-prose h3 { font-size: clamp(22px, 2.2vw, 30px) !important; }
.service-page .service-package__icon { font-size: 22px; }
.service-page .service-package > p { color: #536171; font-size: 15px; line-height: 1.6; }
.service-page .service-context { max-width: 100%; margin-top: 40px; padding-block: 32px; border-top: 1px solid #dce3ea; }
.service-page .service-context > .service-prose { max-width: 90ch; }
.service-page .service-enquiry { display: flex; align-items: center; justify-content: space-between; gap: 28px; margin-top: 40px; padding: clamp(24px, 4vw, 48px); border-radius: 16px; background: #0a192f; color: #f8f9fa; }
.service-page .service-enquiry .service-kicker { margin-bottom: 14px; color: #b8c7d8; }
body.service-page #main .service-enquiry h2 { margin: 0; font-size: clamp(28px, 3.2vw, 44px) !important; }
.service-page .service-action--light { flex-shrink: 0; margin: 0; background: #f8f9fa; color: #0a192f; }
.service-page .service-action--light > span { color: #007cff; }
.service-page .service-action--light:hover { background: #00f6ed; }
.service-page .service-action--light:focus-visible { outline-color: #00f6ed; }
.service-page .innovation-showcase { margin-top: clamp(40px, 5vw, 72px); padding: clamp(24px, 4vw, 40px); border-radius: 16px; background: #edf2f7; }
.service-page .innovation-showcase__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 16px; }
.service-page .innovation-feature-card { padding: 18px; border: 1px solid #d4dfe9; border-radius: 10px; background: #f8f9fa; }
body.service-page #main .innovation-feature-card h3 { margin: 0; color: #0a192f; font-size: clamp(21px, 1.9vw, 26px) !important; }
.service-page .innovation-feature-card h5 { margin: 16px 0 8px; color: #075bbb; font-size: 15px; }
.service-page .innovation-feature-card ul { margin: 0; padding-inline-start: 20px; list-style: disc; }
.service-page .innovation-feature-card li { margin-top: 4px; color: #536171; font-size: 14px; line-height: 1.6; }
.service-page .service-feedback__controls { display: flex; justify-content: flex-end; gap: 10px; }
.service-page .service-feedback__controls button { width: 44px; height: 44px; border: 1px solid #ccd7e1; border-radius: 50%; background: #fff; color: #0a192f; font-size: 20px; cursor: pointer; }
.service-page .service-feedback__controls button:disabled { opacity: .35; cursor: default; }
.service-page :is(.service-feedback__controls button, .service-feedback__track):focus-visible { outline: 2px solid #007cff; outline-offset: 4px; }
.service-page .service-feedback__track { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: thin; padding-bottom: 12px; }
.service-page .service-quote { display: flex; flex: 0 0 calc((100% - 20px) / 2); flex-direction: column; align-items: stretch; scroll-snap-align: start; padding: 28px; border: 1px solid #dce3ea; border-radius: 12px; background: #fff; }
.service-page .service-quote__mark { display: block; color: #007cff; font-size: 56px; line-height: 1; }
.service-page .service-quote__person { margin-top: auto; padding-top: 24px; }
.service-page .service-quote__person p { color: #0a192f; font-size: 15px; font-weight: 500; }
.service-page .service-quote__person > span { color: #63707e; font-size: 13px; }
html[dir="rtl"] .service-page .service-feedback__controls button > span { display: inline-block; transform: scaleX(-1); }
@media (max-width: 900px) {
  .service-page .service-intro__grid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .service-page .service-intro__copy { max-width: 80ch; }
}
@media (max-width: 760px) {
  .service-page .service-detail { padding-top: 98px; padding-bottom: 40px; }
  .service-page .service-intro__grid { padding-block: 24px 28px; }
  .service-page .service-section-head--split { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .service-page :is(.service-capability-grid, .service-package-grid, .innovation-showcase__grid) { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .service-page .service-enquiry { flex-direction: column; align-items: flex-start; }
  .service-page .service-quote { flex-basis: 100%; padding: 24px; }
  .service-page .service-feedback__controls { justify-content: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .service-page .service-action { transition: none; }
}