/* =====================================================================
   Train Unique California: shared site chrome (every page links this file)
   - compact sticky header, "Ask about training" button, accessible menu
   - direct floating "Ask about training" link (no panel, no second click)
   - shared buttons, video controls, caption styling
   Pairs with assets/fab.js. Review build, Oct 2026.
   ===================================================================== */

/* ---------- header ---------- */
.nav{position:sticky;top:0;z-index:60;flex-wrap:nowrap;padding:10px var(--g,24px);gap:14px;background:var(--ink,#0D0D0D);border-bottom:1px solid #1E1E1E}
.nav img{width:clamp(104px,9vw,138px);height:auto}
.nav>a:first-child{padding:0;display:block;line-height:0}
.nav>div{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:2px clamp(12px,1.4vw,24px)}
.nav a{white-space:nowrap;margin-left:0;font-size:clamp(14px,1.1vw,17px);letter-spacing:.08em;padding:8px 0}
.nav .tu-cta{display:inline-flex;align-items:center;background:var(--gold,#FFC81E);color:var(--ink,#0D0D0D)!important;font-family:BC,Impact,sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:.04em;font-size:clamp(14px,1.1vw,17px);line-height:1;padding:11px 16px 10px;text-decoration:none;border-radius:2px;white-space:nowrap}
.nav .tu-cta:hover{filter:brightness(1.07)}
.tu-menubtn{display:none;align-items:center;gap:8px;background:none;border:2px solid #3A3A3A;color:#fff;font-family:PP,sans-serif;font-weight:700;font-size:13px;letter-spacing:.12em;text-transform:uppercase;padding:9px 12px;cursor:pointer;border-radius:2px;line-height:1}
.tu-menubtn svg{width:18px;height:18px;display:block}
.tu-menubtn:focus-visible,.nav .tu-cta:focus-visible,.tu-menu a:focus-visible,.fab-btn:focus-visible{outline:3px solid #fff;outline-offset:3px}
.tu-right{display:flex;align-items:center;gap:10px;flex:none}

/* the menu panel (built by fab.js) */
.tu-menu{position:fixed;left:0;right:0;top:var(--tu-head,62px);bottom:0;z-index:59;background:#0D0D0D;overflow-y:auto;padding:8px var(--g,20px) 40px;border-top:3px solid var(--gold,#FFC81E);display:none}
.tu-menu.is-open{display:block}
.tu-menu h2{font-family:PP,sans-serif;font-weight:700;font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;color:#9A9A9A;margin:22px 0 4px}
.tu-menu a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid #222;color:#fff;text-decoration:none;font-family:BC,Impact,sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:19px;line-height:1.1}
.tu-menu a small{font-family:PP,sans-serif;font-weight:400;text-transform:none;letter-spacing:0;font-size:13px;color:#9A9A9A;text-align:right}
.tu-menu a[aria-current]{color:var(--gold,#FFC81E)}
.tu-menu .tu-menu-cta{background:var(--gold,#FFC81E);color:#0D0D0D;justify-content:center;border:0;margin-top:18px;padding:15px}
body.tu-menu-open{overflow:hidden}

@media (max-width:1020px){
  html.tu-js .nav>div>a:not(.tu-cta){display:none}
  html.tu-js .tu-menubtn{display:inline-flex}
  html.tu-js .areas{display:none}
  .nav .tu-cta{font-size:13.5px;padding:10px 12px 9px}
}
@media (max-width:400px){
  .tu-menubtn .tu-mlabel{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tu-menubtn{padding:8px 9px}
  .nav img{width:96px}
}

/* ---------- shared buttons ---------- */
.tu-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--gold,#FFC81E);color:#0D0D0D;font-family:BC,Impact,sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:.04em;font-size:clamp(17px,1.5vw,21px);line-height:1;padding:16px 24px 15px;text-decoration:none;border:2px solid var(--gold,#FFC81E);border-radius:2px;cursor:pointer}
.tu-btn:hover{filter:brightness(1.07)}
.tu-btn.ghost{background:transparent;color:#fff;border-color:#5A5A5A}
.tu-btn.ghost:hover{border-color:var(--gold,#FFC81E);color:var(--gold,#FFC81E);filter:none}
.tu-btn.dark{background:#0D0D0D;color:#fff;border-color:#0D0D0D}
.tu-btn:focus-visible{outline:3px solid #fff;outline-offset:3px}
.tu-btns{display:flex;flex-wrap:wrap;gap:12px}

/* ---------- floating link (direct, no panel) ---------- */
.fab{position:fixed;right:clamp(14px,2vw,28px);bottom:calc(clamp(14px,2vw,28px) + env(safe-area-inset-bottom,0px));z-index:58;transition:transform .3s,opacity .3s}
.fab.away{transform:translateY(160%);opacity:0;pointer-events:none}
.fab-btn{display:inline-flex;align-items:center;gap:10px;background:var(--gold,#FFC81E);color:var(--ink,#0D0D0D);text-decoration:none;font-family:BC,Impact,sans-serif;font-weight:800;text-transform:uppercase;font-size:clamp(15px,1.3vw,19px);letter-spacing:.04em;line-height:1;padding:15px 20px 14px 17px;border-radius:999px;box-shadow:0 10px 30px rgba(0,0,0,.45)}
.fab-btn svg{width:19px;height:19px;flex:none;display:block}
.fab-btn:hover{transform:translateY(-2px)}
@media (max-width:1020px){html.tu-js .fab{display:none}}   /* the sticky header button does this job on phones and tablets */
@media (prefers-reduced-motion:reduce){.fab,.fab-btn{transition:none}}

/* ---------- video controls ---------- */
.tu-vctl{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:12px;padding:0 var(--g,20px)}
.tu-vctl button{display:inline-flex;align-items:center;gap:8px;background:#161616;color:#fff;border:2px solid #3A3A3A;border-radius:2px;font-family:PP,sans-serif;font-weight:700;font-size:13.5px;letter-spacing:.06em;padding:10px 14px;cursor:pointer;line-height:1}
.tu-vctl button:hover{border-color:var(--gold,#FFC81E)}
.tu-vctl button[aria-pressed="true"]{border-color:var(--gold,#FFC81E);color:var(--gold,#FFC81E)}
.tu-vctl svg{width:16px;height:16px;display:block}
video::cue{background:rgba(0,0,0,.82);color:#fff;font-family:PP,Arial,sans-serif;font-size:.95em;line-height:1.35}

/* ---------- small labels ---------- */
.tu-origin{display:inline-block;margin-top:10px;font-family:PP,sans-serif;font-weight:700;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:#A8A8A8}
.tu-origin b{color:var(--gold,#FFC81E);font-weight:700}
