:root{
  --bg:#06926D;
  --text:#fff;
  --shadow:0 12px 24px rgba(0,0,0,.12), 0 3px 8px rgba(0,0,0,.08);

  --nav-font:18px;        /* fixed desktop size */
  --nav-gap:38px;         /* fixed desktop gap */
  --nav-logo:150px;       /* fixed desktop logo width */

  --cta-f:18px;
  --cta-py:10px;
  --cta-px:16px;
}

*{box-sizing:border-box}
body{margin:0}

/* ====== DESKTOP NAVBAR ====== */
.navbar{
  position:sticky;
  top:0;
  z-index:1000;
  display:flex; 
  align-items:center; 
  justify-content:space-between;
  gap:var(--nav-gap);
  background:var(--bg); 
  color:var(--text);
  padding: 16px 32px;
  flex-wrap:nowrap;                 /* don't wrap on desktop */
}

.logo{
  flex:0 0 auto; 
  min-width:0
}
.logo img{
  display:block; 
  width:var(--nav-logo); 
  height:auto
}

/* links row */
.nav-links{
  display:flex; flex:1 1 auto;
  min-width:0;                      /* allow shrinking before wrapping */
  flex-wrap:nowrap;                 /* single line */
  justify-content:center;
  align-items:center;
  gap:var(--nav-gap);
  list-style:none; 
  margin:0; 
  padding:0;
}
.nav-links > li{
  flex:0 1 auto; 
  min-width:0
}

/* top-level items */
.nav-links a,
.dropdown-toggle{
  color:var(--text);
  text-decoration:none;
  background:transparent; 
  border:0; 
  cursor:pointer;
  display:inline-flex; 
  align-items:center; 
  gap:.35rem;
  padding:.4em .45em;
  font:600 var(--nav-font)/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial;
  white-space:nowrap;
  border-radius:7px;
  transition:background .15s ease, color .15s ease;
}
.nav-links a:hover,
.dropdown-toggle:hover,
.dropdown-toggle:focus-visible{
  background:#067192; color:#fff;
}
.dropdown-toggle:focus-visible{
  outline:2px solid rgba(255,255,255,.6); outline-offset:2px;
}

/* CTA */
.btn-group{
  flex:0 0 auto; 
  min-width:0; 
  white-space:nowrap
}

.btn-register{
  color:#fff; 
  background:#000; 
  border-radius:10px;
  padding:var(--cta-py) var(--cta-px); 
  font-size:var(--cta-f);
  position:relative; 
  text-decoration:none; 
  display:inline-block;
  font:600 var(--nav-font)/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial;
}
.btn-register:hover{ background:#ff0000 }

/* tooltip */
.btn-register[data-tip]::after{
  content: attr(data-tip);
  position:absolute; 
  left:50%; 
  bottom:calc(100% + 10px);
  transform:translateX(-50%);
  background:#111; 
  color:#fff; 
  font-size:13px; 
  line-height:1.2;
  padding:8px 10px; 
  border-radius:8px; 
  white-space:nowrap;
  opacity:0; 
  visibility:hidden;
  pointer-events:none;
  box-shadow:var(--shadow);
  transition:opacity .2s ease, transform .2s ease, visibility .2s;
}
.btn-register[data-tip]:hover::after{
  opacity:1; 
  visibility:visible; 
  transform:translateX(-50%) translateY(-2px);
}
.btn-register[data-tip]::before{
  content:""; 
  position:absolute; 
  left:50%; 
  bottom:100%;
  transform:translateX(-50%);
  border:6px solid transparent; 
  border-top-color:#111;
  opacity:0; 
  visibility:hidden; 
  transition:opacity .2s ease;
}
.btn-register[data-tip]:hover::before{ opacity:1; visibility:visible }

/* hamburger */
.menu-toggle{
  display:none; cursor:pointer; background:transparent; border:0; padding:6px;
}
.menu-toggle span{
  display:block; 
  width:26px; 
  height:3px; 
  background:#fff; 
  border-radius:2px; 
  margin:4px 0}

/* ====== DROPDOWNS ====== */
.dropdown{ position:relative }
.dropdown-menu{
  position:absolute; 
  left:0; 
  top:calc(100% + .5rem);
  background:#000; 
  color:#fff; 
  list-style:none;
  padding:.35rem; 
  margin:0;
  border-radius:10px; 
  box-shadow:var(--shadow);
  display:none; z-index:999;
  width:max-content; max-width:calc(100vw - 2rem); white-space:nowrap;
}
.dropdown-menu li a{
  display:block; 
  padding:.8rem 1rem; 
  font-size:18px; 
  border-radius:8px;
  color:#fff; 
  text-decoration:none;
  font:600 var(--nav-font)/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial;
}
.dropdown-menu li a:hover{ background:#ff0000 }
.dropdown.open > .dropdown-menu{ display:block }
@media (hover:hover){
  .dropdown:hover > .dropdown-menu,
  .dropdown:focus-within > .dropdown-menu{ display:block }
}

/* ====== MOBILE: switch earlier to avoid crowding ====== */
@media (max-width: 1100px){
  .menu-toggle{ display:block }

  .nav-links{
    position:absolute; left:0; right:0; top:100%;
    background:var(--bg); padding:.75rem 1rem 1rem;
    display:none; flex-direction:column; gap:.25rem;
    border-top:1px solid rgba(255,255,255,.2);
  }
  .nav-links.active{ display:flex }

  /* hide CTA in bar; show as floating panel when menu open */
  .btn-group{ display:none }
  .btn-group.active{
    display:flex; position:absolute; right:1rem; top:calc(100% + .5rem);
    background:var(--bg); padding:.5rem; border-radius:8px;
    box-shadow:var(--shadow)
  }

  .dropdown-menu{
    position:static; background:transparent; box-shadow:none; padding:0; width:100%;
    white-space:normal; display:none;
  }
  .dropdown.open > .dropdown-menu{
    display:flex; flex-direction:column; gap:.15rem;
  }
}
