/* =========================================================
   Header — fixed glass bar, dropdowns, full-screen mobile menu.
   ========================================================= */

html body{ padding-top:84px; }

.ouh{
	position:fixed; top:0; left:0; right:0; z-index:9995;
	background:rgba(8,8,11,.78);
	-webkit-backdrop-filter:saturate(160%) blur(14px);
	backdrop-filter:saturate(160%) blur(14px);
	border-bottom:1px solid rgba(255,255,255,.07);
	transition:background .3s ease, box-shadow .3s ease;
}
.ouh::after{ /* glowing red-line that appears on scroll */
	content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px;
	background:linear-gradient(90deg, transparent, var(--ou-accent) 20%, var(--ou-accent-2) 50%, var(--ou-accent) 80%, transparent);
	box-shadow:0 0 18px rgba(246,85,28,.65);
	transform:scaleX(0); transition:transform .5s var(--ou-ease);
}
.ouh.is-scrolled{ background:rgba(6,6,8,.94); box-shadow:0 10px 30px rgba(0,0,0,.45); }
.ouh.is-scrolled::after{ transform:scaleX(1); }

.ouh__bar{
	display:flex; align-items:center; gap:20px;
	height:84px; padding:0 clamp(16px,3vw,40px);
	transition:height .3s ease;
}
.ouh.is-scrolled .ouh__bar{ height:68px; }

/* logo */
.ouh__logo{ display:flex; align-items:center; gap:12px; margin-right:auto; color:#fff; }
.ouh__logo:hover{ color:#fff; }
.ouh__logo img{ width:auto; height:60px; transition:height .3s ease, transform .4s var(--ou-ease); filter:drop-shadow(0 4px 10px rgba(0,0,0,.5)); }
.ouh__logo:hover img{ transform:rotate(-6deg) scale(1.04); }
.ouh.is-scrolled .ouh__logo img{ height:48px; }
.ouh__word{
	display:flex; flex-direction:column;
	font-family:var(--ou-font-display) !important; font-weight:900 !important;
	font-size:28px; line-height:.9; letter-spacing:.04em !important; text-transform:uppercase; white-space:nowrap;
}
.ouh__word small{
	font-family:var(--ou-font); font-weight:600; font-size:10.5px; letter-spacing:.24em; color:var(--ou-accent); margin-top:5px;
}

/* desktop menu */
.ouh__menu{ display:flex; align-items:center; gap:2px; margin:0; padding:0; list-style:none; }
.ouh__menu > li{ position:relative; }
.ouh__menu > li > a,
.ouh__toggle{
	position:relative; display:block; padding:10px 13px; margin:0; background:none; border:0; cursor:pointer;
	font-family:var(--ou-font-display); font-weight:800; font-size:19px; letter-spacing:.06em; text-transform:uppercase;
	color:#ececf1;
}
.ouh__menu > li > a::after,
.ouh__toggle::after{ /* stick-blade underline */
	content:""; position:absolute; left:13px; right:13px; bottom:4px; height:3px;
	background:var(--ou-accent); transform:scaleX(0); transform-origin:left;
	clip-path:polygon(0 0,100% 0,calc(100% - 3px) 100%,0 100%);
	transition:transform .3s var(--ou-ease);
}
.ouh__menu > li > a:hover,
.ouh__menu > li:focus-within > a,
.ouh__toggle:hover,
.ouh__toggle[aria-expanded="true"]{ color:#fff; }
.ouh__menu > li > a:hover::after,
.ouh__menu > li > a[aria-current="page"]::after,
.ouh__menu > li.is-current > .ouh__toggle::after,
.ouh__toggle:hover::after,
.ouh__toggle[aria-expanded="true"]::after{ transform:scaleX(1); }
.ouh__toggle{ padding-right:26px; }
.ouh__toggle::before{
	content:""; position:absolute; right:11px; top:50%; width:6px; height:6px; margin-top:-5px;
	border-right:2px solid currentColor; border-bottom:2px solid currentColor;
	transform:rotate(45deg); transition:transform .25s ease;
}
.ouh__menu > li.has-sub:hover > .ouh__toggle::before,
.ouh__toggle[aria-expanded="true"]::before{ transform:translateY(3px) rotate(225deg); }
.ouh__sub{
	position:absolute; top:calc(100% + 6px); left:0; min-width:220px;
	margin:0; padding:8px; list-style:none;
	background:#0d0d11; border:1px solid var(--ou-border-strong); border-top:2px solid var(--ou-accent);
	box-shadow:0 22px 44px rgba(0,0,0,.6);
	clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%);
	opacity:0; visibility:hidden; transform:translateY(8px);
	transition:opacity .2s ease, transform .25s var(--ou-ease), visibility .2s;
}
.ouh__menu > li.has-sub::after{ content:""; position:absolute; left:0; right:0; top:100%; height:10px; } /* keeps hover alive across the gap (the dropdown is clipped, so the bridge sits on the li) */
.ouh__menu > li.has-sub:hover > .ouh__sub,
.ouh__toggle[aria-expanded="true"] + .ouh__sub{ opacity:1; visibility:visible; transform:none; }
.ouh__menu > li.has-sub.is-dismissed > .ouh__sub{ opacity:0; visibility:hidden; } /* Esc closes a hover-opened menu */
.ouh__sub a{
	display:flex; justify-content:space-between; gap:12px; padding:11px 14px; border-radius:8px;
	font-weight:600; font-size:14.5px; color:#d4d4da; white-space:nowrap;
}
.ouh__sub a:hover,
.ouh__sub a[aria-current="page"]{ background:rgba(246,85,28,.14); color:#fff; }
.ou-ext{ display:inline-block; width:.62em; height:.62em; flex:none; margin-left:.2em; vertical-align:.08em; }
.ouh__sub .ou-ext{ color:var(--ou-muted); }

/* tools: language + CTA + burger */
.ouh__tools{ display:flex; align-items:center; gap:12px; }
.ouh__lang{
	display:inline-flex; padding:3px; border-radius:999px;
	background:rgba(255,255,255,.06); border:1px solid var(--ou-border);
}
.ouh__lang a{
	padding:6px 11px; border-radius:999px;
	font-size:12.5px; font-weight:700; letter-spacing:.08em; color:var(--ou-muted);
}
.ouh__lang a:hover{ color:#fff; }
.ouh__lang a.is-active{ background:var(--ou-fill); color:#fff; }
.ouh__cta{ padding:11px 20px; font-size:13px; --ou-chamfer:9px; }

.ouh__burger{
	display:none; position:relative; width:46px; height:46px; padding:0; cursor:pointer;
	background:rgba(255,255,255,.06); border:1px solid var(--ou-border); border-radius:12px;
}
.ouh__burger span{
	position:absolute; left:12px; right:12px; height:2px; border-radius:2px; background:#fff;
	transition:transform .35s var(--ou-ease), opacity .2s ease, top .35s var(--ou-ease);
}
.ouh__burger span:nth-child(1){ top:15px; }
.ouh__burger span:nth-child(2){ top:22px; right:18px; }
.ouh__burger span:nth-child(3){ top:29px; }
.ouh__burger.is-open span:nth-child(1){ top:22px; transform:rotate(45deg); }
.ouh__burger.is-open span:nth-child(2){ opacity:0; }
.ouh__burger.is-open span:nth-child(3){ top:22px; transform:rotate(-45deg); }

/* keep the bar below the WP admin bar */
.admin-bar .ouh{ top:32px; }
@media (max-width:782px){ .admin-bar .ouh{ top:46px; } }
@media (max-width:600px){ .admin-bar .ouh{ top:0; } }

/* ---------- mobile panel ---------- */
.ouh-panel{
	position:fixed; inset:0; z-index:9994;
	display:flex; flex-direction:column;
	padding:110px clamp(20px,6vw,48px) 28px;
	overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; touch-action:pan-y;
	clip-path:circle(0 at calc(100% - 44px) 42px);
	transition:clip-path .6s cubic-bezier(.7,0,.2,1), visibility .6s;
	visibility:hidden;
}
.ouh-panel[hidden]{ display:flex; } /* JS controls visibility; keep layout for the reveal */
.ouh-panel.is-open{ clip-path:circle(150% at calc(100% - 44px) 42px); visibility:visible; }
.ouh-panel__rink{ position:fixed; right:-160px; top:auto; bottom:-120px; transform:none; width:520px; color:rgba(246,85,28,.1); }
.ouh-panel__list{ list-style:none; margin:0; padding:0; display:grid; gap:4px; }
.ouh-panel__list > li{
	opacity:0; transform:translateX(-24px);
	transition:opacity .45s ease, transform .5s var(--ou-ease);
	transition-delay:calc(.18s + var(--i) * .05s);
	border-bottom:1px solid rgba(255,255,255,.07); padding:6px 0;
}
.ouh-panel.is-open .ouh-panel__list > li{ opacity:1; transform:none; }
.ouh-panel__list > li > a,
.ouh-panel__label{
	display:flex; align-items:baseline; gap:14px;
	font-family:var(--ou-font-display); font-weight:900; font-size:clamp(38px,10vw,56px); line-height:1.05; text-transform:uppercase;
	color:#fff; min-width:0; overflow-wrap:anywhere;
}
.ouh-panel__list > li > a:hover,
.ouh-panel__list a[aria-current="page"]{ color:var(--ou-accent); }
.ouh-panel__list > li > a .ou-ext{ width:.34em; height:.34em; align-self:flex-start; margin:.2em 0 0 -.1em; color:var(--ou-muted); }
.ouh-panel__sub .ou-ext{ width:9px; height:9px; margin-left:5px; vertical-align:1px; color:var(--ou-muted); }
.ouh-panel__list em{ font-style:normal; font-family:var(--ou-font); font-size:13px; font-weight:700; letter-spacing:.1em; color:var(--ou-accent); transform:translateY(-14px); }
.ouh-panel__label{ margin:0; }
.ouh-panel__sub{ display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:6px 0 10px 32px; list-style:none; }
.ouh-panel__sub a{
	display:inline-block; min-height:24px;
	padding:8px 14px; border-radius:999px; background:rgba(255,255,255,.06); border:1px solid var(--ou-border);
	font-weight:600; font-size:14.5px; color:#e4e4ea;
}
.ouh-panel__foot{
	display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:16px;
	margin-top:auto; padding-top:26px;
	opacity:0; transition:opacity .4s ease .5s;
}
.ouh-panel.is-open .ouh-panel__foot{ opacity:1; }
body.ouh-lock{ overflow:hidden; }
body.ouh-lock .ou-ig{ display:none; }

/* ---------- breakpoints ---------- */
@media (max-width:1240px){
	.ouh__nav{ display:none; }
	.ouh__burger{ display:block; }
}
@media (max-width:600px){
	html body{ padding-top:72px; }
	.ouh__bar,.ouh.is-scrolled .ouh__bar{ height:72px; gap:10px; }
	.ouh__logo img,.ouh.is-scrolled .ouh__logo img{ height:46px; }
	.ouh__word{ font-size:22px; }
	.ouh__word small{ font-size:9px; letter-spacing:.2em; }
	.ouh__tools .ouh__lang,.ouh__tools .ouh__cta{ display:none; }
	.ouh-panel{ padding-top:96px; }
}
@media (min-width:1241px){ .ouh-panel{ display:none !important; } }
@media (prefers-reduced-motion: reduce){
	.ouh-panel{ transition:visibility .01s; }
	.ouh-panel__list > li{ transition:none; opacity:1; transform:none; }
}

/* single pause/resume button for all animations */
.ouh__motion{ width:36px; height:36px; flex:none; background:transparent; border-color:var(--ou-border); color:#c9c9d1; }
.ouh__motion:hover{ color:#fff; }
