/* OndaFlix adaptation of the owner's Contaí floating glass navigation. */
html:has(.of-header){scrollbar-gutter:stable}
.site-header.of-header{--header-shift:0px;--header-progress:0;--header-ease:cubic-bezier(.22,1,.36,1);position:relative;top:auto;z-index:80;height:auto;background:none;border:0;backdrop-filter:none;color:var(--header-ink)}
.of-header .announcement{position:relative;display:flex;justify-content:center;align-items:center;gap:10px;height:40px;min-height:0;padding:0 56px;background:linear-gradient(100deg,#22c6e8,#89eaf5 55%,#25c5e9);color:#063245;border:0;overflow:hidden;font-size:13px;transition:height .45s var(--header-ease),visibility 0s .45s}
.of-header .announcement>a{display:inline-flex;align-items:center;gap:9px;min-height:40px;color:inherit;font-size:13px;font-weight:650}
.of-header .announcement a svg{width:16px;height:16px}
.of-header .announcement .live-dot{background:#08718e;box-shadow:0 0 0 4px #06749113}
.of-header .announcement.is-closed{height:0;visibility:hidden}
.announcement-close{position:absolute;right:max(4px,env(safe-area-inset-right));top:50%;margin-top:-24px;width:48px;height:48px;display:grid;place-items:center;color:inherit;background:none;border:0;border-radius:50%;cursor:pointer}
.announcement-close:hover{background:#ffffff50}.announcement-close svg{width:17px;height:17px}
.header-frame{position:fixed;z-index:80;top:12px;left:0;right:0;display:flex;flex-direction:column;align-items:center;pointer-events:none;transform:translate3d(0,var(--header-shift),0)}
.of-header .nav-shell{position:relative;pointer-events:auto;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;width:min(1240px,calc(100% - 32px - env(safe-area-inset-left) - env(safe-area-inset-right)));height:66px;min-height:0;margin:0;padding:0 10px 0 24px;overflow:hidden;border-radius:999px;border:1px solid var(--header-border);background:var(--header-glass);backdrop-filter:blur(22px) saturate(1.35);-webkit-backdrop-filter:blur(22px) saturate(1.35);box-shadow:inset 0 1px var(--header-inner-edge),0 18px 50px -18px #092b3e65,0 6px 18px -8px #06a7d32b;transition:width .55s var(--header-ease),height .45s var(--header-ease),box-shadow .4s}
.of-header.scrolled{background:none;border:0;backdrop-filter:none;box-shadow:none}
.of-header.scrolled .nav-shell{width:min(1000px,calc(100% - 32px - env(safe-area-inset-left) - env(safe-area-inset-right)));height:56px;box-shadow:inset 0 1px var(--header-inner-edge),0 14px 40px -15px #05293b60}
.of-header .brand{display:inline-flex;align-items:center;gap:9px;min-height:48px;white-space:nowrap;color:var(--header-ink);font-size:26px;line-height:1;font-weight:800;border-radius:14px}
.of-header .brand-light{color:inherit}.of-header .brand img{width:40px;height:31px}
.of-header .desktop-nav{display:none;justify-self:center;gap:0}
.header-nav-track{position:relative;display:flex;align-items:center;gap:2px}
.of-header .desktop-nav a{position:relative;display:inline-flex;align-items:center;min-height:48px;padding:0 14px;border-radius:999px;color:var(--header-muted);font-size:14px;line-height:1.2;font-weight:650;white-space:nowrap;transition:box-shadow .25s}
.of-header .desktop-nav a:hover{color:var(--header-ink);background:var(--header-hover)}.of-header .desktop-nav a[aria-current]{color:var(--header-ink)}
.header-nav-indicator{position:absolute;top:50%;left:0;height:40px;margin-top:-20px;border-radius:999px;background:var(--header-active);box-shadow:inset 0 0 0 1px #3ac7e538,0 3px 12px #0fb3db14;transition:transform .5s cubic-bezier(.34,1.3,.5,1),width .5s cubic-bezier(.34,1.3,.5,1);pointer-events:none}
.header-actions{display:flex;align-items:center;gap:8px;justify-self:end}
.of-header .nav-cta{display:none;min-height:48px;padding:10px 20px;font-size:13px;line-height:1.1;white-space:nowrap;color:#063245;box-shadow:inset 0 1px 1px #ffffffbb,inset 0 -2px 5px #0788b426,0 4px 14px #0bbadd24}
.of-header .nav-cta svg{width:17px;height:17px}
.of-header .menu-toggle{display:grid;position:relative;place-items:center;flex-shrink:0;width:48px;height:48px;min-height:48px;padding:0;border:0;border-radius:50%;background:var(--header-hover);color:var(--header-ink);cursor:pointer}
.of-header .menu-toggle span{position:absolute;left:14px;top:17px;width:20px;height:2px;border-radius:2px;background:currentColor;transform:none;transition:transform .4s var(--header-ease),opacity .2s,top .4s var(--header-ease)}
.of-header .menu-toggle span:nth-child(2){top:23px}.of-header .menu-toggle span:nth-child(3){top:29px}
.of-header .menu-toggle[aria-expanded=true] span:first-child{top:23px;transform:rotate(45deg)}
.of-header .menu-toggle[aria-expanded=true] span:nth-child(2){opacity:0;transform:none}
.of-header .menu-toggle[aria-expanded=true] span:nth-child(3){top:23px;transform:rotate(-45deg)}
.of-header .mobile-nav{position:relative;pointer-events:auto;display:flex;flex-direction:column;gap:2px;width:min(560px,calc(100% - 32px - env(safe-area-inset-left) - env(safe-area-inset-right)));max-height:calc(100dvh - 142px - var(--header-shift));margin:8px 0 0;padding:14px;border-radius:30px;border:1px solid var(--header-border);background:var(--header-panel);backdrop-filter:blur(22px) saturate(1.35);-webkit-backdrop-filter:blur(22px) saturate(1.35);box-shadow:0 20px 60px #062a3d40;overflow-y:auto;overscroll-behavior:contain;color:var(--header-ink);animation:header-panel-in .4s var(--header-ease) both}
.of-header .mobile-nav[hidden],.header-scrim[hidden],.header-nav-indicator[hidden]{display:none}
.of-header .mobile-nav{inset:auto}
.of-header .header-frame:not(.open) .mobile-nav:not([hidden]){animation:header-panel-out .18s ease both;pointer-events:none}
.of-header .mobile-nav>a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;margin:0;padding:10px 16px;border-radius:18px;color:var(--header-ink);font-size:19px;line-height:1.25;font-weight:700;border:0;text-decoration:none;animation:header-link-in .4s var(--header-ease) both;animation-delay:calc(var(--nav-order,0)*25ms)}
.of-header .mobile-nav>a>.header-menu-arrow{font-size:17px;color:var(--header-muted)}.of-header .mobile-nav>a:hover{background:var(--header-hover)}
.header-panel-actions{display:grid;gap:10px;margin-top:10px;padding-top:14px;border-top:1px solid var(--header-border)}
.header-panel-actions .button{min-height:48px;font-size:14px;color:#063245}
.header-progress{position:absolute;inset:auto 0 0;height:3px;background:linear-gradient(90deg,#14b6dc,#4addf5,#05a9d7);transform:scaleX(var(--header-progress));transform-origin:0 50%;pointer-events:none}
.header-scrim{position:fixed;inset:0;z-index:79;border:0;background:#06152366;backdrop-filter:blur(6px);animation:header-scrim-in .25s ease both;cursor:pointer}
.header-spacer{height:94px;pointer-events:none}
.of-header a:focus-visible,.of-header button:focus-visible{outline:2px solid var(--header-focus);outline-offset:2px}
.of-header[data-header-simple] .nav-shell{grid-template-columns:1fr auto}
.of-header .assistant-header-help{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:10px 16px;border:1px solid #a6ddeb;border-radius:999px;background:#e5f8ff;color:#175267;font-size:13px;line-height:1.2;font-weight:700;white-space:nowrap}
.of-header .assistant-header-help svg{width:18px;height:18px}
.of-header+main .hero{margin-top:0;padding-top:0}
@keyframes header-panel-in{from{opacity:0;transform:translateY(-12px) scale(.98)}to{opacity:1;transform:none}}
@keyframes header-link-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@keyframes header-scrim-in{from{opacity:0}to{opacity:1}}
@keyframes header-panel-out{to{opacity:0;transform:translateY(-8px) scale(.99)}}
@media(min-width:1100px){.of-header .desktop-nav{display:flex}.of-header .nav-cta{display:inline-flex}.of-header .menu-toggle,.of-header .mobile-nav,.header-scrim{display:none!important}}
@media(min-width:540px) and (max-width:1099px){.of-header .nav-shell{grid-template-columns:1fr auto}.of-header .nav-cta{display:inline-flex}}
@media(max-width:539px){.of-header .announcement{height:48px;padding:0 52px 0 12px}.of-header .announcement>a{min-height:48px;font-size:12px}.of-header .announcement>span:not(.live-dot){display:none}.of-header .announcement .live-dot{display:none}.of-header .announcement.is-closed{height:0}.of-header .nav-shell{height:60px;padding:0 6px 0 18px;grid-template-columns:1fr auto}.of-header.scrolled .nav-shell{height:54px}.of-header .brand{font-size:24px;gap:8px}.of-header .brand img{width:36px;height:28px}.header-spacer{height:84px}.of-header .mobile-nav{padding:10px;max-height:calc(100dvh - 108px - var(--header-shift))}.of-header .mobile-nav>a{min-height:50px;font-size:18px}.of-header .assistant-header-help{min-height:44px;font-size:12px;padding:8px 11px}}
@media(max-width:359px){.of-header .brand{font-size:21px;gap:6px}.of-header .brand img{width:33px;height:25px}.of-header[data-header-simple] .nav-shell{padding-left:13px;gap:8px}.of-header .assistant-header-help{gap:5px;font-size:11px;padding:8px}.of-header .assistant-header-help svg{width:16px;height:16px}}
@media(prefers-reduced-motion:reduce){.of-header *,.of-header *:before,.of-header *:after{animation:none!important;transition:none!important}}
.reduce-motion .of-header *,.reduce-motion .of-header *:before,.reduce-motion .of-header *:after{animation:none!important;transition:none!important}

/* Foreground and tint switch together: no low-contrast crossfade between tones. */
.of-header[data-tone=dark]{
  --header-glass:rgba(8,24,35,.76);
  --header-panel:rgba(8,24,35,.94);
  --header-solid:#081823;
  --header-ink:#eff9fc;
  --header-muted:#c9dee8;
  --header-border:rgba(177,223,243,.22);
  --header-inner-edge:rgba(239,249,252,.12);
  --header-hover:rgba(197,238,252,.09);
  --header-active:rgba(30,159,193,.18);
  --header-focus:#72ddfb;
}
.of-header[data-tone=light]{
  --header-glass:rgba(241,249,253,.78);
  --header-panel:rgba(241,249,253,.96);
  --header-solid:#f1f9fd;
  --header-ink:#123442;
  --header-muted:#264b5c;
  --header-border:rgba(255,255,255,.65);
  --header-inner-edge:rgba(255,255,255,.72);
  --header-hover:rgba(12,81,110,.07);
  --header-active:rgba(15,168,208,.12);
  --header-focus:#006987;
}
.of-header .brand,.of-header .desktop-nav a,.of-header .menu-toggle,.of-header .mobile-nav>a{transition-property:box-shadow;transition-duration:.18s}
.of-header .announcement :focus-visible{outline-color:#063245;outline-offset:-3px}
.of-header .announcement .announcement-close:focus-visible{outline-offset:-6px}
@supports not (backdrop-filter:blur(1px)){
  @supports not (-webkit-backdrop-filter:blur(1px)){
    .of-header .nav-shell,.of-header .mobile-nav{background:var(--header-solid)}
  }
}