
/* ui-enhancements.css — subtle, performant micro-interactions */
:root {
  --ease-out: cubic-bezier(.22,.61,.36,1);
  --ring: 0 0 0 3px rgba(37,99,235,.25);
}

/* Buttons and primary CTAs */
a.button, button, .btn, .cta {
  transition: transform .18s var(--ease-out), box-shadow .18s var(--ease-out), background-color .18s var(--ease-out), color .18s var(--ease-out);
}
a.button:hover, button:hover, .btn:hover, .cta:hover { transform: translateY(-1px); box-shadow: 0 8px 16px rgba(0,0,0,.08); }
a.button:active, button:active, .btn:active, .cta:active { transform: translateY(0); box-shadow: 0 4px 10px rgba(0,0,0,.06); }
a.button:focus-visible, button:focus-visible, .btn:focus-visible, .cta:focus-visible { outline: none; box-shadow: var(--ring); }

/* Links underline animation */
a:not(.button):not(.btn):not(.cta) {
  text-decoration: none;
  background-image: linear-gradient(currentColor, currentColor);
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 0% 1px;
  transition: background-size .2s var(--ease-out);
}
a:not(.button):not(.btn):not(.cta):hover { background-size: 100% 1px; }
a:not(.button):not(.btn):not(.cta):focus-visible { box-shadow: var(--ring); border-radius: 4px; }

/* Lang switcher lighter hover */
.lang-switcher.segmented a {
  transition: color .15s var(--ease-out);
}
.lang-switcher.segmented a:hover { color: #0b61d8; }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}


/* inline language links under H1 */
.lang-inline {
  margin: .25rem 0 1rem;
  font-size: .95rem;
  color: #475569;
}
.lang-inline a { color: inherit; text-decoration: none; }
.lang-inline a:hover { text-decoration: underline; }
.lang-inline a.cur { font-weight: 600; color: #0b61d8; }

/* partner badges layout spacing */
.partner-badges { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.partner-badges a { display: inline-flex; align-items: center; gap: 0.5rem; }


/* Ensure skip-link is only visible on focus */
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{left:16px;top:16px;width:auto;height:auto;padding:8px 12px;background:#fff;border:2px solid #111;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.2);z-index:10000}



/* --- Outdoor embed: responsive map --- */
.embed-map{border-radius:14px;overflow:hidden;background:#f3f4f6}
.embed-map iframe{width:100%;height:100%;border:0}

@supports (aspect-ratio: 1 / 1){
  .embed-map{aspect-ratio:16 / 9}
  @media (max-width: 640px){
    /* Taller map on phones so UI не "срезается" */
    .embed-map{aspect-ratio:4 / 5; min-height:380px}
  }
  @media (max-width: 480px){
    .embed-map{min-height:420px} /* extra safety for very small screens */
  }
}

/* Fallback for old browsers without aspect-ratio */
@supports not (aspect-ratio: 1 / 1){
  .embed-map{position:relative}
  .embed-map::before{content:"";display:block;padding-top:56.25%} /* 16:9 */
  .embed-map iframe{position:absolute;inset:0;width:100%;height:100%}
  @media (max-width: 640px){
    .embed-map::before{padding-top:125%} /* 4:5 on phones */
    .embed-map{min-height:380px}
  }
}


/* Outdoor CTA pill */
.outdoor-cta{display:inline-block;margin-left:8px;padding:6px 10px;border:1px solid #111;border-radius:999px;text-decoration:none;color:#111;font-size:14px;line-height:1}
.outdoor-cta:hover{background:#f6f7f9}
@media (max-width:640px){
  .outdoor-cta{margin-left:0;display:inline-block;margin-top:8px}
}


/* --- Outdoor page fit & overflow guard --- */
.outdoor-page main{overflow-x:hidden}
.outdoor-page .embed-map{max-width:100%;border-radius:16px;overflow:hidden;box-sizing:border-box}
.outdoor-page .embed-map iframe{display:block;width:100%;height:100%;border:0;border-radius:16px}

/* Safe paddings on very small screens to avoid visual spillover */
@media (max-width:420px){
  .outdoor-page .embed-map{margin-left:0;margin-right:0;min-height:440px}
}

/* In case some global styles set negative margins, clamp all iframes in this page */
.outdoor-page iframe{max-width:100%}




  /* remove rounding when stretching to the edges */
  .outdoor-page .embed-bleed .embed-map{ border-radius: 0 }
}

