/* OTORIXA — Header + mobile dock corporate color refresh
   Scope: public header, mobile drawer, mobile bottom dock and shared accent variables. */
:root{
  --otx-ink:#06111f;
  --otx-ink-2:#0a1a2f;
  --otx-panel:rgba(8,18,34,.84);
  --otx-panel-solid:#081528;
  --otx-line:rgba(148,190,220,.16);
  --otx-line-strong:rgba(56,189,248,.30);
  --otx-cyan:#38bdf8;
  --otx-cyan-soft:#7dd3fc;
  --otx-teal:#14b8a6;
  --otx-emerald:#22c55e;
  --otx-violet:#8b5cf6;
  --otx-text:#f4f9ff;
  --otx-muted:#a8bad0;
  --otx-muted-2:#7f93aa;

  /* Existing theme variables are visually remapped away from yellow/gold. */
  --bg:#06111f;
  --bg-card:linear-gradient(160deg,#0b1d33 0%,#06111f 100%);
  --bg-glass:rgba(7,17,31,.84);
  --bg-soft:#09172a;
  --border:rgba(148,190,220,.15);
  --border-hover:rgba(56,189,248,.35);
  --line:rgba(148,190,220,.10);
  --text:var(--otx-text);
  --muted:var(--otx-muted);
  --muted-soft:var(--otx-muted-2);
  --gold:#14b8a6;
  --gold-2:#38bdf8;
  --gold-bright:#8be9ff;
  --ai:#8b5cf6;
  --ai-bright:#a78bfa;
  --green:#22c55e;
  --green-bright:#86efac;
  --shadow-glow:0 10px 34px rgba(20,184,166,.20);
}

html{scroll-padding-top:calc(var(--hdr-offset,68px) + 14px)}
body.otx-public-vitrine{background-color:#06111f;background-image:radial-gradient(circle at 18% -8%,rgba(56,189,248,.20),transparent 36%),radial-gradient(circle at 88% 0%,rgba(20,184,166,.14),transparent 34%),linear-gradient(180deg,#06111f,#071426 46%,#06111f)}

/* Inline logo gradient refresh */
#otoGold stop:nth-child(1){stop-color:#8be9ff!important}
#otoGold stop:nth-child(2){stop-color:#38bdf8!important}
#otoGold stop:nth-child(3){stop-color:#14b8a6!important}
#otoCore stop:nth-child(2){stop-color:#8be9ff!important;stop-opacity:.45!important}
#otoCore stop:nth-child(3){stop-color:#14b8a6!important}

.progress-bar{background:linear-gradient(90deg,#14b8a6,#38bdf8,#8b5cf6,#38bdf8)!important;background-size:220% 100%}

.hdr{
  background:linear-gradient(180deg,rgba(7,17,31,.92),rgba(7,17,31,.78));
  border-bottom:1px solid rgba(148,190,220,.14);
  box-shadow:0 10px 36px rgba(0,0,0,.18);
}
.hdr.is-pinned{border-bottom-color:rgba(56,189,248,.22);box-shadow:0 14px 38px rgba(0,0,0,.28)}
.hdr-inner{height:72px;gap:14px}
.hdr-logo{filter:drop-shadow(0 8px 20px rgba(56,189,248,.18))}
.hdr-logo::before{background:radial-gradient(circle,rgba(56,189,248,.20),transparent 68%)}
.hdr-brand-text strong{
  background:linear-gradient(105deg,#fff 0%,#bfeeff 42%,#5eead4 74%,#fff 100%);
  background-size:190% 100%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.hdr-brand-tag{color:#9fd8ee;letter-spacing:.11em;opacity:.78;max-width:260px}

.hdr-nav{gap:4px}
.hdr-link{color:#a8bad0;border:1px solid transparent;background:transparent;font-weight:750;letter-spacing:.01em}
.hdr-link::after{display:none}
.hdr-link:hover,.hdr-link.is-active{color:#effaff;background:rgba(56,189,248,.08);border-color:rgba(56,189,248,.18)}
.hdr-link.is-active{box-shadow:inset 0 0 0 1px rgba(125,211,252,.08)}

.hdr-actions .btn-primary,.hdr-context-cta{
  background:linear-gradient(135deg,#38bdf8 0%,#14b8a6 55%,#22c55e 100%)!important;
  color:#03101e!important;
  border-color:rgba(125,211,252,.55)!important;
  box-shadow:0 12px 30px rgba(20,184,166,.22)!important;
  letter-spacing:.01em;
}
.hdr-actions .btn-primary:hover,.hdr-context-cta:hover{box-shadow:0 16px 38px rgba(56,189,248,.28)!important;transform:translateY(-1px)}
.btn-glow{animation:none!important}

.hdr-burger{border-color:rgba(56,189,248,.20);background:rgba(56,189,248,.06)}
.hdr-burger-line{background:#dff7ff}
.hdr-burger:hover{background:rgba(56,189,248,.12)}

.drawer-overlay{background:rgba(3,9,18,.68);backdrop-filter:blur(10px)}
.drawer{background:linear-gradient(180deg,#071427,#06101f);border-left:1px solid rgba(56,189,248,.18)}
.drawer-head{border-bottom:1px solid rgba(148,190,220,.12)}
.drawer-section-label{color:#7dd3fc!important;letter-spacing:.12em}
.drawer-link{border-color:rgba(148,190,220,.12);background:rgba(255,255,255,.025);color:#dbeafe}
.drawer-link:hover,.drawer-link.is-active{background:rgba(56,189,248,.08);border-color:rgba(56,189,248,.22);color:#fff}
.drawer-link-arrow{color:#7dd3fc!important}
.drawer-close{border-color:rgba(56,189,248,.20);background:rgba(56,189,248,.06)}

/* Mobile bottom dock: equal 5-slot navigation, no oversized always-contact button. */
.dock{
  background:rgba(6,17,31,.90)!important;
  border:1px solid rgba(148,190,220,.16)!important;
  box-shadow:0 -16px 44px rgba(0,0,0,.30)!important;
  backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px) saturate(1.15);
  gap:4px!important;
}
.dock-item{color:#9db4cc!important;border-radius:16px;min-width:0}
.dock-item::before{display:none!important}
.dock-icon{width:21px!important;height:21px!important;display:grid;place-items:center;color:currentColor}
.dock-icon svg{width:100%;height:100%;stroke-width:2.05}
.dock-label{font-size:.64rem!important;font-weight:800!important;letter-spacing:.01em!important}
.dock-item:hover,.dock-item.is-active{color:#effaff!important;background:rgba(56,189,248,.08)}
.dock-item--cta{color:#effaff!important;background:rgba(20,184,166,.10)!important;border:1px solid rgba(20,184,166,.20)}
.dock-item--cta .dock-label{color:#effaff!important}
.dock-cta-ring{width:25px!important;height:25px!important;background:transparent!important;border:0!important;box-shadow:none!important;color:inherit!important}
.dock-cta-ring::before,.dock-cta-pulse{display:none!important}
.dock-item--cta .dock-icon{color:inherit!important;width:21px!important;height:21px!important}

/* Footer/header icon balance; footer stays informational, not a second contact CTA. */
.ftr{background:linear-gradient(180deg,#071426,#050d19)!important;border-top-color:rgba(148,190,220,.12)!important}
.ftr-badge{color:#9fe8ff!important;border-color:rgba(56,189,248,.18)!important;background:rgba(56,189,248,.06)!important}
.ftr-badge-icon{color:#7dd3fc!important}
.ftr-link-all-locations,.ftr-bottom-tag{color:#7dd3fc!important}
.ftr-contact{color:#a8bad0}.ftr-contact svg{color:#7dd3fc}

@media (max-width:1024px){
  .hdr-brand-tag{max-width:210px}
}
@media (max-width:820px){
  body{padding-top:calc(64px + env(safe-area-inset-top,0px))!important}
  .hdr-inner{height:64px}
  .hdr-logo{width:36px;height:36px;flex-basis:36px}
  .hdr-brand-text strong{font-size:1.08rem;letter-spacing:.06em}
  .hdr-brand-tag{font-size:.54rem;max-width:170px}
  .hdr-actions{display:none!important}
  .hdr-burger{display:flex;width:42px;height:42px}
  .drawer{width:min(360px,92vw)}
  .drawer-nav{padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))}
  .dock{left:10px!important;right:10px!important;bottom:calc(8px + env(safe-area-inset-bottom,0px))!important;padding:8px 7px!important;border-radius:22px!important;grid-template-columns:repeat(5,minmax(0,1fr))!important}
  .dock-item{min-height:54px!important;padding:5px 2px!important;gap:4px!important}
  .dock-label{max-width:100%;font-size:.61rem!important}
}
@media (max-width:380px){
  .hdr-brand-tag{display:none}
  .dock-label{font-size:.58rem!important}
}
body.otx-header-compact .hdr-brand-tag{display:none}
body.otx-header-compact .hdr-link{padding-inline:10px;font-size:.80rem}


/* ────────────────────────────────────────────────────────────────────
   OTORIXA brand motion — mouse reactive logo + half-tone animated wordmark
   Controlled, corporate and mobile-safe. No layout shift.
   ──────────────────────────────────────────────────────────────────── */
.hdr-brand{
  position:relative!important;
  isolation:isolate;
  --otx-brand-mx:50%;
  --otx-brand-my:50%;
  --otx-brand-tilt:0deg;
  --otx-brand-tilt-y:0deg;
  --otx-brand-shift:0px;
  border-radius:20px;
  padding:4px 8px 4px 4px;
  margin-left:-4px;
}
.hdr-brand::after{
  content:"";
  position:absolute;
  inset:-8px -10px;
  border-radius:24px;
  pointer-events:none;
  opacity:0;
  z-index:-1;
  background:
    radial-gradient(circle at var(--otx-brand-mx) var(--otx-brand-my),rgba(139,92,246,.20),transparent 24%),
    radial-gradient(circle at calc(var(--otx-brand-mx) + 12%) calc(var(--otx-brand-my) + 8%),rgba(56,189,248,.20),transparent 30%),
    linear-gradient(135deg,rgba(56,189,248,.055),rgba(20,184,166,.035));
  filter:blur(.2px);
  transform:scale(.985);
  transition:opacity .24s ease,transform .24s ease;
}
.hdr-brand:hover::after,.hdr-brand.otx-brand-motion::after{opacity:1;transform:scale(1)}
.hdr-logo{
  position:relative!important;
  overflow:hidden!important;
  transform:perspective(700px) rotateZ(var(--otx-brand-tilt)) rotateY(var(--otx-brand-tilt-y)) translateY(var(--otx-brand-shift))!important;
  transform-origin:center;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,filter .22s ease;
}
.hdr-logo::after{
  content:"";
  position:absolute;
  inset:-42%;
  opacity:.48;
  background:conic-gradient(from 0deg,transparent 0 18%,rgba(56,189,248,.42) 26%,transparent 34% 52%,rgba(139,92,246,.42) 62%,transparent 72% 100%);
  animation:otxLogoOrbit 9s linear infinite;
  mix-blend-mode:screen;
  pointer-events:none;
}
.hdr-brand:hover .hdr-logo,.hdr-brand.otx-brand-motion .hdr-logo{
  border-color:rgba(167,139,250,.34)!important;
  box-shadow:0 16px 38px rgba(56,189,248,.20),0 0 0 1px rgba(139,92,246,.16) inset!important;
  filter:drop-shadow(0 8px 22px rgba(139,92,246,.20));
}
.hdr-brand-text strong{
  position:relative;
  display:inline-block;
  background:
    linear-gradient(90deg,#f8fbff 0 34%,#67e8f9 44%,#14b8a6 58%,#a78bfa 76%,#eef7ff 100%),
    radial-gradient(circle at var(--otx-brand-mx) var(--otx-brand-my),rgba(255,255,255,.9),transparent 32%);
  background-size:230% 100%,130% 130%;
  background-position:0% 50%,var(--otx-brand-mx) var(--otx-brand-my);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  text-shadow:0 0 24px rgba(56,189,248,.10);
  transition:letter-spacing .22s ease,filter .22s ease,background-position .18s ease;
}
.hdr-brand:hover .hdr-brand-text strong,.hdr-brand.otx-brand-motion .hdr-brand-text strong{
  animation:otxWordmarkFlow 2.8s ease-in-out infinite alternate;
  filter:drop-shadow(0 0 16px rgba(56,189,248,.16));
}
.hdr-brand-text strong::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-7px;height:1px;
  opacity:.0;
  background:linear-gradient(90deg,transparent,#38bdf8,#8b5cf6,transparent);
  transform:scaleX(.68);
  transform-origin:center;
  transition:opacity .22s ease,transform .22s ease;
}
.hdr-brand:hover .hdr-brand-text strong::after,.hdr-brand.otx-brand-motion .hdr-brand-text strong::after{opacity:.72;transform:scaleX(1)}
@keyframes otxWordmarkFlow{0%{background-position:0% 50%,var(--otx-brand-mx) var(--otx-brand-my)}100%{background-position:100% 50%,var(--otx-brand-mx) var(--otx-brand-my)}}
@keyframes otxLogoOrbit{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){
  .hdr-logo::after,.hdr-brand:hover .hdr-brand-text strong,.hdr-brand.otx-brand-motion .hdr-brand-text strong{animation:none!important}
  .hdr-logo{transform:none!important}
}
@media (max-width:820px){
  .hdr-brand{padding:2px 4px 2px 2px;margin-left:-2px;border-radius:16px}
  .hdr-brand::after{inset:-5px -7px;border-radius:19px}
  .hdr-brand-text strong::after{bottom:-5px}
}