/* --------------------------------------------------------------------------
   Takeover menu — a full-page hamburger menu (tribe.ai style), shared by
   every page. menu.js builds the overlay, injects an always-visible burger
   into the header and float-bar, and rides the existing compact burgers.
   The tangent ribbons render inside via the fx kit ([data-fx-flow]).
   -------------------------------------------------------------------------- */

/* The takeover replaces the little dropdown flyouts at every width. Their
   markup, styles, and JS remain in the pages untouched — delete these two
   lines to bring them back. */
.hdrop, .fb-drop{display:none !important;}

/* the always-visible trigger (hidden when a compact burger is already shown) */
.tk-burger{display:flex; flex-direction:column; justify-content:center; gap:5px;
      width:40px; height:40px; margin-left:14px; padding:8px; flex:none;
      background:none; border:0; cursor:pointer; align-self:center;}
.tk-burger span{display:block; height:2px; border-radius:2px; background:#fff;
      transition:background .2s ease, transform .25s ease;}
.tk-burger span:nth-child(2){width:70%;}
.tk-burger:hover span{background:var(--gold, #f6c776);}
.tk-burger:hover span:nth-child(2){transform:translateX(30%);}
header.hcompact .tk-burger, .floatbar.fb-compact .tk-burger{display:none;}

/* the overlay */
.tkmenu{position:fixed; inset:0; z-index:120;
      background:linear-gradient(150deg, #0a2036 0%, #071b30 55%, #0a1c2e 100%);
      clip-path:circle(0px at calc(100% - 44px) 44px);
      visibility:hidden; pointer-events:none;
      transition:clip-path .55s cubic-bezier(.55,.06,.25,1), visibility 0s linear .55s;}
.tkmenu.on{clip-path:circle(142% at calc(100% - 44px) 44px);
      visibility:visible; pointer-events:auto; transition-delay:0s;}
html.tk-lock, html.tk-lock body{overflow:hidden;}

/* the tangent ribbons behind the items */
.tkmenu .tk-flow{position:absolute; inset:0; overflow:hidden; pointer-events:none; opacity:.5;}
.tkmenu .tk-flow .fx-flow{position:absolute; inset:0; width:100%; height:100%;
      display:block; transform:none; z-index:0; opacity:1;}

/* close button */
.tk-x{position:absolute; top:14px; right:14px; z-index:3; width:46px; height:46px;
      border:1px solid rgba(255,255,255,.28); border-radius:50%; background:rgba(255,255,255,.06);
      color:#fff; font-size:20px; line-height:1; cursor:pointer;
      transition:background .2s ease, color .2s ease, transform .3s ease;}
.tk-x:hover{background:var(--gold, #f6c776); color:#08121c; transform:rotate(90deg);}

/* the logo, top-left, mirroring the header */
.tk-logo{position:absolute; top:16px; left:max(22px, 8vw); z-index:3; display:block;}
.tk-logo img{height:44px; width:auto; display:block;}
@media (max-width:600px){ .tk-logo{left:22px;} .tk-logo img{height:36px;} }

/* content column (scrolls when it must — small screens, page zoom) */
.tk-inner{position:relative; z-index:2; height:100%; overflow-y:auto;
      display:flex; flex-direction:column; padding:72px 8vw 34px;}
.tk-nav{margin:auto 0; display:flex; flex-direction:column;}
.tk-nav a{display:flex; align-items:baseline; gap:18px; text-decoration:none;
      padding:.35vh 0; color:#fff;
      font-family:var(--display, 'Poppins', sans-serif); font-weight:700;
      font-size:clamp(24px, 6.2vh, 54px); line-height:1.25; letter-spacing:-.01em;
      opacity:0; transform:translateY(26px);
      transition:opacity .45s ease, transform .45s cubic-bezier(.22,1,.36,1), color .2s ease;}
.tkmenu.on .tk-nav a{opacity:1; transform:none;}
.tk-nav a:nth-child(1){transition-delay:.16s;} .tk-nav a:nth-child(2){transition-delay:.21s;}
.tk-nav a:nth-child(3){transition-delay:.26s;} .tk-nav a:nth-child(4){transition-delay:.31s;}
.tk-nav a:nth-child(5){transition-delay:.36s;} .tk-nav a:nth-child(6){transition-delay:.41s;}
.tk-nav a:nth-child(7){transition-delay:.46s;}
.tk-nav a .n{font-family:var(--mono, 'IBM Plex Mono', monospace); font-weight:600;
      font-size:clamp(10px, 1.8vh, 13px); letter-spacing:.14em; color:var(--gold, #f6c776);
      opacity:.85; flex:none; width:2.2em;}
.tk-nav a:hover{color:var(--gold, #f6c776);}
.tk-nav a:hover .t{transform:translateX(10px);}
.tk-nav a .tw{display:block; min-width:0;}
.tk-nav a .t{transition:transform .3s cubic-bezier(.22,1,.36,1); display:inline-block;
      overflow-wrap:break-word; -webkit-hyphens:auto; hyphens:auto; min-width:0;}
/* each page's hero subheader appears under its link on hover, when the
   viewport has room for it (same text as the page hero — one source) */
.tk-nav a .sub{display:none;}
@media (min-width:640px) and (min-height:620px){
  .tk-nav a .sub{display:block; max-width:56ch; overflow:hidden;
        font-family:var(--sans, 'Inter', sans-serif); font-weight:400;
        font-size:14.5px; line-height:1.5; letter-spacing:0; color:#b9cde0;
        max-height:0; opacity:0; transform:translateX(10px) translateY(-4px);
        transition:max-height .35s cubic-bezier(.22,1,.36,1), opacity .3s ease,
                   transform .35s cubic-bezier(.22,1,.36,1);}
  .tk-nav a:hover .sub, .tk-nav a:focus-visible .sub{max-height:8em; opacity:1;
        transform:translateX(10px) translateY(0);}
  .tk-nav a .sub .ul{background:none; box-shadow:inset 0 -2px 0 0 rgba(246,199,118,.55);
        color:#e6f1fb; font-weight:600;}
}
.tk-nav a.cur{color:var(--gold, #f6c776);}
.tk-nav a.cur .t{box-shadow:inset 0 -4px 0 0 rgba(246,199,118,.55);}

/* contact strip at the bottom */
.tk-foot{display:flex; flex-wrap:wrap; gap:14px 26px; align-items:center;
      padding-top:22px; border-top:1px solid rgba(255,255,255,.14);
      opacity:0; transform:translateY(14px);
      transition:opacity .5s ease .5s, transform .5s cubic-bezier(.22,1,.36,1) .5s;}
.tkmenu.on .tk-foot{opacity:1; transform:none;}
.tk-foot a{color:#cfe0f0; text-decoration:none; font-size:14.5px;}
.tk-foot a:hover{color:var(--gold, #f6c776);}
.tk-foot .tk-cta{font-family:var(--display, 'Poppins', sans-serif); font-weight:600;
      color:#08121c; background:var(--gold, #f6c776); padding:11px 22px; border-radius:8px;}
.tk-foot .tk-cta:hover{background:var(--gold-2, #fcce5a); color:#08121c;}
.tk-foot .sep{color:rgba(255,255,255,.3);}

@media (max-width:600px){
  .tk-inner{padding:66px 22px 24px;}
  .tk-nav a{gap:12px;}
}
@media (prefers-reduced-motion:reduce){
  .tkmenu{transition:none;}
  .tk-nav a, .tk-foot{transition:none; opacity:1; transform:none;}
  .tk-x:hover{transform:none;}
}