/*
ELEVA_SITE_VISUAL_CONTRAST_LOGO_IMPLEMENTATION_HML_1.0.8

Scope:
- exact institutional header brand component
- physiotherapy contrast corrections
- no footer rewrite
- no navigation rewrite
- no DOM observer
*/

:root {
  --eleva-v107-navy: #173b5d;
  --eleva-v107-navy-deep: #1e3a52;
  --eleva-v107-ivory: #fff7eb;
  --eleva-v107-body-light: #f4eadc;
  --eleva-v107-gold-light: #f2ca86;
  --eleva-v107-gold-dark: #76501d;
  --eleva-v107-body-dark: #324a5c;
  --eleva-v107-cream: #f3e9d7;
  --eleva-v107-pale-blue: #dce8ee;
}

/* ================================================================
   1. HEADER BRAND
   Exact binding proved by READ_ONLY 1.0.6:
   button.institutional-brand
   ================================================================ */

.institutional-header > button.institutional-brand {
  position: relative !important;
  isolation: isolate !important;
  flex: 0 0 174px !important;
  width: 174px !important;
  min-width: 174px !important;
  height: 76px !important;
  min-height: 76px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  cursor: pointer !important;
  transform-origin: 45% 50% !important;
  backface-visibility: hidden !important;
  will-change: transform !important;
  animation: eleva-v107-brand-float 10.5s ease-in-out infinite !important;
}

/* Keep accessible name in DOM, remove only visual text. */
.institutional-header > button.institutional-brand > strong,
.institutional-header > button.institutional-brand > small {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Soft breathing halo. Lower intensity than the lower-right light. */
.institutional-header > button.institutional-brand::before {
  content: "" !important;
  position: absolute !important;
  inset: -7px -10px !important;
  z-index: 0 !important;
  pointer-events: none !important;
  border-radius: 18px !important;
  opacity: .28 !important;
  background:
    radial-gradient(circle at 34% 50%,
      rgba(255,255,255,.98) 0 1.2%,
      rgba(255,235,190,.68) 2.5%,
      rgba(255,191,73,.34) 12%,
      rgba(232,91,33,.12) 26%,
      transparent 52%),
    linear-gradient(90deg,
      transparent 0 27%,
      rgba(255,255,255,0) 30%,
      rgba(255,224,154,.38) 34%,
      rgba(255,255,255,0) 38%,
      transparent 41% 100%),
    linear-gradient(0deg,
      transparent 0 42%,
      rgba(255,255,255,0) 45%,
      rgba(255,229,172,.32) 50%,
      rgba(255,255,255,0) 55%,
      transparent 58% 100%),
    radial-gradient(circle at 8% 23%, rgba(255,197,76,.62) 0 1px, transparent 1.8px),
    radial-gradient(circle at 90% 26%, rgba(255,255,255,.82) 0 1px, transparent 1.7px),
    radial-gradient(circle at 84% 78%, rgba(242,143,55,.56) 0 1px, transparent 1.8px),
    radial-gradient(circle at 18% 82%, rgba(255,255,255,.72) 0 1px, transparent 1.8px);
  filter: blur(.35px) !important;
  animation: eleva-v107-brand-aura 11.5s ease-in-out infinite !important;
}

/* Real rendered logo asset. */
.institutional-header > button.institutional-brand::after {
  content: "" !important;
  position: absolute !important;
  inset: 2px 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background-image: url("/assets/eleva-logo-3d-header-hml-1.0.8.webp") !important;
  background-repeat: no-repeat !important;
  background-position: left center !important;
  background-size: contain !important;
  filter:
    drop-shadow(0 2px 4px rgba(18,49,75,.10))
    drop-shadow(0 0 5px rgba(255,181,55,.13)) !important;
}

.institutional-header > button.institutional-brand:hover::after,
.institutional-header > button.institutional-brand:focus-visible::after {
  filter:
    drop-shadow(0 3px 6px rgba(18,49,75,.13))
    drop-shadow(0 0 8px rgba(255,181,55,.20)) !important;
}

.institutional-header > button.institutional-brand:focus-visible {
  outline: 2px solid var(--eleva-v107-navy) !important;
  outline-offset: 4px !important;
}

@keyframes eleva-v107-brand-float {
  0%, 100% { transform: translate3d(0,0,0) rotate(0deg); }
  26% { transform: translate3d(0,-1.2px,0) rotate(.10deg); }
  52% { transform: translate3d(0,-2.4px,0) rotate(-.08deg); }
  76% { transform: translate3d(0,-.8px,0) rotate(.06deg); }
}

@keyframes eleva-v107-brand-aura {
  0%, 100% { opacity: .20; transform: scale(.98); }
  48% { opacity: .34; transform: scale(1.025); }
  66% { opacity: .27; transform: scale(1.01); }
}

/* ================================================================
   2. PHYSIOTHERAPY - proved structural scope:
   .physio-page > ... > section.physio-life > article
   First article is the dark mobility panel.
   Second/third are the light Posture/Balance panels.
   ================================================================ */

.physio-page .physio-life > article:nth-of-type(1) {
  background-color: var(--eleva-v107-navy-deep) !important;
}

.physio-page .physio-life > article:nth-of-type(1) :is(h1,h2,h3,h4,p,span,strong,small,li) {
  color: var(--eleva-v107-ivory) !important;
  opacity: 1 !important;
}

.physio-page .physio-life > article:nth-of-type(1) .eyebrow {
  color: var(--eleva-v107-gold-light) !important;
}

.physio-page .physio-life > article:nth-of-type(2) {
  background-color: var(--eleva-v107-cream) !important;
}

.physio-page .physio-life > article:nth-of-type(3) {
  background-color: var(--eleva-v107-pale-blue) !important;
}

.physio-page .physio-life > article:nth-of-type(2) :is(h1,h2,h3,h4,p,span,strong,small,li),
.physio-page .physio-life > article:nth-of-type(3) :is(h1,h2,h3,h4,p,span,strong,small,li) {
  color: var(--eleva-v107-body-dark) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.physio-page .physio-life > article:nth-of-type(2) :is(h1,h2,h3,h4,strong),
.physio-page .physio-life > article:nth-of-type(3) :is(h1,h2,h3,h4,strong) {
  color: var(--eleva-v107-navy) !important;
}

.physio-page .physio-life > article:nth-of-type(2) .eyebrow,
.physio-page .physio-life > article:nth-of-type(3) .eyebrow {
  color: var(--eleva-v107-gold-dark) !important;
}

/* Classes are applied only by the scoped one-shot contrast audit in JS. */
.physio-page .eleva-v107-contrast-on-dark {
  color: var(--eleva-v107-ivory) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.physio-page .eleva-v107-contrast-on-light {
  color: var(--eleva-v107-navy) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.physio-page .eyebrow.eleva-v107-contrast-on-dark {
  color: var(--eleva-v107-gold-light) !important;
}

.physio-page .eyebrow.eleva-v107-contrast-on-light {
  color: var(--eleva-v107-gold-dark) !important;
}

@media (max-width: 900px) {
  .institutional-header > button.institutional-brand {
    flex-basis: 150px !important;
    width: 150px !important;
    min-width: 150px !important;
    height: 68px !important;
    min-height: 68px !important;
  }
}

@media (max-width: 640px) {
  .institutional-header > button.institutional-brand {
    flex-basis: 132px !important;
    width: 132px !important;
    min-width: 132px !important;
    height: 61px !important;
    min-height: 61px !important;
  }

  .institutional-header > button.institutional-brand::before {
    opacity: .18 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .institutional-header > button.institutional-brand,
  .institutional-header > button.institutional-brand::before {
    animation: none !important;
    transform: none !important;
  }
}

/* RELEASE_MARKER=ELEVA_SITE_VISUAL_CONTRAST_LOGO_IMPLEMENTATION_HML_1.0.8 */
