/* SANKUPRA Header Controls — intentionally scoped to the existing header selectors. */
.utility-header {
  min-height: calc(var(--skh-social-size, 30px) + 12px);
  height: auto;
  background: var(--skh-utility-bg, #102631);
}

.utility-social a {
  width: var(--skh-social-size, 30px);
  height: var(--skh-social-size, 30px);
  flex: 0 0 var(--skh-social-size, 30px);
  display: grid;
  place-items: center;
  border-radius: 50%;
  transition: transform .18s ease, filter .18s ease;
}

.utility-social a:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
}

.utility-social a:focus-visible {
  outline: 3px solid #c9a227;
  outline-offset: 2px;
}

.utility-social a svg {
  width: 56%;
  height: 56%;
}

/* Recognisable social brand colours. */
.skh-social-circles .utility-social a[aria-label="Instagram"] {
  color: #fff;
  background: radial-gradient(circle at 30% 105%, #fdf497 0 6%, #fd5949 38%, #d6249f 62%, #285aeb 100%);
}
.skh-social-circles .utility-social a[aria-label="Facebook"] { color: #fff; background: #1877f2; }
.skh-social-circles .utility-social a[aria-label="YouTube"] { color: #fff; background: #ff0000; }
.skh-social-circles .utility-social a svg { fill: currentColor; }
.skh-social-circles .footer-social-brand .social-instagram { background: radial-gradient(circle at 30% 105%, #fdf497 0 6%, #fd5949 38%, #d6249f 62%, #285aeb 100%); }
.skh-social-circles .footer-social-brand .social-facebook { background: #1877f2; }
.skh-social-circles .footer-social-brand .social-linkedin { background: #0a66c2; }
.skh-social-circles .footer-social-brand .social-twitter { background: #1da1f2; }
.skh-social-circles .footer-social-brand .social-youtube { background: #ff0000; }
.skh-social-circles .footer-social-brand .social-whatsapp { background: #25d366; }

.skh-social-icons .utility-social a { background: transparent; }
.skh-social-icons .utility-social a[aria-label="Instagram"] { color: #e1306c; }
.skh-social-icons .utility-social a[aria-label="Facebook"] { color: #1877f2; }
.skh-social-icons .utility-social a[aria-label="YouTube"] { color: #ff0000; }
.skh-social-icons .utility-social a svg { width: 72%; height: 72%; fill: currentColor; }
.skh-social-icons .footer-social-brand a { background: transparent !important; }
.skh-social-icons .footer-social-brand .social-facebook { color: #1877f2; }
.skh-social-icons .footer-social-brand .social-instagram { color: #e1306c; }
.skh-social-icons .footer-social-brand .social-linkedin { color: #0a66c2; }
.skh-social-icons .footer-social-brand .social-twitter { color: #1da1f2; }
.skh-social-icons .footer-social-brand .social-youtube { color: #ff0000; }
.skh-social-icons .footer-social-brand .social-whatsapp { color: #25d366; }
.skh-social-icons .footer-social-brand svg { fill: currentColor; }

.skh-social-white .utility-social a { background: transparent; color: #fff; }
.skh-social-white .utility-social a svg { width: 68%; height: 68%; fill: currentColor; }
.skh-social-white .footer-social-brand a { background: transparent !important; color: #fff; }
.skh-social-white .footer-social-brand svg { fill: currentColor; }

@media (max-width: 900px) {
  .main-nav.open {
    z-index: 999;
    top: 64px;
    max-height: calc(100vh - 64px);
    overflow-y: auto;
    padding: 30px clamp(28px, 7vw, 48px);
    background: var(--skh-menu-bg, #fff);
    color: var(--skh-menu-text, #596568);
    box-shadow: 0 18px 38px rgba(6, 20, 38, .14);
  }

  .main-nav.open a { color: var(--skh-menu-text, #596568); }

  .skh-width-compact.skh-menu-left .main-nav.open {
    left: 0;
    right: auto;
    width: min(390px, 92vw);
    border-radius: 0 0 22px 0;
  }

  .skh-width-compact.skh-menu-center .main-nav.open {
    left: 50%;
    right: auto;
    width: min(520px, calc(100vw - 20px));
    transform: translateX(-50%);
    border-radius: 0 0 22px 22px;
  }

  .skh-width-compact.skh-menu-right .main-nav.open {
    left: auto;
    right: 0;
    width: min(390px, 92vw);
    border-radius: 0 0 0 22px;
  }

  .skh-width-full .main-nav.open {
    left: 0;
    right: 0;
    width: 100%;
    transform: none;
    border-radius: 0 0 22px 22px;
  }

  .skh-align-left .main-nav.open ul { align-items: flex-start; text-align: left; }
  .skh-align-center .main-nav.open ul { align-items: center; text-align: center; }
  .skh-align-right .main-nav.open ul { align-items: flex-end; text-align: right; }

  .main-nav.open ul { gap: 0; }
  .main-nav.open li { width: 100%; }
  .main-nav.open a {
    display: block;
    padding: 14px 0;
    font-size: 17px;
    line-height: 1.3;
  }

  .skh-align-center .main-nav.open a { text-align: center; }
  .skh-align-right .main-nav.open a { text-align: right; }
}

@media (max-width: 600px) {
  .utility-header { padding-inline: 14px; }
  .utility-social { gap: 10px; }
  .main-nav.open { top: 64px; }
}

@media (prefers-reduced-motion: reduce) {
  .utility-social a { transition: none; }
}
