/* Compact accordion cards and a centred comparison label. */
.services-grid,.services-grid:has(.service-card[open]) { grid-auto-rows:auto; align-items:stretch; }
.service-card { overflow:hidden; }
.service-card summary { padding:24px; min-height:180px; }
.service-card svg { top:22px; right:24px; width:44px; height:44px; }
.service-card .card-num { font-size:14px; }
.service-card h3 { margin-top:40px; min-height:2.5em; max-width:100%; font-size:clamp(20px,1.75vw,25px); line-height:1.25; }
.service-card .expand { top:21px; bottom:auto; right:83px; font-size:22px; }
.service-card > p { margin-inline:24px; font-size:16px; padding:0 0 24px; line-height:1.6; animation:none; }
#services .interaction-hint { margin-top:18px; }
.comparison-block .comparison-title { display:block; width:100%; margin:11px 0 0; padding:0; text-align:center; white-space:nowrap; font-size:clamp(16px,1.4vw,20px); line-height:1.4; font-weight:400; color:#e5e5df; }
.comparison-rule > span { top:78%; }
.hero-image { background-position:center 57%; }
.hero { min-height:680px; }
.hero-content { padding-bottom:42px; }
.technology-grid { grid-template-columns:minmax(0,1.38fr) minmax(0,1fr); gap:40px; align-items:start; }
.stage { padding-block:23px; gap:20px; }
.stage strong { font-size:23px; }
.stage-description { max-width:none; font-size:17px; line-height:1.65; margin-top:11px; }
.stage-number { font-size:14px; }
.stage-visual > img { height:auto; aspect-ratio:3/2; }
.stage-visual figcaption { font-size:14px; }
#technology .section-intro { max-width:760px; font-size:18px; }
.mobile-work h2,.mobile-work h2 span { color:#000; opacity:1; }
.mobile-work h2 span { font-weight:400; }

.restoration-demo { width:min(100%,1000px); display:grid; gap:10px; margin:28px auto 0; padding:16px 20px; border:1px solid #3c4143; background:#171a1c; }
.restoration-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0; }
.restoration-heading h3 { font-size:22px; line-height:1.3; font-weight:500; }
.restoration-note { color:#aab3b7; font-size:12px; line-height:1.5; white-space:nowrap; text-align:right; }
.sequence-button { display:flex; align-items:center; justify-content:center; gap:8px; min-height:42px; border:1px solid var(--orange); background:var(--orange); padding:8px 18px; font:inherit; font-size:14px; color:#111; white-space:nowrap; cursor:pointer; }
.sequence-button:hover { background:#ffad4b; }
.sequence-button:disabled { opacity:.55; cursor:wait; }
.bore-restart { border-color:#586167; color:#d3d8da; background:transparent; }
.bore-restart:hover { background:#2c3539; }
.bore-steps { display:grid; grid-template-columns:.65fr 1.4fr .85fr 1.3fr 1.2fr; gap:2px; }
.bore-step { display:flex; align-items:center; justify-content:center; gap:8px; padding:8px; min-height:44px; border:0; background:#252b2e; color:#c6c9ca; font:inherit; font-size:13px; line-height:1.3; cursor:pointer; }
.bore-step span { opacity:.65; font-size:12px; }
.bore-step[aria-current=true] { background:var(--orange); color:#111; }
.restoration-scene { position:relative; width:min(100%,720px,calc((100svh - 410px) * 1.77778)); aspect-ratio:16/9; max-height:calc(100svh - 410px); margin:0 auto; background:#121719; }
.restoration-scene canvas { display:block; width:100%; height:100%; }
#scene-loading { position:absolute; inset:0; display:grid; place-items:center; text-align:center; padding:20px; color:#b7bfc2; font-size:14px; }
.bore-caption { text-align:center; font-size:20px; font-weight:500; color:#f0f0eb; line-height:1.3; }
.bore-description { max-width:800px; min-height:2.9em; margin:4px auto 0; text-align:center; font-size:14px; line-height:1.45; color:#bbc0c2; }
.bore-timeline { display:flex; align-items:center; gap:16px; margin:0; }
#bore-progress { width:100%; min-width:0; height:34px; accent-color:var(--orange); cursor:pointer; }
#bore-time { flex-shrink:0; color:#aeb7bc; font-size:12px; font-variant-numeric:tabular-nums; }
.bore-controls { display:flex; justify-content:center; gap:12px; margin:0; }
@media(max-width:600px) {
  .restoration-demo { margin-top:32px; padding:20px 12px; }
  .restoration-heading { flex-direction:column; gap:10px; margin-bottom:20px; text-align:center; }
  .restoration-heading h3 { font-size:22px; }
  .restoration-note { max-width:none; text-align:center; }
  .bore-steps { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .bore-step { justify-content:flex-start; padding:12px 10px; min-height:54px; font-size:13px; }
  .bore-step:last-child { grid-column:1/-1; justify-content:center; }
  .restoration-scene { width:100%; aspect-ratio:1/1; height:auto; max-height:none; margin:0; }
  .bore-caption { font-size:20px; }
  .bore-description { font-size:15px; min-height:6.4em; }
  .bore-controls { flex-direction:column; }
  .sequence-button { min-height:52px; font-size:16px; }
  .bore-timeline { gap:10px; margin-top:12px; }
}

.business-grid { grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:56px; }
.business .eyebrow { font-size:15px; }
.business h2 { font-size:clamp(40px,4vw,60px); line-height:1.14; }
.business-intro { font-size:22px; max-width:650px; line-height:1.6; }
.business-list { margin-top:24px; }
.business-list li { display:flex; align-items:baseline; gap:20px; font-size:18px; line-height:1.55; padding-block:18px; }
.business-list li span { font-size:15px; margin-right:0; flex-shrink:0; }
.business .text-link { font-size:17px; line-height:1.5; }

/* Road data is rendered in its native geographic coordinate system by Leaflet. */
.logistics-layout { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:32px; align-items:start; }
.logistics-map-panel,.logistics-calculator { min-width:0; }
.logistics-map-panel { border:1px solid var(--line); background:#191c1d; }
.map-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; padding:16px 18px; }
.map-toolbar > span { display:flex; align-items:center; gap:9px; font-size:14px; }
.map-toolbar i { width:9px; height:9px; border-radius:50%; background:var(--orange); flex-shrink:0; }
.map-toolbar button,.map-actions button { padding:8px 10px; border:1px solid var(--line); background:transparent; color:#ddd; font:inherit; font-size:14px; line-height:1.4; min-height:44px; }
.map-toolbar button:hover,.map-actions button:hover { border-color:var(--orange); color:var(--orange); }
#map-home { position:relative; }
#logistics-map { height:480px; width:100%; background:#e5e8e1; z-index:0; color:#202421; font-family:inherit; }
#map-load-note { position:absolute; top:45%; left:25px; right:25px; text-align:center; color:#202421; background:#ffffffea; padding:18px; font-size:15px; z-index:2; pointer-events:none; }
.map-actions { display:flex; gap:9px; flex-wrap:wrap; padding:16px 18px 0; }
.map-help { color:#c0c4c5; font-size:14px; line-height:1.6; padding:16px 18px 0; }
.map-attribution { font-size:12px; line-height:1.7; color:#9ca2a5; padding:12px 18px 18px; }
.map-attribution a { color:inherit; text-decoration:underline; text-underline-offset:3px; }
.leaflet-container .leaflet-control-attribution { font-size:12px; line-height:1.5; background:#fffffff2; color:#222; }
.leaflet-container a { color:#185474; }
.leaflet-container .leaflet-bar a { color:#24272a; background:#fff; width:36px; height:36px; line-height:36px; }
.leaflet-container img.leaflet-tile { max-width:none!important; max-height:none!important; }
.origin-pin span { display:block; width:22px; height:22px; border:4px solid white; border-radius:50%; background:#dd7214; box-shadow:0 1px 7px #0009; }
.leaflet-tooltip.origin-label { background:#1c2226; color:white; border:0; font-size:13px; padding:7px 10px; }
.leaflet-tooltip-top.origin-label:before { border-top-color:#1c2226; }
.leaflet-tooltip-left.origin-label:before { border-left-color:#1c2226; }
.leaflet-tooltip-right.origin-label:before { border-right-color:#1c2226; }
.logistics-calculator { background:#1b1e20; border:1px solid var(--line); padding:28px; }
.logistics-calculator h3 { font-size:30px; line-height:1.2; margin:18px 0 24px; letter-spacing:-.02em; }
#city-search label { display:block; font-size:16px; margin-bottom:10px; }
.city-search-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:stretch; }
#destination-city { width:100%; min-width:0; font:inherit; font-size:16px; color:var(--text); background:#121516; border:1px solid #4a4f52; border-radius:0; padding:14px; min-height:52px; }
.city-search-row .button { width:auto; min-height:52px; height:52px; padding:12px 16px; white-space:nowrap; justify-content:center; }
#city-search-hint,.logistics-origin-note { color:#aeb4b7; font-size:14px; line-height:1.6; margin-top:12px; }
.route-presets { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.route-presets button { background:none; border:1px solid #474d50; color:#d2d5d6; padding:9px 11px; min-height:44px; font:inherit; font-size:14px; }
.route-presets button:hover { border-color:var(--orange); color:var(--orange); }
#logistics-status { color:#b9bec0; font-size:15px; line-height:1.6; margin-top:20px; }
#logistics-status.is-error { color:#ffb880; }
.city-results { list-style:none; margin:16px 0 0; padding:0; max-height:280px; overflow-y:auto; border:1px solid var(--line); }
.city-results li + li { border-top:1px solid var(--line); }
.city-results button { width:100%; display:block; text-align:left; padding:14px; background:#121516; color:var(--text); border:0; font:inherit; }
.city-results button:hover,.city-results button:focus-visible { background:#2b2d2d; }
.city-results strong,.city-results span { display:block; }
.city-results strong { font-size:17px; font-weight:500; }
.city-results span { margin-top:5px; font-size:14px; color:#b0b6b9; line-height:1.5; }
.route-quote { margin-top:24px; padding-top:24px; border-top:1px solid #53514c; }
.route-quote h4 { margin:0; font-size:24px; font-weight:500; line-height:1.35; letter-spacing:-.015em; overflow-wrap:anywhere; }
#route-place-detail { font-size:14px; color:#b4babc; margin-top:8px; }
.route-quote dl { margin:24px 0 0; }
.route-quote dl > div + div { margin-top:20px; }
.route-quote dt { font-size:15px; line-height:1.5; color:#c4c7c8; max-width:330px; }
.route-quote dd { margin:6px 0 0; font-size:32px; font-weight:500; line-height:1.2; }
#route-cost { color:var(--orange); font-size:38px; }
#route-formula { font-size:14px; color:#bcc1c3; margin-top:12px; }
#route-access-note { font-size:14px; color:#c9b496; margin-top:14px; line-height:1.6; }
.route-transit-note { font-size:14px; color:#d1b088; margin-top:16px; padding-left:12px; border-left:2px solid #936233; line-height:1.6; }
#external-route { display:inline-block; margin-top:18px; font-size:14px; text-decoration:underline; text-underline-offset:4px; }
.logistics-request { display:flex; width:100%; gap:12px; justify-content:space-between; text-align:left; margin-top:24px; white-space:normal; font-size:15px; line-height:1.4; }
.logistics-request span { flex-shrink:0; }
.logistics-disclaimer { font-size:15px; line-height:1.7; color:#b4babc; margin-top:26px; max-width:1150px; border-left:2px solid var(--orange); padding-left:18px; }
.route-map-dialog { width:min(1320px,calc(100vw - 40px)); max-width:none; max-height:94dvh; padding:22px; color:var(--text); background:#181b1d; border:1px solid #585b5e; }
.route-map-dialog::backdrop { background:#000c; }
.map-dialog-header { display:flex; align-items:start; justify-content:space-between; gap:20px; margin-bottom:18px; }
.map-dialog-header h2 { font-size:28px; line-height:1.25; }
#map-dialog-summary { font-size:17px; margin-top:9px; line-height:1.5; }
#map-dialog-close { width:44px; height:44px; flex-shrink:0; font-size:30px; line-height:1; color:var(--text); border:1px solid var(--line); background:none; }
#map-dialog-slot #logistics-map { height:min(68dvh,720px); }
.map-dialog-help { font-size:14px; line-height:1.5; margin-top:14px; color:#bdc2c4; }

@media(max-width:1200px) {
  .technology-grid { gap:30px; }
  .stage strong { font-size:21px; }
  .stage-description { font-size:16px; }
  .business-grid { gap:36px; }
  .business-intro { font-size:20px; }
  .logistics-layout { gap:22px; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); }
  .logistics-calculator { padding:22px; }
}
@media(max-width:900px) {
  .technology-grid,.business-grid { grid-template-columns:1fr; gap:32px; }
  .stage-visual { max-width:650px; width:100%; margin-inline:auto; }
  .stage strong { font-size:23px; }
  .stage-description { font-size:17px; }

  .business h2 { font-size:48px; }
  .business-intro { max-width:none; }
  .logistics-layout { grid-template-columns:1fr; }
  .logistics-map-panel { order:2; }
  .logistics-calculator { order:1; }
  #logistics-map { height:430px; }
}
@media(max-width:600px) {
  .services-grid { grid-auto-rows:auto; }
  .service-card summary { padding:22px; }
  .service-card h3 { min-height:0; font-size:23px; margin-top:35px; }
  .service-card > p { margin-inline:22px; }
  .service-card .service-brief { padding-right:0; }
  .comparison-block .comparison-title { font-size:clamp(13px,3.8vw,16px); letter-spacing:0; }
  .hero { min-height:660px; }
  .hero-content { padding-bottom:55px; }
  .stage strong { font-size:21px; }
  .stage-description { font-size:16px; }
  .stage { gap:13px; padding-block:22px; }
  .stage-number { font-size:14px; }
  .stage-visual figcaption { font-size:13px; }
  .business h2 { font-size:clamp(34px,9vw,48px); }
  .business .eyebrow { font-size:14px; }
  .business-intro { font-size:19px; }
  .business-list li { font-size:17px; gap:15px; padding-block:17px; }
  .business .text-link { font-size:16px; }
  .logistics-calculator { padding:20px; }
  .logistics-calculator h3 { font-size:27px; }
  .city-search-row { grid-template-columns:1fr; }
  .city-search-row .button { width:100%; }
  .logistics-request { padding:16px; }
  .route-quote h4 { font-size:22px; }
  #route-cost { font-size:34px; }
  #logistics-map { height:380px; }
  .map-toolbar { gap:10px; padding:14px; }
  .map-toolbar > span { font-size:13px; }
  .map-actions,.map-help,.map-attribution { padding-inline:14px; }
  .map-actions { align-items:stretch; }
  .map-actions button { flex:1; }
  .route-map-dialog { width:calc(100vw - 16px); padding:14px; }
  .map-dialog-header { gap:12px; }
  .map-dialog-header h2 { font-size:22px; }
  #map-dialog-summary { font-size:15px; }
  #map-dialog-slot #logistics-map { height:57dvh; }
  .logistics-disclaimer { font-size:14px; }
}

/* Apply the black map theme after the base map component styles. */
#logistics-map { background:#eef0f2; }
.logistics-map-panel .leaflet-container,.route-map-dialog .leaflet-container { background:#eef0f2; }
.logistics-road-tiles { filter:none; }
/* Leaflet panes have no CSS width; preserve the renderer’s geographic viewport. */
.leaflet-pane > svg { max-width:none!important; }
.leaflet-container .leaflet-control-attribution { color:#b9bfc2; background:#111416e8; font-size:11px; }
.leaflet-container .leaflet-control-attribution a { color:#b9bfc2; }
.leaflet-container .leaflet-bar a { color:#eee; background:#15181a; border-bottom-color:#414648; }
.leaflet-container .leaflet-bar a:hover { color:var(--orange); background:#24282a; }
.leaflet-container .leaflet-bar { border:1px solid #5b6265; border-radius:0; }


.destination-pin span { display:block; width:18px; height:18px; border:4px solid #f59324; background:#111; border-radius:50%; box-shadow:0 0 0 3px #111b; }

.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.leaflet-tooltip.destination-label { max-width:180px; white-space:normal; text-align:center; background:#f4f0e8; color:#171b1c; border:1px solid #777; font-family:inherit; font-size:13px; font-weight:500; }

/* Equal side tracks keep the logo on the viewport centreline. */
html { scroll-padding-top:94px; }
.header-inner { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:22px; min-height:82px; }
.header-contact { display:flex; align-items:center; justify-content:flex-end; gap:18px; min-width:0; grid-column:3; grid-row:1; }
.header-contact .header-phone { margin:0; font-size:13px; }
.header-contact .header-cta { display:inline-flex; min-height:42px; font-size:12px; padding:9px 14px; gap:14px; white-space:nowrap; }
.header .brand { grid-column:2; grid-row:1; justify-self:center; width:108px; }
.header .brand img { width:108px; height:64px; }
.header .desktop-nav { grid-column:1; grid-row:1; justify-content:flex-start; margin:0; gap:22px; font-size:12px; white-space:nowrap; }
@media(max-width:1100px) and (min-width:901px) {
  .header-inner { gap:14px; }
  .header-contact { gap:12px; }
  .header-contact .header-phone { font-size:12px; }
  .header-contact .header-cta { padding:8px 10px; gap:8px; }
  .header .desktop-nav { gap:14px; font-size:11px; }
}
@media(max-width:900px) {
  html { scroll-padding-top:84px; }
  .header-inner { min-height:72px; }
  .header-contact,.header .desktop-nav { display:none; }
  .header .brand,.header .brand img { width:96px; height:57px; }
  .header .menu-toggle { display:block; grid-column:3; grid-row:1; justify-self:end; width:44px; height:44px; }
}

/* The overview keeps Russia black, with distinguishable neighboring land/water. */
.map-legend {display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;font-size:12px;color:#c0c4c5;}
.map-legend > span {display:inline-flex;align-items:center;gap:6px;}
.map-legend i {width:12px;height:12px;border:1px solid #acb5af;display:inline-block;}
.legend-russia {background:#000;}.legend-land {background:#dedede;}.legend-water {background:#eef0f2;}
.leaflet-tooltip.neighbor-label {background:transparent;border:0;box-shadow:none;color:#5f6266;font-size:10px;letter-spacing:.02em;pointer-events:none;}
.leaflet-tooltip.neighbor-label:before {display:none;}
.map-dialog-help {margin-top:10px;}
.route-map-dialog .map-actions {padding:10px 0 0;}
@media(max-width:600px){.map-legend{width:100%;}.map-toolbar button{width:100%;}.leaflet-tooltip.neighbor-label{font-size:9px;}}

@media(max-width:600px){.leaflet-container .leaflet-bar a{width:44px;height:44px;line-height:44px;}}

/* Keep a modest transition between work formats and geography. */
#formats {padding-bottom:clamp(32px,3.6vw,52px);}
#geography {padding-top:clamp(32px,3.6vw,52px);}
#destination-city {height:52px;}
.city-search-row .button:disabled,.route-presets button:disabled {opacity:.65;cursor:wait;}
.footer-documents > .plain-link {padding-inline:0;margin-inline:0;text-align:left;}

/* Game entry points and loading shell; gameplay assets are loaded on demand. */
.game-nav{display:inline-flex;align-items:center;gap:5px;padding:0;background:none;border:0;color:inherit;font:inherit;cursor:pointer;white-space:nowrap}.game-nav>span{color:#f4772c;font-size:16px}.game-nav:hover{color:#f4772c}.mobile-nav .game-nav{padding:12px 0;min-height:48px;text-align:left}.game-teaser{display:flex;justify-content:space-between;align-items:center;gap:24px;border-top:1px solid #3b3d3f;margin:32px auto 0;padding:24px 0 0;max-width:1000px}.game-teaser h3{font-size:18px;font-weight:400;margin:0 0 6px}.game-teaser p{color:#92989d;font-size:13px;margin:0;max-width:520px}.game-teaser .button{flex-shrink:0;font-size:12px;min-height:48px}
.game-dialog{position:fixed;inset:0;width:94vw;max-width:1600px;height:92dvh;max-height:92dvh;margin:auto;padding:0;border:1px solid #58616a;background:#181e23;color:#f0f3f5;overflow:hidden;box-sizing:border-box;overscroll-behavior:contain;box-shadow:0 30px 120px #0008}.game-dialog[open]{display:flex;flex-direction:column;animation:game-enter .18s ease-out}.game-dialog::backdrop{background:#03080de6}.game-header{display:flex;align-items:center;gap:24px;padding:12px 28px;border-bottom:1px solid #343a40;flex-shrink:0}.game-header img{width:86px;height:51px;object-fit:contain}.game-header h2{font-size:14px;line-height:1.3;font-weight:400;margin:0;color:#c0c9d0}.game-close{margin-left:auto;flex-shrink:0;width:46px;height:46px;font-size:30px;line-height:1;border:1px solid #57636e;color:#f4f6f8;background:#252d35;cursor:pointer}.game-close:hover{border-color:#ff792a;color:#ff792a}.game-mount>p{padding:28px}.game-mount>.button{margin:0 28px}.game-dialog:focus-visible{outline:0}
@keyframes game-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1100px) and (min-width:901px){.header .desktop-nav{gap:10px}}
@media(max-width:760px){.game-dialog{width:100%;max-width:100%;height:100dvh;max-height:100dvh;border:0;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.game-header{padding:10px 16px;gap:15px}.game-header img{width:65px;height:39px}.game-header h2{font-size:11px;max-width:175px}.game-close{width:44px;height:44px}.game-teaser{align-items:flex-start;flex-direction:column;gap:18px}.game-teaser .button{width:100%}}
@media(max-height:520px){.game-header{padding-block:5px}.game-header img{height:34px}}
@media(prefers-reduced-motion:reduce){.game-dialog[open]{animation:none}}

/* Readable navigation with a shared centreline and a compact game accent. */
.header .desktop-nav{align-items:center;flex-wrap:nowrap;gap:20px;font-size:14px;line-height:1.4;min-width:0}
.header .desktop-nav>a,.header .desktop-nav>.game-nav{display:inline-flex;align-items:center;flex:0 0 auto;min-height:44px;white-space:nowrap;line-height:1.4}
.header .game-nav{color:var(--orange);white-space:nowrap}
.header .game-nav>span{color:currentColor;font-size:16px;line-height:1}
.header .game-nav:hover{color:#ffbd73}
.header .mobile-nav .game-nav{display:flex;align-items:center;width:100%;font-size:18px;line-height:1.5;border-bottom:1px solid var(--line);gap:7px}
@media(min-width:1101px) and (max-width:1250px){.header .desktop-nav{gap:14px}.header-inner{gap:16px}}
@media(max-width:1100px){.header .desktop-nav,.header-contact{display:none}.header .menu-toggle{display:block;grid-column:3;grid-row:1;justify-self:end;width:44px;height:44px}}

/* Equal typography across the desktop header. */
.header .desktop-nav,.header .header-contact .header-phone,.header .header-contact .header-cta{font-size:14px;font-weight:400;line-height:1.4}
.header .header-contact{align-items:center}.header .header-contact .header-phone{white-space:nowrap}.header .game-nav{font-size:inherit;font-weight:inherit;white-space:nowrap}
