:root {
  --content-max: 1365px;
  --gold: #cda173;
  --ink: #171717;
  --line: #e5e5e5;
}

* { box-sizing: border-box; }
html { font-family: "Myriad Pro", system-ui, -apple-system, BlinkMacSystemFont, sans-serif; scrollbar-width: thin; scrollbar-color: var(--gold) transparent; }
body { margin: 0; padding: 0; background: #fff; color: #000; }
img, video { display: block; max-width: 100%; }
a { text-decoration: none; }
button { font: inherit; }

::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--gold); border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: #b8925f; }

.layout-grid-lines { position: fixed; inset: 0; z-index: 60; pointer-events: none; }
.grid-line,
.section-center-line {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  background: var(--line);
  pointer-events: none;
}
.grid-line--left { left: max(calc((100% - var(--content-max)) / 2), 0px); }
.grid-line--right { right: max(calc((100% - var(--content-max)) / 2), 0px); }
.section-center-line {
  left: calc(max(100% - var(--content-max), 0px) / 2 + min(var(--content-max), 100%) / 2);
  transform: translateX(-0.5px);
  z-index: 2;
}
.section-center-line--dark,
.section-center-line--over-media { background: rgba(229, 229, 229, .75); }
.section-center-line--over-media { z-index: 2; }

.projects-feature-image-frame { margin-inline: -1rem; }

.map-gesture-hint {
  pointer-events: none;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 950;
  max-width: min(90vw, 420px);
  transform: translate(-50%, -50%);
  border-radius: .25rem;
  background: rgba(0, 0, 0, .78);
  padding: .85rem 1.1rem;
  color: #fff;
  font-size: .875rem;
  font-weight: 600;
  line-height: 1.35;
  text-align: center;
  opacity: 0;
  transition: opacity .18s ease;
}
.map-gesture-hint.is-visible { opacity: 1; }

.premium-map-marker { background: transparent; border: 0; }
.premium-map-marker span {
  display: block;
  width: 18px;
  height: 18px;
  border: 3px solid #e7c39d;
  border-radius: 999px;
  background: var(--gold);
  box-shadow: 0 0 0 7px rgba(205, 161, 115, .22);
  transition: transform .2s ease, box-shadow .2s ease;
}
.premium-map-marker:hover span { transform: scale(1.18); box-shadow: 0 0 0 9px rgba(205, 161, 115, .28); }
.premium-map-tooltip {
  border: 0;
  background: transparent;
  box-shadow: none;
  color: var(--gold);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.premium-map-tooltip::before { display: none; }
.projects-map--dark .leaflet-control-attribution { background: rgba(23, 23, 23, .72) !important; color: rgba(255, 255, 255, .55) !important; font-size: 10px !important; }
.projects-map--dark .leaflet-control-attribution a { color: rgba(255, 255, 255, .72) !important; }
.projects-map--dark .leaflet-tile-pane { filter: grayscale(1) invert(1) brightness(.58) contrast(1.08) sepia(.08); }
.projects-map--dark .leaflet-container { background: var(--ink); }

@media (min-width: 768px) {
  .projects-feature-image-frame { margin-inline: 0; }
}

@media (min-width: 1365px) {
  .projects-feature-image-frame { margin-left: calc((var(--content-max) - 100vw) / 2 - 1rem); }
  .projects-feature-image-frame--right { margin-left: 0; margin-right: calc((var(--content-max) - 100vw) / 2 - 1rem); }
}

@media (max-width: 767px) {
  .section-center-line { display: none !important; }
}
