/* ============================================================
   BASE — reset + typography defaults, shared by index.html and about.html.
   Reconciled from styles.css's reset (properties the pages never
   redefine themselves: button/list/form resets, text-decoration,
   -webkit-text-size-adjust, line-height) plus the pages' own
   body/html/em/img/a values, which win where both defined the
   same property (font-family, font-weight, background, color).
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--f);
  font-weight: 400;
  background: var(--c-bg);
  color: var(--c-text);
  overflow-x: hidden;
  line-height: 1.6;
}
em { font-style: normal; }
img { display: block; max-width: 100%; }
a { text-decoration: none; color: inherit; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
ul, ol { list-style: none; }
input, textarea, select {
  font-family: inherit;
  font-size: inherit;
  border: none;
  outline: none;
  background: none;
}

.serif-italic { font-family: var(--f); font-style: normal !important; font-weight: 400; color: var(--c-text); }
.sec-h { font-size: clamp(28px, 6.4vw, 64px); font-weight: 400; line-height: 1.1; letter-spacing: -0.04em; color: var(--c-text); font-style: normal; }

.wrap { max-width: 1920px; margin: 0 auto; padding: 0 var(--gutter); }
section + section, section + footer, section + .contacts-footer-wrap { margin-top: clamp(64px, 10vw, 160px); }
@media (max-width: 1024px) { html { overflow-x: hidden; } }

/* ── Shared typewriter effect: [data-typewriter], driven by animations.js.
   Baseline opacity:0 until the script types the text in (see initSubtitleTypewriters). */
[data-typewriter] { opacity: 0; }
.type-cursor {
  display: inline-block; width: 2px; height: 0.9em; margin-left: 2px; margin-bottom: -0.1em;
  background: currentColor; opacity: 0.5; vertical-align: middle;
  animation: typeCursorBlink 0.9s steps(1) infinite;
}
@keyframes typeCursorBlink { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  [data-typewriter] { opacity: 1 !important; }
}

/* ── Shared Yandex map + branded pin — driven by map-widget.js.
   .rr-map fills whatever sized container it's placed in (.booking-map,
   .rv-map, .mh-services-contact__map, ...) exactly like the <iframe>
   it replaced. The pin is a small white card with the site logo and a
   pointer tail, built via ymaps' templateLayoutFactory rather than a
   plain default marker. */
.rr-map { width: 100%; height: 100%; display: block; }
.rr-map-pin {
  position: relative; display: flex; align-items: center; justify-content: center;
  width: 84px; height: 40px; background: #fff; border-radius: 10px;
  box-shadow: 0 6px 20px rgba(48,54,46,0.28);
}
.rr-map-pin__logo { width: 60px; height: auto; display: block; }
.rr-map-pin__tail {
  position: absolute; left: 50%; bottom: -7px; width: 14px; height: 14px;
  background: #fff; transform: translateX(-50%) rotate(45deg);
  border-radius: 0 0 3px 0; box-shadow: 2px 2px 4px rgba(48,54,46,0.12);
}
