/* Madhi Studio — ui service styles (dark only) */
:root{--service-page-header: var(--site-header-height, 58px);
  --service-page-viewport: calc(100vh - var(--service-page-header));
  --service-media-width: min(1120px, calc(100vw - 430px));
  --service-media-height: clamp(550px, 38vw, 630px);
  --service-page-max-width: min(1540px, calc(100vw - 48px));
  --madhi-light-panel: var(--brand-cyan);
  --service-title-top: 54px;
  --service-first-row-top-space: 182px;}
html{scroll-snap-type: y mandatory !important;
  scroll-behavior: smooth;}
body{background: var(--brand-aqua);}
main{position: relative;}
.page-section{position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 20 !important;
  padding: var(--service-title-top) 0 0 !important;
  pointer-events: none !important;}
.page-section .page-title{margin: 0 0 18px !important;}
.page-section .section-divider{margin: 0 !important;}
.collection{padding: 0 !important;}
.print-list{gap: 0 !important;}
.print-row{min-height: var(--service-page-viewport) !important;
  scroll-snap-align: start !important;
  scroll-snap-stop: always !important;
  padding: 34px 0 !important;
  box-sizing: border-box !important;
  align-content: center !important;}
.print-row:first-child{padding-top: var(--service-first-row-top-space) !important;}
.vector-info-card, .city-demo, .evacuation-demo{background: var(--madhi-light-panel);}
#site-footer{scroll-snap-align: end;}
@media (max-width: 950px){html{scroll-snap-type: y proximity !important;}
.page-section{position: relative !important;
    padding: 28px 0 18px !important;}
.print-row, .print-row:first-child{min-height: auto !important;
    padding: 36px 0 !important;}}
@media (max-width: 760px){:root{--service-page-header: 0px;}
.page-section{padding-top: 34px !important;}}
.motion-inline-svg, .soccer-pitch-inline{width:100%; height:100%; display:flex; align-items:center; justify-content:center;}
.motion-inline-svg > svg, .soccer-pitch-inline > svg{width:100%; height:100%; display:block;}
.turntable-row .motion-inline-svg{width:90%; height:90%; margin:auto;}
.splitflap-row .motion-inline-svg{width:100%; height:70%; margin:auto;}
.evacuation-row .motion-inline-svg{width:100%; height:100%; margin:0;}
.evacuation-row .image-card{background:var(--brand-aqua);}
.evacuation-button-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.evacuation-room-btn::before{width:5px; background:var(--accent);}
@media (min-width: 951px){.wanderports-ui-row, .soccer-pitch-row, .wanderports-row, .turntable-row, .splitflap-row{grid-template-columns: minmax(0, 2.55fr) minmax(250px, 0.52fr) !important;
    gap: 28px !important;}}
.turntable-row .motion-inline-svg{width: 98% !important;
  height: 94% !important;}
.splitflap-row .motion-inline-svg{width: 100% !important;
  height: 84% !important;}
.soccer-pitch-row .soccer-pitch-inline{width: 100% !important;
  height: 100% !important;}
.soccer-pitch-row{--tile-background:transparent;--tile-border:0;}
.soccer-pitch-row .image-card{aspect-ratio: 493 / 277 !important;
  min-height: 0 !important;
  height: auto !important;
  align-self: start !important;
  margin-top:-34px !important;}
.soccer-pitch-row .soccer-pitch-inline, .soccer-pitch-row .soccer-pitch-inline > svg{width: 100% !important;
  height: 100% !important;}
.vector-card-stack.stack-format-first{width: fit-content !important;
  max-width: 100% !important;
  grid-template-columns: repeat(2, minmax(190px, 236px)) !important;
  gap: 12px !important;
  align-items: stretch !important;
  justify-content: start !important;}
.vector-card-stack.stack-format-first > .format-card{grid-column: 1 / -1;
  min-height: 104px !important;
  max-width: 484px !important;}
.a380-row .svg-artwork img{width: 88.2% !important;
  height: 90% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  object-position: center center !important;}
.soccer-pitch-row .info-panel{padding-top:0 !important;align-self:start !important;}
.soccer-pitch-row .soccer-demo{width: 100% !important;
  margin-top: 14px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent;}
@media (max-width: 950px){.vector-card-stack.stack-format-first{grid-template-columns: 1fr !important;}
.vector-card-stack.stack-format-first > .format-card{grid-column: auto;}}
.print-row.has-tight-info{grid-template-columns: minmax(0, 2.68fr) max-content !important; gap: 24px !important;}
.print-row.has-tight-info .info-panel{max-width: 500px !important;}
.print-row.has-tight-info .image-card{width: 100% !important;}
@media (max-width: 950px){.print-row.has-tight-info{grid-template-columns: 1fr !important;}
.print-row.has-tight-info .info-panel{max-width: 100% !important;}}
@media (min-width: 951px){.a380-row.has-tight-info, .soccer-pitch-row.has-tight-info, .turntable-row.has-tight-info, .splitflap-row.has-tight-info{grid-template-columns: minmax(0, 1fr) 372px !important;
    gap: 24px !important;}
.a380-row.has-tight-info .info-panel, .soccer-pitch-row.has-tight-info .info-panel, .turntable-row.has-tight-info .info-panel, .splitflap-row.has-tight-info .info-panel{width: 372px !important;
    max-width: 372px !important;
    min-width: 0 !important;}
.a380-row .vector-card-stack.stack-format-first, .soccer-pitch-row .vector-card-stack.stack-format-first{width: 372px !important;
    max-width: 372px !important;
    grid-template-columns: repeat(2, 180px) !important;
    gap: 12px !important;}
.a380-row .vector-card-stack.stack-format-first > .format-card, .soccer-pitch-row .vector-card-stack.stack-format-first > .format-card{width: 372px !important;
    max-width: 372px !important;}
.turntable-row .city-demo{width: 350px !important;
    max-width: 350px !important;}}
.taxi-plane-row .image-card, .turntable-row .image-card{height: 600px !important;}
.splitflap-row .image-card{height: 520px !important;}
.soccer-pitch-row .image-card{width: 100% !important;
  aspect-ratio: 493 / 277 !important;
  height: auto !important;
  min-height: 0 !important;}
@media (max-width: 950px){.a380-row.has-tight-info .info-panel, .soccer-pitch-row.has-tight-info .info-panel, .turntable-row.has-tight-info .info-panel, .splitflap-row.has-tight-info .info-panel, .a380-row .vector-card-stack.stack-format-first, .soccer-pitch-row .vector-card-stack.stack-format-first, .turntable-row .city-demo{width: 100% !important;
    max-width: 100% !important;}}
@media (min-width: 951px){.a380-row.has-tight-info, .soccer-pitch-row.has-tight-info{grid-template-columns: minmax(0, 1fr) 312px !important;
    gap: 22px !important;}
.a380-row.has-tight-info .info-panel, .soccer-pitch-row.has-tight-info .info-panel{width: 312px !important;
    max-width: 312px !important;}
.a380-row .vector-card-stack.stack-format-first, .soccer-pitch-row .vector-card-stack.stack-format-first{width: 312px !important;
    max-width: 312px !important;
    grid-template-columns: 150px 150px !important;
    gap: 12px !important;}
.a380-row .vector-card-stack.stack-format-first > .format-card, .soccer-pitch-row .vector-card-stack.stack-format-first > .format-card{width: 312px !important;
    max-width: 312px !important;
    min-height: 96px !important;}
.turntable-row.has-tight-info, .splitflap-row.has-tight-info{grid-template-columns: minmax(0, 1fr) 310px !important;
    gap: 22px !important;}
.turntable-row.has-tight-info .info-panel, .splitflap-row.has-tight-info .info-panel{width: 310px !important;
    max-width: 310px !important;}
.turntable-row .city-demo{width: 296px !important;
    max-width: 296px !important;}}
.a380-row .vector-info-card, .soccer-pitch-row .vector-info-card{padding: 12px !important;}
.feature-copy-inline{display: flex;
  align-items: flex-start;
  gap: 12px;}
.feature-copy-inline .feature-description{flex: 1 1 auto;
  margin-bottom: 0;}
.preview-popout{width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  display: inline-grid !important;
  place-items: center !important;
  border: 2px solid var(--accent);
  border-radius: 999px !important;
  background: var(--brand-aqua);
  color: var(--brand-deep);
  box-shadow: 0 8px 22px color-mix(in srgb, var(--brand-deep) 10%, transparent);}
.preview-popout:hover, .preview-popout:focus-visible{background: var(--accent);
  color: var(--brand-aqua);
  border-color: transparent;}
.preview-popout svg{width: 18px !important; height: 18px !important;}
.web-preview-frame{border: 0;}
.image-card.web-preview-card, .image-card.web-preview-card .web-preview-stage{aspect-ratio: 16 / 9;}
.image-card.web-preview-card .web-preview-shell{width: 100%;
  height: 100%;}
.image-card.web-preview-card .preview-popout{align-self: flex-start;}
.branding-system-collage .branding-system-item img{background: transparent;}
@media (max-width: 820px){.feature-copy-inline{align-items: center;}}
@media (min-width: 951px){.wanderports-ui-row, .turntable-row.has-tight-info{grid-template-columns: var(--service-media-width) 348px !important;
    gap: 24px !important;}
.wanderports-ui-row .info-panel, .turntable-row.has-tight-info .info-panel{width: 348px !important;
    max-width: 348px !important;}}
.turntable-row .image-card{width: var(--service-media-width) !important;
  max-width: 100% !important;
  height: var(--service-media-height) !important;
  min-height: 0 !important;
  align-self: center !important;}
.turntable-row .motion-inline-svg{width: 100% !important;
  height: 100% !important;
  max-width: 650px !important;
  margin: 0 auto !important;}
:root{--service-title-top: 51px;
  --service-first-row-top-space: 154px;
  --service-footer-fit: 56px;}
.print-list{max-width: var(--service-page-max-width) !important;
  margin: 0 auto !important;
  padding: 0 24px !important;}
.page-section{padding-top: var(--service-title-top) !important;}
.page-section .page-title{margin-bottom: 18px !important;}
.print-row{align-items: start !important;
  align-content: start !important;}
.print-row:first-child{padding-top: var(--service-first-row-top-space) !important;}
.print-row:last-child{min-height: calc(var(--service-page-viewport) - var(--service-footer-fit)) !important;
  padding-bottom: 0 !important;}
@media (min-width: 951px){.branding-feature-row, .wanderports-ui-row, .turntable-row.has-tight-info, .web-feature-row{grid-template-columns: var(--service-media-width) max-content !important;
    gap: 24px !important;
    justify-content: start !important;}
.branding-feature-row .image-card, .turntable-row.has-tight-info .image-card, .web-feature-row .image-card{width: var(--service-media-width) !important;
    max-width: var(--service-media-width) !important;
    height: var(--service-media-height) !important;
    min-height: var(--service-media-height) !important;
    border-radius: 0 !important;
    align-self: start !important;}
.wanderports-ui-row .image-card{width: var(--service-media-width) !important;
    max-width: var(--service-media-width) !important;
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:16 / 8.1 !important;
    border-radius:16px !important;
    align-self:start !important;
    margin-top:12px !important;}
.wanderports-ui-row .info-panel, .turntable-row.has-tight-info .info-panel, .web-feature-row .info-panel{width: 348px !important;
    max-width: 348px !important;}
.wanderports-ui-row .info-panel{margin-top:12px !important;}
.branding-feature-row .info-panel{width: 262px !important;
    max-width: 262px !important;}}
.branding-feature-row .image-card, .web-feature-row .image-card, .wanderports-ui-row .image-card, .turntable-row.has-tight-info .image-card{overflow: hidden !important;}
.branding-feature-row .branding-system-collage{position: absolute !important;
  inset: 0 !important;
  height: 100% !important;
  padding: 18px !important;
  border-radius: 0 !important;
  background: var(--brand-deep);
  grid-template-columns: 1.15fr 1.15fr 1fr !important;
  grid-template-rows: 1.08fr 0.92fr 1fr !important;}
.branding-feature-row .branding-system-item{display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 0 !important;}
.branding-feature-row .layout-stacked img{width: 112% !important;
  height: 112% !important;
  max-width: 112% !important;
  max-height: 112% !important;
  object-position: center !important;}
.branding-feature-row .vector-card-stack{width: fit-content !important;
  max-width: 220px !important;}
.branding-feature-row .vector-info-card{min-height: 0 !important;
  width: 220px !important;
  padding: 14px 16px !important;}
.web-feature-row .web-preview-stage, .web-feature-row .web-preview-shell{width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  background: transparent;
  border-radius: 0 !important;}
.web-feature-row .web-preview-frame{width: 161.2903226% !important;
  height: 161.2903226% !important;
  max-width: none !important;
  max-height: none !important;
  transform: scale(.62) !important;
  transform-origin: top left !important;
  background: transparent;
  border: 0;}
.turntable-row .motion-inline-svg{width: 100% !important;
  height: 100% !important;
  max-width: 650px !important;
  margin: 0 auto !important;}
#site-footer{margin-top: calc(var(--service-footer-fit) * -1) !important;
  position: relative !important;
  z-index: 30 !important;}
#site-footer footer, footer{padding-top: 12px !important;}
@media (max-width: 950px){#site-footer{margin-top: 0 !important;}
.branding-feature-row .image-card, .wanderports-ui-row .image-card, .turntable-row.has-tight-info .image-card, .web-feature-row .image-card{width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;}
.branding-feature-row .branding-system-collage{position: relative !important;
    height: var(--service-media-height) !important;}
.web-feature-row .web-preview-frame{width: 161.2903226% !important;
    height: 161.2903226% !important;}}
:root{--service-footer-height: 56px;}
.print-row, .print-row:first-child{padding-top: var(--service-row-top) !important;
  padding-bottom: 0 !important;
  align-items: start !important;
  align-content: start !important;}
.print-row:last-child{min-height: calc(var(--service-page-viewport) - var(--service-footer-height)) !important;}
#site-footer{margin-top: 0 !important;
  position: relative !important;
  z-index: 30 !important;
  min-height: var(--service-footer-height) !important;
  height: var(--service-footer-height) !important;}
#site-footer footer, footer{height: var(--service-footer-height) !important;
  min-height: var(--service-footer-height) !important;
  padding: 14px 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;}
.vector-card-stack{justify-items: start !important;
  align-items: start !important;}
.vector-info-card{box-sizing: border-box !important;
  width: max-content !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
  justify-self: start !important;}
.vector-info-card h3, .vector-info-card p{max-width: 100% !important;}
.vector-card-stack.stack-format-first{width: fit-content !important;
  max-width: 100% !important;
  grid-template-columns: max-content max-content !important;}
.vector-card-stack.stack-format-first > .format-card{width: max-content !important;
  max-width: 100% !important;
  grid-column: 1 / -1 !important;}
.branding-feature-row .vector-card-stack, .branding-feature-row .vector-info-card{width: max-content !important;
  max-width: 100% !important;}
.info-title-action-row{display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 14px !important;
  width: 100% !important;}
.info-title-copy{min-width: 0 !important;}
.info-title-action-row .caption{margin-bottom: 4px !important;}
.info-title-action-row h2{margin: 0 !important;}
.info-title-action-row .preview-popout{position: static !important;
  flex: 0 0 42px !important;
  margin: 0 !important;}
.web-feature-row .feature-description{margin-top: 2px !important;}
@media (max-width: 950px){.print-row, .print-row:first-child{padding-top: 36px !important;}
.print-row:last-child{min-height: auto !important;}
#site-footer{height: auto !important;
    min-height: 0 !important;}
#site-footer footer, footer{height: auto !important;
    min-height: 0 !important;}
.vector-card-stack.stack-format-first{grid-template-columns: 1fr !important;}}
.branding-feature-row .branding-system-collage{background: var(--brand-deep);}
.branding-feature-row .layout-primary img{width: 96% !important; height: 92% !important; max-width: 96% !important; max-height: 92% !important;}
.branding-feature-row .layout-wordmark img{width: 94% !important; height: 86% !important; max-width: 94% !important; max-height: 86% !important;}
.branding-feature-row .layout-icon img{width: 96% !important; height: 96% !important; max-width: 96% !important; max-height: 96% !important;}
.branding-feature-row .layout-stacked img{width: 112% !important; height: 112% !important; max-width: 112% !important; max-height: 112% !important;}
.branding-feature-row .layout-mono img, .branding-feature-row .layout-inverse img, .branding-feature-row .layout-extra img{width: 106% !important; height: 100% !important; max-width: 106% !important; max-height: 100% !important;}
@media (min-width: 951px){body .print-row.print-row{grid-template-columns: var(--service-media-width) 348px !important;
    gap: 24px !important;
    justify-content: start !important;}
body .print-row.print-row:not(.wanderports-ui-row) .image-card{width: var(--service-media-width) !important;
    max-width: var(--service-media-width) !important;
    height: var(--service-media-height) !important;
    min-height: var(--service-media-height) !important;
    aspect-ratio: auto !important;
    align-self: start !important;}
body .print-row.print-row .info-panel{width: 348px !important;
    max-width: 348px !important;
    min-width: 0 !important;}}
.info-panel .vector-card-stack{width: fit-content !important;
  max-width: 100% !important;
  justify-items: start !important;}
.info-panel .vector-info-card{width: fit-content !important;
  min-width: 150px !important;
  max-width: 220px !important;
  min-height: 112px !important;
  padding: 14px 16px !important;
  justify-self: start !important;}
.info-panel .vector-info-card h3, .info-panel .vector-info-card p{width: auto !important;
  max-width: 188px !important;}
.taxi-plane-row .taxi-plane-card, .taxi-plane-row .taxi-plane-frame{background: transparent;}
.taxi-plane-row .taxi-plane-frame{width: 100% !important;
  height: 100% !important;
  display: block !important;
  border: 0;}
@media (max-width: 950px){body .print-row.print-row .image-card{width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 380px !important;}}
.branding-feature-row .layout-stacked img{width: 145% !important;
  height: 145% !important;
  max-width: 145% !important;
  max-height: 145% !important;
  transform: translateY(8%) !important;}
.info-panel .vector-card-stack{justify-items: start !important;
  align-items: start !important;}
.info-panel .vector-info-card{box-sizing: border-box !important;
  width: max-content !important;
  min-width: 0 !important;
  max-width: 220px !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
  justify-self: start !important;}
.info-panel .vector-info-card h3, .info-panel .vector-info-card p{width: auto !important;
  max-width: 188px !important;}
.a380-row .vector-card-stack.stack-format-first > .format-card, .soccer-pitch-row .vector-card-stack.stack-format-first > .format-card{grid-column: 1 !important;
  width: 150px !important;
  max-width: 150px !important;
  min-width: 150px !important;}
.web-feature-row .vector-info-card, .branding-feature-row .vector-info-card{width: max-content !important;
  min-width: 0 !important;
  max-width: 220px !important;}
.splitflap-row .motion-inline-svg{width: 100% !important;
  height: 100% !important;
  margin: 0 !important;}
.splitflap-row .image-card{height: 455px !important;
  min-height: 455px !important;
  background: var(--brand-deep);}
@media (min-width: 951px){.splitflap-row.has-tight-info{grid-template-columns: var(--service-media-width) 310px !important;
    gap: 22px !important;
    justify-content: start !important;}
.splitflap-row.has-tight-info .image-card{width: var(--service-media-width) !important;
    max-width: var(--service-media-width) !important;}}
@media (max-width: 950px){.splitflap-row .image-card{height: 384px !important;
    min-height: 384px !important;}}
.splitflap-row .motion-inline-svg, .splitflap-row .svg-artwork, .splitflap-row .solari-demo, .splitflap-row .solari-board{width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;}
.splitflap-row .image-card{background: var(--brand-deep);
  overflow: hidden !important;
  border-radius: 0 !important;}
@media (min-width: 951px){body .splitflap-row.has-tight-info{grid-template-columns: var(--service-media-width) 348px !important;
    gap: 24px !important;
    justify-content: start !important;
    align-items: start !important;}
body .splitflap-row.has-tight-info .image-card{width: var(--service-media-width) !important;
    max-width: var(--service-media-width) !important;
    height: var(--service-media-height) !important;
    min-height: var(--service-media-height) !important;
    aspect-ratio: auto !important;}
body .splitflap-row.has-tight-info .info-panel{width: 348px !important;
    max-width: 348px !important;
    min-width: 0 !important;
    align-self: start !important;}
.splitflap-row .city-demo{width: 326px !important;
    max-width: 326px !important;
    box-sizing: border-box !important;}}
@media (max-width: 950px){.splitflap-row .image-card{width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 440px !important;
    aspect-ratio: 980 / 550 !important;}
.splitflap-row .info-panel, .splitflap-row .city-demo{width: 100% !important;
    max-width: 100% !important;}}
.a380-row .vector-card-stack.stack-format-first, .soccer-pitch-row .vector-card-stack.stack-format-first{width: 348px !important;
  max-width: 348px !important;
  display: grid !important;
  grid-template-columns: 168px 168px !important;
  grid-template-areas:
    "format ."
    "use strengths" !important;
  gap: 12px !important;
  align-items: stretch !important;
  justify-items: stretch !important;}
.a380-row .vector-card-stack.stack-format-first > .format-card, .soccer-pitch-row .vector-card-stack.stack-format-first > .format-card{grid-area: format !important;
  width: 168px !important;
  min-width: 168px !important;
  max-width: 168px !important;
  height: auto !important;}
.a380-row .vector-card-stack.stack-format-first > .vector-info-card:nth-child(2), .soccer-pitch-row .vector-card-stack.stack-format-first > .vector-info-card:nth-child(2){grid-area: use !important;}
.a380-row .vector-card-stack.stack-format-first > .vector-info-card:nth-child(3), .soccer-pitch-row .vector-card-stack.stack-format-first > .vector-info-card:nth-child(3){grid-area: strengths !important;}
.a380-row .vector-card-stack.stack-format-first > .vector-info-card:nth-child(2), .a380-row .vector-card-stack.stack-format-first > .vector-info-card:nth-child(3), .soccer-pitch-row .vector-card-stack.stack-format-first > .vector-info-card:nth-child(2), .soccer-pitch-row .vector-card-stack.stack-format-first > .vector-info-card:nth-child(3){width: 168px !important;
  min-width: 168px !important;
  max-width: 168px !important;
  height: 100% !important;
  align-self: stretch !important;}
.turntable-row .city-demo{min-height: 0 !important;
  height: auto !important;
  padding: 14px 16px !important;}
.turntable-row .city-demo .hint{margin: 0 !important;}
@media (min-width: 951px){body .splitflap-row.has-tight-info .image-card{width: var(--service-media-width) !important;
    max-width: var(--service-media-width) !important;
    height: var(--service-media-height) !important;
    min-height: var(--service-media-height) !important;
    border-radius: 0 !important;
    overflow: hidden !important;}}
@media (max-width: 950px){.a380-row .vector-card-stack.stack-format-first, .soccer-pitch-row .vector-card-stack.stack-format-first{width: 100% !important;
    max-width: 348px !important;}}
.splitflap-row .image-card{position: relative !important;
  overflow: hidden !important;
  border-radius: 0 !important;
  background: var(--brand-deep);}
.splitflap-row .svg-artwork{position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;}
.splitflap-row .solari-demo, .splitflap-row .solari-board{width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;}
@media (min-width: 951px){body .splitflap-row.has-tight-info{display: grid !important;
    grid-template-columns: var(--service-media-width) 348px !important;
    gap: 24px !important;
    justify-content: start !important;
    align-items: start !important;}
body .splitflap-row.has-tight-info .image-card{width: var(--service-media-width) !important;
    max-width: var(--service-media-width) !important;
    height: var(--service-media-height) !important;
    min-height: var(--service-media-height) !important;
    aspect-ratio: auto !important;}
body .splitflap-row.has-tight-info .info-panel{width: 348px !important;
    max-width: 348px !important;
    min-width: 0 !important;}}
@media (min-width: 951px){body .splitflap-row.has-tight-info{display: grid !important;
    grid-template-columns: var(--service-media-width) 348px !important;
    column-gap: 24px !important;
    width: 1352px !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    justify-content: start !important;
    align-items: start !important;}
body .splitflap-row.has-tight-info .image-card{grid-column: 1 !important;
    grid-row: 1 !important;}
body .splitflap-row.has-tight-info .info-panel{grid-column: 2 !important;
    grid-row: 1 !important;
    width: 348px !important;
    max-width: 348px !important;
    min-width: 0 !important;
    align-self: start !important;
    padding-top: 6px !important;}
body .splitflap-row.has-tight-info .city-demo{width: 100% !important;
    max-width: 100% !important;
    padding: 16px !important;
    box-sizing: border-box !important;}}
.info-panel .vector-info-card{width: max-content !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding-left: 16px !important;
  padding-right: 16px !important;}
.info-panel .vector-info-card h3, .info-panel .vector-info-card p{width: max-content !important;
  max-width: calc(100% - 0px) !important;}
.preview-popout{background: var(--brand-aqua);}
.wanderports-ui-caption .vector-card-stack{width: 220px !important;
  max-width: 220px !important;}
.wanderports-ui-caption .vector-info-card{width: 220px !important;
  min-width: 220px !important;
  max-width: 220px !important;
  box-sizing: border-box !important;
  padding-left: 16px !important;
  padding-right: 16px !important;}
.wanderports-ui-caption .vector-info-card h3, .wanderports-ui-caption .vector-info-card p{width: auto !important;
  max-width: 188px !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;}
html .preview-popout, html[data-theme="dark"] .preview-popout{border: 0;
  transform: none !important;
  box-sizing: border-box !important;}
html .preview-popout:is(:hover, :focus-visible), html[data-theme="dark"] .preview-popout:is(:hover, :focus-visible){transform: none !important;}
@media (max-width: 950px){html[data-page="service"]{scroll-snap-type: none !important;}
html[data-page="service"] .page-section{padding-top: 24px !important;}
html[data-page="service"] .print-row, html[data-page="service"] .print-row:first-child, html[data-page="service"] .print-row:last-child, html[data-page="service"] .print-row.has-tight-info{display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 26px 0 !important;
    margin: 0 !important;}
html[data-page="service"] .image-card{width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;}
html[data-page="service"] .branding-feature-row .image-card, html[data-page="service"] .a380-row .image-card, html[data-page="service"] .soccer-pitch-row .image-card, html[data-page="service"] .madhi-hero-row .image-card, html[data-page="service"] .taxi-plane-row .image-card, html[data-page="service"] .turntable-row .image-card, html[data-page="service"] .splitflap-row .image-card, html[data-page="service"] .camera-row .image-card, html[data-page="service"] .wanderports-ui-row .image-card, html[data-page="service"] .runway-inspection-row .image-card, html[data-page="service"] .aoe-learning-row .image-card, html[data-page="service"] .web-feature-row .image-card{height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;}
html[data-page="service"] .aerowordsmith-row .image-card{aspect-ratio: 1 / 1 !important;}
html[data-page="service"] :is(.aoe-logo-row,.aoi-logo-row,.wanderports-logo-row) .image-card{aspect-ratio: 16 / 7 !important;}
html[data-page="service"] :is(.aoe-logo-row,.aoi-logo-row,.wanderports-logo-row) .svg-artwork img{width: 88% !important;
    height: 86% !important;
    max-width: 88% !important;
    max-height: 86% !important;
    object-fit: contain !important;}
html[data-page="service"] .image-card > iframe, html[data-page="service"] .wanderports-map-frame, html[data-page="service"] .aerowordsmith-frame, html[data-page="service"] .runway-inspection-frame, html[data-page="service"] .madhi-hero-frame, html[data-page="service"] .taxi-plane-frame{width: 100% !important;
    height: 100% !important;
    display: block !important;
    border: 0;}
html[data-page="service"] .web-preview-stage, html[data-page="service"] .web-preview-shell{width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;}
html[data-page="service"] .info-panel, html[data-page="service"] .print-row.has-tight-info .info-panel{width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding-top: 0 !important;}
html[data-page="service"] .orientation-note{display: block !important;
    margin: 9px 0 0 !important;
    font-size: 12.5px !important;
    line-height: 1.4 !important;
    font-style: italic !important;}}
@media (max-width: 700px){.splitflap-row .solari-grid-row{height: 34px !important; flex-basis: 34px !important;}
.splitflap-row .solari-header-row{height: 34px !important; flex-basis: 34px !important; font-size: 10px !important;}
.splitflap-row .solari-field, .splitflap-row .solari-cell, .splitflap-row .solari-signal-card, .splitflap-row .solari-stair-spacer{height: 34px !important;}
.splitflap-row .solari-glyph{font-size: 10.5px !important; line-height: 34px !important;}
.splitflap-row .solari-dot{width: 8px !important; height: 8px !important; border-width: 1px !important;}}
html[data-theme="dark"] .image-card.web-preview-card .preview-popout{background: #000000 !important;
  color: #FFFFFF !important;
  border: 2px solid #FFFFFF !important;}
html[data-theme="dark"] :is(.info-panel, .vector-info-card){background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;}
.page-section{padding: 110px 0 40px;}
.page-title{font-size: clamp(32px, 4vw, 48px);
  font-weight: 600;
  letter-spacing: -2px;
  line-height: 0.95;
  margin-bottom: 22px;}
.page-intro{max-width: 620px;
  font-size: 16px;
  line-height: 1.6;
  color: var(--muted);
  margin-bottom: 30px;}
.collection{padding: 16px 0 110px;}
.print-list{max-width: var(--service-page-max-width);
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  flex-direction: column;
  gap: 160px;}
.print-row{display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.85fr);
  gap: 36px;
  align-items: stretch;
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.7s ease, transform 0.7s ease;}
.print-row.reveal{opacity: 1;
  transform: translateY(0);}
.info-panel{padding-top: 6px;
  color: var(--muted);
  display: flex;
  flex-direction: column;
  gap: 14px;
  opacity: 0.92;
  align-self: stretch;
  justify-content: flex-start;}
.info-panel h2{font-size: 22px;
  font-weight: 600;
  
  letter-spacing: -0.3px;}
.caption{font-size: 12px;
  font-weight: 600;
  color: var(--accent);
  margin-bottom: -15px;
  text-transform: uppercase;
  letter-spacing: 0.08em;}
.info-panel p{font-size: 15px;
  line-height: 1.7;
  color: var(--muted);}
.meta-list{list-style: none;
  display: grid;
  gap: 8px;
  margin-top: 10px;}
.meta-list li{font-size: 14px;
  color: color-mix(in srgb, var(--brand-deep) 54%, transparent);
  padding-top: 8px;
  border-top: 1px solid var(--border);}
.vector-card-stack{display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 8px;
  align-items: stretch;}
.vector-info-card{width: 100%;
  min-height: 150px;
  background: var(--brand-aqua);
  border: none;
  border-radius: 0;
  padding: 14px;
  box-shadow: 0 12px 28px color-mix(in srgb, var(--brand-deep) 4%, transparent);
  display: flex;
  flex-direction: column;}
.vector-info-card h3{font-size: 13px;
  font-weight: 600;
  
  margin-bottom: 8px;}
.vector-info-card p{font-size: 11px;
  line-height: 1.45;
  color: var(--muted);}
.soccer-demo{width: 100%;
  margin-top: 12px;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;

  display: flex;
  justify-content: center;
  align-items: center;}
.image-card{background: transparent;
  border: 1px solid var(--border);
  border-radius: 0;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  min-height: 220px;
  box-shadow: none;}
.a380-row .image-card{aspect-ratio: 16 / 7;
  min-height: 220px;}
.soccer-pitch-row .image-card{aspect-ratio: 493 / 277;
  min-height: 0;
  height: auto;
  align-self: start;
  overflow: visible;}
.soccer-pitch-object{width: 100%;
  height: 100%;
  display: block;}
.svg-artwork{width: 100%;
  height: 100%;
  background: transparent;}
.svg-artwork svg, .svg-artwork object, .svg-artwork img{width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  object-position: center center;}
.section-label{color: var(--accent);
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 10px;}
.craft-section{padding: 90px 10%;
  text-align: center;}
.craft-section h2{font-size: 34px;
  letter-spacing: -0.4px;
  font-weight: 600;}
.craft-section p{color: var(--muted);
  margin-top: 12px;}
.craft-grid{display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  margin-top: 40px;}
.craft-card{background: var(--card);
  border-radius: 0;
  padding: 26px;
  text-align: left;}
.craft-card h3{font-size: 19px;
  font-weight: 600;}
.craft-card p{font-size: 15px;
  line-height: 1.6;}
.wanderports-ui-row{
  --service-media-height:clamp(560px,39vw,660px);
  grid-template-columns: minmax(0, 2.2fr) minmax(260px, 0.58fr);
  gap: 28px;}
.wanderports-ui-row .image-card{width: 100%;
  height: 360px;
  min-height: 0;
  aspect-ratio: auto;
  background: var(--brand-cyan);
  border-radius:16px;
  overflow: hidden;}
.wanderports-map-frame{width: 100%;
  height: 100%;
  display: block;
  border: 0;
  border-radius:inherit;
  margin: 0;
  background: var(--brand-cyan);}
.wanderports-ui-caption{max-width: 100%;
  padding-top: 16px;
  align-self:start !important;}
.wanderports-ui-caption .vector-card-stack{grid-template-columns: 1fr;}
.wanderports-ui-caption .vector-info-card{min-height: 112px;}
@media (max-width: 950px){.wanderports-ui-row{grid-template-columns: 1fr;}
.wanderports-ui-row .image-card{height: min(600px, 68vw);
    min-height: 380px;}}
@media (max-width: 950px){.print-row{grid-template-columns: 1fr;
    gap: 24px;}
.info-panel{padding-top: 0;}
.vector-card-stack{grid-template-columns: 1fr;}
.vector-info-card{width: 100%;}
.craft-grid{grid-template-columns: 1fr;}}
@media (max-width: 768px){.collection, .craft-section{padding-left: 8%;
    padding-right: 8%;}
.print-list{gap: 70px;}}
body .print-row.print-row.aerowordsmith-row .image-card{
  width:min(100%,970px) !important;
  max-width:970px !important;
  min-width:0 !important;
  justify-self:start !important;
  background:var(--brand-aqua);
  position:relative;
  border-radius:14px !important;
  overflow:hidden !important;
}
@media (min-width:1101px){
  body .print-row.print-row.aerowordsmith-row .image-card{
    height:700px !important;
    min-height:700px !important;
    aspect-ratio:auto !important;
  }
}
.aerowordsmith-frame{width: 100%;
  height: 100%;
  display: block;
  border: 0;
  border-radius:14px;
  background: var(--brand-aqua);}
.aoe-learning-row .image-card{background: var(--brand-cyan);
  position: relative;}
.aoe-learning-replay, .aerowordsmith-fullscreen{position: absolute;
  right: 18px;
  z-index: 5;
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 50%;
  background: var(--brand-aqua);
  color: var(--brand-deep);
  display: grid;
  place-items: center;
  cursor: pointer;
  box-shadow: 0 8px 22px color-mix(in srgb, var(--brand-deep) 10%, transparent);
  transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;}
.aoe-learning-replay{bottom: 18px;}
.aerowordsmith-fullscreen{bottom: 18px;}
.aoe-learning-replay{background:#0B6623;
  color:#00A86B;}
.aoe-learning-replay:hover, .aoe-learning-replay:focus-visible{background: var(--accent);
  color:#FFFFFF;
  border:0;
  transform: none;}
.aerowordsmith-fullscreen:hover, .aerowordsmith-fullscreen:focus-visible{background: var(--accent);
  color: var(--brand-aqua);
  border:0;
  transform: translateY(-1px);}
.aoe-learning-replay svg, .aerowordsmith-fullscreen svg{width: 20px;
  height: 20px;
  display: block;}
.aoe-learning-artwork{width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;}
.aoe-learning-artwork object, .aoe-learning-artwork img{width: 70%;
  height: 70%;
  display: block;
  object-fit: contain;
  object-position: center center;}
.aerowordsmith-row .vector-card-stack{grid-template-columns: 1fr;}
.aerowordsmith-row .vector-info-card{min-height: 0;}
.aerowordsmith-actions{display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 0;}
.aerowordsmith-actions button{min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--brand-aqua);
  color: color-mix(in srgb, var(--brand-deep) 72%, transparent);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: transform .15s ease, border-color .15s ease, background .15s ease;}
.aerowordsmith-actions button:hover{transform: translateY(-1px);
  border-color: var(--accent);}
.aerowordsmith-actions .primary{background: var(--accent);
  border-color: var(--accent);
  color: var(--brand-aqua);}
.aerowordsmith-how-list{margin: 0;
  padding-left: 15px;
  font-size: 11px;
  line-height: 1.42;
  color: var(--muted);}
.aerowordsmith-how-list li + li{margin-top: 3px;}
@media (max-width: 950px){.aoe-learning-artwork object, .aoe-learning-artwork img{width: 80%;
    height: 80%;}}
@media (min-width:1101px){
.aoe-learning-artwork object, .aoe-learning-artwork img{width:96%;height:96%;}
.runway-inspection-row{height:var(--service-page-viewport) !important;min-height:var(--service-page-viewport) !important;overflow:hidden;}
.runway-inspection-row .image-card{height:720px !important;min-height:720px !important;}
}
.runway-inspection-row{--tile-background:transparent;}
.runway-inspection-row .image-card{background: transparent;}
.runway-inspection-frame{width: 100%;
  height: 100%;
  display: block;
  border: 0;
  background: transparent;
  overflow: hidden;}
html[data-page="service"].runway-viewer-open,
html[data-page="service"].runway-viewer-open body{overflow:hidden !important;}
html[data-page="service"] .runway-inspection-row.runway-row-expanded{
  transform:none !important;
  opacity:1 !important;
}
html[data-page="service"] .runway-inspection-row .image-card.runway-expanded{
  position:fixed !important;
  inset:0 !important;
  z-index:100000 !important;
  width:100vw !important;
  max-width:none !important;
  height:100vh !important;
  height:100dvh !important;
  min-height:100vh !important;
  min-height:100dvh !important;
  margin:0 !important;
  padding:0 !important;
  aspect-ratio:auto !important;
  border:0 !important;
  border-radius:0 !important;
  background:#20242c !important;
  overflow:hidden !important;
}
html[data-page="service"] .runway-inspection-row .image-card.runway-expanded .runway-inspection-frame{
  width:100% !important;
  height:100% !important;
}
.runway-inspection-row .vector-card-stack{grid-template-columns: 1fr;
  width: min(100%, 340px);
  max-width: 340px;
  margin-top: 8px;
  justify-self: start;}
.runway-inspection-row .vector-info-card{width: 100%;
  max-width: 340px;
  min-height: 0;
  align-self: flex-start;}
.runway-inspection-row .vector-info-card p{white-space: normal;
  overflow-wrap: anywhere;}
.runway-inspection-row .info-panel{min-width: 0;}
.runway-inspection-row .info-panel > p{width: 100%;
  max-width: 100%;}
.runway-inspection-row .vector-card-stack{grid-template-columns: 1fr !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 8px !important;
  justify-self: stretch !important;}
.runway-inspection-row .vector-info-card{width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 128px !important;
  padding: 16px !important;}
.runway-inspection-row .vector-info-card p{white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;}


/* =========================================================
   2026-10-06 — soccer formation label placement
   ========================================================= */
.soccer-formation-rail{display:none;}

@media (min-width:951px){
  html[data-page="service"] .soccer-pitch-row.print-row:last-child{
    min-height:calc(var(--service-page-viewport) - var(--service-footer-height) - 52px) !important;
    padding-bottom:0 !important;
    margin-bottom:0 !important;
  }
  html[data-page="service"] .soccer-pitch-row .image-card{
    aspect-ratio:auto !important;
    height:auto !important;
    overflow:visible !important;
    margin-top:0 !important;
    margin-left:0 !important;
    width:100% !important;
    max-width:none !important;
    align-self:start !important;
  }
  html[data-page="service"] .soccer-pitch-row .svg-artwork{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    width:100% !important;
    height:auto !important;
    overflow:visible !important;
    border-bottom:0 !important;
    padding-bottom:0 !important;
  }
  html[data-page="service"] .soccer-pitch-row .soccer-pitch-inline{
    order:1 !important;
    min-width:0 !important;
    width:100% !important;
    height:auto !important;
    outline:none !important;
    border:none !important;
  }
  html[data-page="service"] .soccer-pitch-row .soccer-pitch-inline > svg,
  html[data-page="service"] .soccer-pitch-row .soccer-pitch-svg-desktop{
    display:block !important;
    width:100% !important;
    height:auto !important;
    outline:none !important;
    border:none !important;
  }
  html[data-page="service"] .soccer-pitch-row .soccer-formation-rail{
    order:2 !important;
    display:block !important;
    position:relative !important;
    width:100% !important;
    height:40px !important;
    margin:4px 0 0 !important;
    color:#FFFFFF !important;
    font-family:Arial,sans-serif !important;
    font-weight:700 !important;
    pointer-events:none !important;
  }
  html[data-page="service"] .soccer-pitch-row .soccer-formation-label,
  html[data-page="service"] .soccer-pitch-row .soccer-formation-vs{
    position:absolute !important;
    top:50% !important;
    transform:translate(-50%,-50%) !important;
    white-space:nowrap !important;
    line-height:1 !important;
    text-shadow:none !important;
    -webkit-text-stroke:0 !important;
    paint-order:normal !important;
  }
  html[data-page="service"] .soccer-pitch-row .soccer-formation-red{
    left:42% !important;
    color:#ff3b3b !important;
    font-size:36px !important;
  }
  html[data-page="service"] .soccer-pitch-row .soccer-formation-blue{
    left:58% !important;
    color:#2563eb !important;
    font-size:36px !important;
  }
  html[data-page="service"] .soccer-pitch-row .soccer-formation-vs{
    left:50% !important;
    top:50% !important;
    width:auto !important;
    height:auto !important;
    display:block !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    color:#FFFFFF !important;
    font-size:27px !important;
    font-weight:800 !important;
  }
  html[data-page="service"] #site-footer,
  html[data-page="service"] #site-footer footer{
    margin-top:0 !important;
  }
}

@media (max-width:950px){
  html[data-page="service"] .soccer-pitch-row .soccer-formation-rail{display:none !important;}
}