
.slab {
  position: sticky;
  top: 0;
  z-index: var(--z-sticky);
  background: var(--color-paper);
  border-bottom: var(--border-slab) solid var(--color-taxi);
}
.slab__mark {
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm);
  font-family: var(--font-display);
  font-size: var(--text-md);
  text-transform: uppercase;
  letter-spacing: var(--track-wide);
  color: var(--color-ink);
  white-space: nowrap;
  transition: color var(--dur-micro) var(--ease-out);
}
.slab__logo {
  width: 3.75rem;
  height: 3.75rem;
  object-fit: contain;
}
.slab__mark:hover { color: var(--color-taxi); }

.slab__link {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--text-sm);
  text-transform: uppercase;
  letter-spacing: var(--track-caps);
  color: var(--color-ink);
  white-space: nowrap;
  padding-block: var(--space-2xs);
  border-bottom: 2px solid transparent;
  transition: color var(--dur-micro) var(--ease-out),
              border-color var(--dur-micro) var(--ease-out);
}
.slab__link:hover,
.slab__link:focus-visible,
.slab__link[aria-current="page"] {
  color: var(--color-taxi);
  border-bottom-color: var(--color-taxi);
}


.slab__call {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  font-family: var(--font-display);
  font-size: var(--text-base);
  text-transform: uppercase;
  letter-spacing: var(--track-wide);
  color: var(--color-on-tile);
  background: var(--color-taxi);
  padding: var(--space-xs) var(--space-md);
  white-space: nowrap;
  transition: transform var(--dur-micro) var(--ease-out),
              background-color var(--dur-micro) var(--ease-out);
}
.slab__call:hover { background: var(--color-taxi-deep); transform: translateY(-1px); }


.slab__toggle {
  margin-left: auto;
  min-width: 46px;
  height: 46px;
  display: none;
  flex-shrink: 0;
  gap: var(--space-xs);
  padding-inline: var(--space-sm);
  place-items: center;
  background: transparent;
  border: var(--border-slab) solid var(--color-ink);
  cursor: pointer;
}
.slab__toggle-label { font-size: var(--text-sm); font-weight: 600; }
.slab__bars,
.slab__bars::before,
.slab__bars::after {
  content: "";
  display: block;
  width: 22px;
  height: 3px;
  background: var(--color-ink);
}
.slab__bars { position: relative; }
.slab__bars::before { position: absolute; top: -7px; left: 0; }
.slab__bars::after  { position: absolute; top:  7px; left: 0; }


.hero__kicker {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--text-sm);
  text-transform: uppercase;
  letter-spacing: var(--track-caps);
  color: var(--color-ink-soft);
}
.hero__line {
  display: block;
  font-family: var(--font-display);
  font-size: var(--text-poster);
  line-height: var(--leading-display);
  text-transform: uppercase;
  letter-spacing: var(--track-tight);
  color: var(--color-ink);
  overflow-wrap: anywhere;

}
.hero__phone:hover { color: var(--color-taxi); }
.hero__phone { text-decoration: none; text-underline-offset: .12em; }
.hero__phone:focus-visible { outline-offset: 6px; }


.block {
  display: inline-block;
  background: var(--color-taxi);
  color: var(--color-on-tile);
  padding: 0 0.18em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

.hero__facts {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--color-ink-soft);
}

.fact { display: inline-flex; align-items: center; }
.hero__facts li { position: relative; }
.hero__facts li + li { padding-left: var(--space-md); }
.hero__facts li + li::before {
  content: "";
  position: absolute;
  left: calc(var(--space-md) / 2 - 2px);
  top: 0.55em;
  width: 4px; height: 4px;
  background: var(--color-taxi);
}
.hero__facts strong { color: var(--color-ink); font-weight: 700; font-variant-numeric: tabular-nums; }


.section__title {
  font-family: var(--font-display);
  font-size: var(--text-display-s);
  line-height: 1.02;
  text-transform: uppercase;
  letter-spacing: var(--track-tight);
  color: var(--color-ink);
}
.section__sub {
  font-size: clamp(var(--text-base), 1.4vw, var(--text-md));
  color: var(--color-ink-soft);
  max-width: 52ch;
}

.services__title {
  font-family: var(--font-display);
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  line-height: 1.02;
  text-transform: uppercase;
  letter-spacing: var(--track-tight);
  color: var(--color-ink);
}
.services__sub {
  font-size: var(--text-base);
  color: var(--color-ink-soft);
  max-width: 52ch;
}

.hl { color: var(--color-taxi); }


.bleed { width: 100%; }
.bleed--taxi {
  background: var(--color-taxi);
  color: var(--color-on-tile);
  border-block: var(--border-slab) solid var(--color-line);
}
.bleed__inner {
  max-width: var(--content-max);
  margin-inline: auto;
  padding: clamp(2rem, 5vw, 3.5rem) var(--page-gutter);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-md);
}
.bleed__kicker {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--text-sm);
  text-transform: uppercase;
  letter-spacing: var(--track-caps);
  color: var(--color-on-tile);
}
.bleed__statement {
  font-family: var(--font-display);
  font-size: var(--text-display-s);
  line-height: 1.02;
  text-transform: uppercase;
  letter-spacing: var(--track-tight);
  max-width: 20ch;
  color: var(--color-on-tile);
}


.bigcta {
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm);
  background: var(--color-paper);
  color: var(--color-ink);
  border: var(--border-slab) solid var(--color-line);
  padding: var(--space-md) var(--space-lg);
  min-height: 44px;
  transition: transform var(--dur-micro) var(--ease-out);
}
.bigcta:hover { transform: translateY(-2px); }
.bigcta__icon { color: var(--color-taxi); font-size: 1.4em; line-height: 1; }
.bigcta__num {
  font-family: var(--font-display);
  font-size: clamp(var(--text-lg), 4vw, var(--text-2xl));
  text-transform: uppercase;
  letter-spacing: var(--track-wide);
  white-space: nowrap;
}


.tile {
  position: relative;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  padding: var(--space-lg);
  border: var(--border-slab) solid var(--color-line);
  border-radius: var(--radius-none);
  background: var(--color-tile);
  overflow: clip;
}
.tile--paper { background: var(--color-tile);     color: var(--color-on-tile); }
.tile--ink   { background: var(--color-tile-ink); color: var(--color-ink); }
.tile--taxi  { background: var(--color-taxi);     color: var(--color-on-tile); }


.tile__title,
.svc__title,
.calc__title,
.inquiry__info h3 {
  font-family: var(--font-grotesk);
  font-weight: 700;
  text-transform: none;
  letter-spacing: -0.01em;
  line-height: 1.3;
}


.calc {
  display: flex;
  flex-direction: column;
  background: var(--color-tile);
  color: var(--color-on-tile);
  border: var(--border-heavy) solid var(--color-line);
  border-radius: var(--radius-none);
  overflow: visible;
}


.calc__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
  padding: var(--space-sm) var(--space-md);
  background: var(--color-taxi);
  color: var(--color-on-tile);
  border-bottom: var(--border-heavy) solid var(--color-line);
}
.calc__title { font-size: var(--text-lg); color: var(--color-on-tile); }
.calc__tag {
  flex: none;
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--track-wide);
  color: var(--color-taxi);
  background: var(--color-on-tile);
  padding: var(--space-3xs) var(--space-xs);
  white-space: nowrap;
}


.calc__tariff {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-2xs) var(--space-md);
  padding: var(--space-sm) var(--space-md);
  background: var(--color-tile-ink);
  color: var(--color-ink);
  border-bottom: var(--border-heavy) solid var(--color-line);
}
.calc__tariff li {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-2xs);
  font-size: var(--text-sm);
}
.calc__tariff span { color: var(--color-ink-soft); }
.calc__tariff strong {
  font-family: var(--font-grotesk);
  font-weight: 700;
  color: var(--color-taxi);
  white-space: nowrap;
}


.calc__note {
  padding: var(--space-sm) var(--space-md);
  border-top: var(--border-mid) solid var(--color-line);
  font-size: var(--text-xs);
  line-height: 1.5;
  color: var(--color-on-tile-soft);
}
.calc__note strong { color: var(--color-on-tile); }
.calc__note a { color: var(--color-on-tile); text-decoration: underline; text-underline-offset: 2px; }


.calc__legal {
  font-size: var(--text-xs);
  line-height: 1.5;
  color: var(--color-on-tile-soft);
}
.calc__legal strong { color: var(--color-on-tile); }
.calc__legal a {
  color: var(--color-on-tile);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}


#calc-map {
  position: relative;
  z-index: var(--z-base);
  isolation: isolate;
  width: 100%;
  flex: 1;
  min-height: clamp(320px, 40vh, 460px);
  border: var(--border-mid) solid var(--color-line);
  background: var(--color-paper-2);
  overflow: hidden;
}
.leaflet-container { font-family: var(--font-body); background: var(--color-paper-2); }
.leaflet-tile-pane {
  filter: grayscale(1) invert(1) brightness(0.85) contrast(0.95);
}
.leaflet-bar a {
  background: var(--color-tile-ink);
  color: var(--color-ink);
  border-bottom-color: var(--hairline-on-dark);
}
.leaflet-bar a:hover { background: var(--color-paper-2); }
.leaflet-container .leaflet-control-attribution {
  background: var(--color-paper);
  color: var(--color-ink-soft);
}
.leaflet-container .leaflet-control-attribution a { color: var(--color-ink); }


.svc { padding: var(--space-lg); gap: var(--space-sm); }
.svc--wide { grid-column: 1 / -1; scroll-margin-top: var(--space-2xl); }

.svc__title {
  display: flex; align-items: center; gap: var(--space-xs);
  font-size: var(--text-md);
  color: var(--color-on-tile);
}
.tile--ink .svc__title { color: var(--color-ink); }
.svc__ico {
  flex: none;
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.svc__text { font-size: var(--text-base); color: var(--color-on-tile-soft); }
.tile--ink  .svc__text { color: var(--color-ink-soft); }
.tile--taxi .svc__text { color: var(--color-on-tile); }


.badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2xs);
  padding: var(--space-3xs) var(--space-xs);
  background: var(--color-taxi);
  color: var(--color-on-tile);
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--track-wide);
}
.badge--ghost {
  background: transparent;
  color: var(--color-ink-soft);
  border: 1px solid var(--hairline-on-dark);
}


.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-xs);
  min-height: 44px;
  font-family: var(--font-display);
  font-size: var(--text-base);
  text-transform: uppercase;
  letter-spacing: var(--track-wide);
  border: var(--border-slab) solid var(--color-taxi);
  border-radius: var(--radius-none);
  padding: var(--space-sm) var(--space-lg);
  cursor: pointer;
  white-space: nowrap;
  transition: transform var(--dur-micro) var(--ease-out),
              background-color var(--dur-micro) var(--ease-out),
              border-color var(--dur-micro) var(--ease-out),
              color var(--dur-micro) var(--ease-out);
}
.btn:hover  { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn:disabled { opacity: .65; cursor: wait; transform: none; }
.btn svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.btn--block { width: 100%; }


.btn--fill {
  background: var(--color-taxi);
  color: var(--color-on-tile);
}
.btn--fill:hover { background: var(--color-taxi-deep); border-color: var(--color-taxi-deep); }


.btn--ink {
  background: var(--color-on-tile);
  color: var(--color-taxi);
  border-color: var(--color-on-tile);
}
.btn--ink:hover { background: var(--color-paper); border-color: var(--color-paper); }


.btn--ghost {
  background: transparent;
  color: var(--color-ink);
  border-color: var(--color-ink);
}
.btn--ghost:hover { color: var(--color-taxi); border-color: var(--color-taxi); }


.field-group { display: flex; flex-direction: column; gap: var(--space-2xs); }
.field-group > label,
.inquiry__form label {
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--track-caps);
  color: var(--color-on-tile-soft);
}


.field { position: relative; }

.calc input[type="text"],
.inquiry__form input[type="text"],
.inquiry__form input[type="tel"],
.inquiry__form input[type="email"],
.inquiry__form input[type="date"],
.inquiry__form input[type="time"],
.inquiry__form select,
.inquiry__form textarea {
  width: 100%;
  min-height: 44px;
  background: var(--color-tile);
  color: var(--color-on-tile);
  border: var(--border-mid) solid var(--color-line);
  border-radius: var(--radius-none);
  padding: var(--space-sm) var(--space-md);
  transition: border-color var(--dur-micro) var(--ease-out);
}
.calc input::placeholder,
.inquiry__form input::placeholder,
.inquiry__form textarea::placeholder { color: var(--color-on-tile-soft); opacity: 1; }
.calc input:focus,
.inquiry__form input:focus,
.inquiry__form select:focus,
.inquiry__form textarea:focus { border-color: var(--color-taxi-deep); }
.inquiry__form textarea { min-height: 7rem; resize: vertical; }

.swap-btn {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: var(--space-2xs);
  min-height: 44px;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--text-sm);
  text-transform: uppercase;
  letter-spacing: var(--track-wide);
  color: var(--color-on-tile);
  background: transparent;
  border: var(--border-mid) solid var(--color-line);
  border-radius: var(--radius-none);
  padding: var(--space-2xs) var(--space-md);
  cursor: pointer;
  white-space: nowrap;
  transition: background-color var(--dur-micro) var(--ease-out),
              color var(--dur-micro) var(--ease-out);
}
.swap-btn:hover { background: var(--color-taxi); }


.autocomplete-list {
  display: none;
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: var(--z-dropdown);
  background: var(--color-tile);
  border: var(--border-mid) solid var(--color-line);
  max-height: 16rem;
  overflow-y: auto;
}
.autocomplete-item {
  display: block;
  width: 100%;
  min-height: 44px;
  background: var(--color-tile);
  color: var(--color-on-tile);
  border: 0;
  text-align: left;
  padding: var(--space-sm) var(--space-md);
  cursor: pointer;
  border-bottom: 1px solid var(--hairline-on-light);
  transition: background-color var(--dur-micro) var(--ease-out);
}
.autocomplete-item:last-child { border-bottom: 0; }
.autocomplete-item:hover { background: var(--color-taxi); }
.autocomplete-item .main { display: block; font-weight: 700; color: var(--color-on-tile); }
.autocomplete-item .sub { display: block; font-size: var(--text-sm); color: var(--color-on-tile-soft); margin-top: 2px; }
.autocomplete-loading {
  padding: var(--space-sm) var(--space-md);
  font-size: var(--text-sm);
  color: var(--color-on-tile-soft);
}


#calc-loading {
  display: none;
  align-items: center;
  gap: var(--space-sm);
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--color-on-tile-soft);
}
#calc-loading.visible { display: flex; }
.spinner {
  width: 18px; height: 18px;
  flex: none;
  border: 3px solid var(--hairline-on-light);
  border-top-color: var(--color-taxi-deep);
  border-radius: var(--radius-round);
  animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }


#calc-result {
  display: none;
  flex-direction: column;
  gap: var(--space-md);
  border: var(--border-slab) solid var(--color-line);
  border-radius: var(--radius-none);
  padding: var(--space-md);
  background: var(--color-paper-2);
}
#calc-result.visible { display: flex; }
.calc-error {
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-on-tile);
  background: var(--color-taxi);
  color: var(--color-on-tile);
  font-size: var(--text-sm);
  font-weight: 600;
}
.map-fallback { padding: var(--space-lg); color: var(--color-ink); font-size: var(--text-sm); }
.calc-result__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-md);
}
.calc-result__grid > div { display: flex; flex-direction: column; gap: var(--space-3xs); }
.calc-result__lab {
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: var(--track-wide);
  color: var(--color-ink-soft);
}
.calc-result__val {
  font-family: var(--font-grotesk);
  font-weight: 600;
  font-size: var(--text-md);
  font-variant-numeric: tabular-nums;
  color: var(--color-ink);
}
.calc-price {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
  padding-top: var(--space-md);
  border-top: var(--border-mid) solid var(--color-taxi);
}
.calc-price__lab {
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: var(--track-wide);
  color: var(--color-ink-soft);
}
.calc-price__val {
  font-family: var(--font-grotesk);
  font-weight: 700;
  font-size: var(--text-2xl);
  line-height: 1;
  color: var(--color-taxi);
  font-variant-numeric: tabular-nums;
}
.calc-price__note { font-size: var(--text-xs); color: var(--color-ink-soft); }


.inquiry__info { gap: var(--space-md); }
.inquiry__info h3 { font-size: var(--text-lg); color: var(--color-ink); }
.inquiry__info > p { color: var(--color-ink-soft); max-width: 38ch; }
.inquiry__list { display: flex; flex-direction: column; gap: var(--space-xs); }
.inquiry__list li {
  position: relative;
  padding-left: var(--space-lg);
  font-size: var(--text-sm);
  color: var(--color-ink);
}
.inquiry__list li::before {
  content: "";
  position: absolute;
  left: 0; top: 0.5em;
  width: 0.6rem; height: 0.6rem;
  background: var(--color-taxi);
}
.inquiry__contact {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-xs);
  margin-top: auto;
  padding-top: var(--space-md);
  border-top: 1px solid var(--hairline-on-dark);
}
.inquiry__contact span { display: block; font-size: var(--text-sm); color: var(--color-ink-soft); }
.inquiry__contact a {
  font-family: var(--font-grotesk);
  font-weight: 700;
  font-size: var(--text-md);
  color: var(--color-taxi);
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}

.inquiry__form { gap: var(--space-md); }
.inquiry__form > div:not(.form-row) { display: flex; flex-direction: column; gap: var(--space-2xs); min-width: 0; }
.inquiry__form label { color: var(--color-on-tile-soft); }
.form-submit {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  align-items: flex-start;
  margin-top: var(--space-xs);
}
.form-privacy { font-size: var(--text-sm); color: var(--color-on-tile-soft); max-width: 44ch; }
.form-privacy a { color: var(--color-on-tile); text-decoration: underline; text-underline-offset: 2px; }


.foot {
  background: var(--color-paper);
  border-top: var(--border-slab) solid var(--color-line);
}
.foot__marquee { overflow: hidden; border-bottom: var(--border-slab) solid var(--color-line); }
.foot__track {
  max-width: var(--content-max);
  margin-inline: auto;
  padding: var(--space-md) var(--page-gutter);
}
.foot__track span {
  font-family: var(--font-display);
  font-size: clamp(var(--text-md), 2.5vw, var(--text-xl));
  text-transform: uppercase;
  letter-spacing: var(--track-wide);
  color: var(--color-taxi);
}
.foot__wordmark {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  text-transform: uppercase;
  letter-spacing: var(--track-wide);
  color: var(--color-ink);
}
.foot__tagline { font-size: var(--text-sm); color: var(--color-ink-soft); }
.foot__links { display: flex; flex-wrap: wrap; gap: var(--space-lg); }
.foot__links a {
  font-size: var(--text-sm);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--track-wide);
  color: var(--color-ink);
  white-space: nowrap;
  transition: color var(--dur-micro) var(--ease-out);
}
.foot__links a:hover { color: var(--color-taxi); }
.foot__meta { font-size: var(--text-sm); color: var(--color-ink-soft); }
.foot__meta a { color: var(--color-ink-soft); text-decoration: underline; text-underline-offset: 2px; }
.foot__meta a:hover { color: var(--color-taxi); }


.pin-start {
  background: var(--color-taxi);
  border: 3px solid var(--color-tile);
  border-radius: var(--radius-round);
  box-shadow: 0 0 0 2px var(--color-taxi-deep);
}
.pin-end {
  background: var(--color-on-tile);
  border: 3px solid var(--color-taxi);
  border-radius: var(--radius-round);
  box-shadow: 0 0 0 2px var(--color-on-tile);
}

.gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-md);
}


.shot {
  margin: 0;
  border: var(--border-slab) solid var(--color-line);
  background: var(--color-tile);
  overflow: clip;
}


.shot__img {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  display: grid;
  place-items: center;
  object-fit: cover;
  background: var(--color-tile-ink);
  color: var(--color-ink);
  overflow: clip;
}
.shot__img--taxi { background: var(--color-taxi); color: var(--color-on-tile); }
.shot__ico {
  width: clamp(3rem, 8vw, 5rem);
  height: clamp(3rem, 8vw, 5rem);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.shot__cap {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xs);
  padding: var(--space-sm) var(--space-md);
  border-top: var(--border-slab) solid var(--color-line);
  background: var(--color-tile);
  color: var(--color-on-tile);
}
.shot__cap strong {
  font-family: var(--font-grotesk);
  font-weight: 700;
  font-size: var(--text-md);
  letter-spacing: -0.01em;
}
.shot__cap span { font-size: var(--text-sm); color: var(--color-on-tile-soft); }

.gallery__note {
  margin-top: var(--space-lg);
  font-size: var(--text-sm);
  color: var(--color-ink-soft);
}


.backlink {
  color: var(--color-taxi);
  text-decoration: underline;
  text-underline-offset: 2px;
  white-space: nowrap;
}
.backlink:hover { color: var(--color-ink); }


@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }

  html { scroll-behavior: auto; }
}
