/* Shared provider/frontdoor header. Keep this file identical across landing worktrees.
   Extracted from the approved provider bar; page controllers own scroll state. */
.vein-header { box-sizing:border-box; font-family:var(--font-anuphan),Anuphan,Arial,sans-serif; font-weight:400; line-height:1.5; border:0; box-shadow:none; color-scheme:light; }
.vein-header *, .vein-header *::before, .vein-header *::after { box-sizing:border-box; }
.vein-header button { font:inherit; cursor:pointer; }
.vein-header a { text-decoration:none; }
.vein-header :is(button,a):focus-visible { outline:2px solid #0569ff; outline-offset:4px; }
.vein-header-mark { display:block; width:110px; height:34px; position:relative; overflow:hidden; }
.vein-header-mark img { position:absolute; max-width:none; width:140.6px; height:140.6px; left:-15.3px; top:-53.6px; }
.vein-header { --pill-w:min(984px,calc(100vw - 48px)); --panel-w:min(1398px,calc(100vw - 40px)); --panel-h:min(820px,calc(100dvh - 40px)); position:fixed; z-index:40; left:50%; top:calc(16px + 4px * var(--morph)); transform:translateX(-50%); width:calc(var(--pill-w) + (var(--panel-w) - var(--pill-w)) * var(--morph)); height:calc(64px + (var(--panel-h) - 64px) * var(--morph)); border-radius:calc(32px - 12px * var(--morph)); background:color-mix(in srgb,#ffffff38 calc((1 - var(--morph)) * 100%),#131922 calc(var(--morph) * 100%)); backdrop-filter:blur(calc(20px * (1 - var(--morph)))); transition:opacity .28s cubic-bezier(.16,1,.3,1),transform .32s cubic-bezier(.16,1,.3,1),background .7s; animation:veinHeaderIn .7s 1.14s both; overflow:hidden; }
.vein-header:has(.vein-header-language-menu) { overflow:visible; }
.vein-header-row { position:absolute; z-index:3; width:100%; height:64px; padding:8px 8px 8px 24px; display:flex; align-items:center; justify-content:space-between; }
.vein-header-brand { position:absolute; left:calc(24px + (50% - 24px) * var(--morph)); translate:calc(-50% * var(--morph)) 0; }
.vein-header-expanded .vein-header-brand .vein-header-mark,.vein-header-dark .vein-header-mark { filter:brightness(0) invert(1); }
.vein-audience-switcher { position:absolute; z-index:1; left:50%; top:50%; display:flex; align-items:center; gap:2px; max-width:calc(100% - 430px); padding:4px; border:1px solid #ffffff66; border-radius:999px; background:#ffffff2e; box-shadow:inset 0 1px #ffffff52,0 8px 24px #13273d12; backdrop-filter:blur(18px) saturate(125%); transform:translate(-50%,-50%); transition:opacity .28s ease,transform .32s cubic-bezier(.16,1,.3,1); }
.vein-audience-switcher a { display:flex; align-items:center; justify-content:center; min-height:38px; padding:7px 13px; border-radius:999px; color:#27364a; font-size:12px; font-weight:500; line-height:1.2; white-space:nowrap; transition:background .2s ease,color .2s ease,box-shadow .2s ease; }
.vein-audience-switcher a:hover { background:#ffffff70; }
.vein-audience-switcher a[aria-current="page"] { color:#17283d; background:#fff; box-shadow:0 2px 8px #13273d1c,inset 0 0 0 1px #ffffff; font-weight:600; }
.vein-audience-divider { width:1px; height:18px; flex:none; background:#213e6038; }
.vein-audience-label-short { display:none; }
.vein-header-dark .vein-audience-switcher { border-color:#ffffff42; background:#ffffff18; }
.vein-header-dark .vein-audience-switcher a { color:#f8fbff; }
.vein-header-dark .vein-audience-switcher a:hover { background:#ffffff26; }
.vein-header-dark .vein-audience-switcher a[aria-current="page"] { color:#17283d; background:#fff; }
.vein-header-expanded .vein-audience-switcher { opacity:0; pointer-events:none; transform:translate(-50%,-50%) scale(.94); }
.vein-header-actions { display:flex; gap:8px; align-items:center; margin-left:auto; }
.vein-header-locale { position:relative; }
.vein-header-language { border:1px solid #e5e5e5; background:#ffffff7a; color:#2b313b; display:flex; gap:8px; align-items:center; border-radius:999px; padding:0 12px; height:48px; font-size:12px!important; }
.vein-header-language-menu { position:absolute; right:0; top:56px; width:140px; background:white; box-shadow:0 8px 32px #0002; padding:6px; border-radius:14px; color:#2b313b; }
.vein-header-language-menu button { border:0; background:transparent; width:100%; display:flex; justify-content:space-between; padding:10px; border-radius:8px; font-size:14px; }
.vein-header-language-menu button:hover { background:#f0f2f6; }
.vein-header-dismiss { position:fixed; inset:0; border:0; background:transparent; z-index:35; }
.vein-header-dark { background:rgba(20,40,62,.9); border:1px solid rgba(255,255,255,.18); box-shadow:0 10px 30px rgba(8,25,42,.18); }
.vein-header-dark .vein-header-language,.vein-header-expanded .vein-header-language { color:white; background:#ffffff1f; border-color:#ffffff38; }
.vein-header-cta { background:#131922; color:white; height:48px; border-radius:999px; display:flex; align-items:center; white-space:nowrap; max-width:0; padding-inline:0; opacity:0; overflow:hidden; font-size:16px; transition:max-width .68s cubic-bezier(.33,0,.2,1),padding .68s,opacity .32s .12s; }
.vein-header-ready .vein-header-cta { max-width:176px; padding-inline:24px; opacity:calc(1 - min(1,var(--morph) * 5)); }
.vein-header-dark .vein-header-cta { background:white; color:#131922; }
.vein-header-hidden { opacity:0!important; pointer-events:none; transform:translate(-50%,calc(-100% - 24px)); }
.vein-header-expanded .vein-header-cta { max-width:0; padding-inline:0; opacity:0; pointer-events:none; }
@keyframes veinHeaderIn { from { opacity:0; filter:blur(12px); } to { opacity:1; filter:blur(0); } }

@media (width<=860px) {
  .vein-header { --pill-w:calc(100vw - 24px); --panel-w:calc(100vw - 24px); --panel-h:calc(100dvh - 24px); top:12px; height:calc(56px + (var(--panel-h) - 56px) * var(--morph)); }
  .vein-header-row { height:56px; padding-left:18px; }
  .vein-header-brand { left:calc(18px + (50% - 18px) * var(--morph)); }
  .vein-header-mark { width:90px; height:28px; }
  .vein-header-mark img { width:115.1px; height:115.1px; left:-12.5px; top:-43.9px; }
  .vein-audience-switcher { max-width:calc(100% - 144px); padding:3px; }
  .vein-audience-switcher a { min-height:34px; padding:6px 9px; font-size:10px; }
  .vein-audience-label-full { display:none; }
  .vein-audience-label-short { display:inline; }
  .vein-audience-divider { height:15px; }
  .vein-header-language { height:40px; }
  .vein-header-cta { height:40px; font-size:14px; }
  .vein-header-ready .vein-header-cta { padding-inline:18px; }
}
@media (prefers-reduced-motion:reduce) {
  .vein-header, .vein-header * { animation:none!important; transition:none!important; }
  .vein-header { opacity:1; filter:none; }
}
