/* ============================================================
   THE TRAVEL REWARDS ADVISORY GROUP — logo mark, hero Login link,
   and mobile menu. Shared across all pages.
   ============================================================ */

/* Logo emblem next to the wordmark */
.brand{display:inline-flex;align-items:center;gap:10px;}
.brand-mark{width:25px;height:25px;flex:none;display:block;}
.foot .brand .brand-mark{width:28px;height:28px;}

/* ---- "Member Access" link at top-left of the hero (injected by menu.js) ---- */
/* Homepage: pin the link just below the nav line (red zone), so the
   vertically-centered hero content can't pull it up into the header. */
.hero-login-bar{position:absolute;top:84px;left:0;right:0;z-index:5;padding-top:18px;}
.hero-login{display:inline-block;font-family:'Inter',sans-serif;font-size:10.5px;
  font-weight:500;letter-spacing:.28em;text-transform:uppercase;color:#d8c79c;
  text-decoration:none;margin-bottom:26px;transition:color .35s;
  text-shadow:0 1px 8px rgba(0,0,0,.55);
  opacity:0;animation:hlIn 1s .3s forwards;}
.hero-login .hl-label{position:relative;display:inline-block;padding-bottom:5px;}
.hero-login .hl-label::after{content:"";position:absolute;left:0;bottom:0;
  width:100%;height:1px;background:rgba(201,169,106,.5);transition:background .35s;}
.hero-login:hover{color:#f0e2bd;}
.hero-login:hover .hl-label::after{background:#e6d3a3;}
@keyframes hlIn{to{opacity:1;}}

/* Hamburger toggle button (injected by menu.js) — hidden on desktop */
.menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:8px;margin-left:14px;flex:none;}
.menu-toggle span{display:block;width:22px;height:2px;background:var(--dtext,#f2ede2);margin:4px 0;transition:transform .3s,opacity .3s;}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg);}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}

@media(max-width:860px){
  .nav-in{position:relative;gap:10px;}
  .menu-toggle{display:block;}
  /* Brand stays as the title; size it to share the row with Request Access. */
  .nav-in .brand{font-size:14px;gap:7px;min-width:0;white-space:nowrap;
    overflow:hidden;text-overflow:ellipsis;}
  .nav-in .brand-mark{width:20px;height:20px;}
  /* Keep the Request Access pill compact in the header on mobile. */
  .nav-in > .nav-cta{flex:none;padding:9px 12px;font-size:9px;letter-spacing:.1em;white-space:nowrap;}
  /* dropdown panel for the section links */
  .nav-in .nav-links{
    display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;gap:0;
    background:#16171d;border:1px solid rgba(233,224,206,.14);
    border-radius:0 0 10px 10px;padding:8px 0;z-index:50;
    box-shadow:0 24px 50px rgba(0,0,0,.5);
  }
  .nav-in.menu-open .nav-links{display:flex;}
  .nav-in .nav-links a{
    padding:14px 26px;font-size:12px;letter-spacing:.16em;
    border-bottom:1px solid rgba(233,224,206,.08);
  }
  .nav-in .nav-links a:last-child{border-bottom:none;}
}
