/* =========================================================
   Tabor Sales & Automation — site navigation
   Two variants: .tnav--overlay (home, on top of hero)
                 .tnav--solid   (all inner pages)
   ========================================================= */

@font-face{font-family:"Mulish";src:url("font/static/Mulish-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Mulish";src:url("font/static/Mulish-Medium.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:"Mulish";src:url("font/static/Mulish-SemiBold.ttf") format("truetype");font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:"Mulish";src:url("font/static/Mulish-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:"Mulish";src:url("font/static/Mulish-ExtraBold.ttf") format("truetype");font-weight:800;font-style:normal;font-display:swap;}

:root{
  --tnav-brand:#0a4554;
  --tnav-brand-dark:#0b333f;
  --tnav-ink:#10303a;
  --tnav-height:78px;
}

/* hidden checkbox that drives the mobile menu (no JS needed) */
.tnav-toggle{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}

.tnav{
  width:100%;
  z-index:1000;
  font-family:"Mulish",system-ui,-apple-system,"Segoe UI",sans-serif;
}
.tnav *,.tnav *::before,.tnav *::after{box-sizing:border-box;}

.tnav__inner{
  position:relative;
  max-width:1336px;
  margin:0 auto;
  padding:0 28px;
  min-height:var(--tnav-height);
  display:flex;
  align-items:center;
  gap:24px;
}

/* ---------- brand: logo + wordmark ---------- */
.tnav__brand{display:flex;align-items:center;gap:13px;text-decoration:none;flex:0 0 auto;}
.tnav__logo{height:48px;width:auto;display:block;transition:transform .35s ease;}
.tnav__brand:hover .tnav__logo{transform:scale(1.05) rotate(-1deg);}
.tnav__wordmark{display:flex;flex-direction:column;justify-content:center;line-height:1;}
.tnav__name{
  font-family:"Mulish",sans-serif;
  font-size:19px;font-weight:800;letter-spacing:.005em;
  color:var(--tnav-ink);white-space:nowrap;
}
.tnav__name span{font-weight:500;opacity:.92;}
.tnav__tag{
  margin-top:4px;
  font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:var(--tnav-brand);white-space:nowrap;
}

/* ---------- menu ---------- */
.tnav__menu{display:flex;align-items:center;gap:4px;margin-left:auto;}
.tnav__link{
  position:relative;
  padding:10px 15px;
  font-size:15px;font-weight:600;letter-spacing:.005em;
  color:var(--tnav-ink);text-decoration:none;border-radius:9px;
  transition:color .25s ease,background-color .25s ease;
}
.tnav__link::after{
  content:"";position:absolute;left:15px;right:15px;bottom:5px;height:2px;
  background:var(--tnav-brand);border-radius:2px;
  transform:scaleX(0);transform-origin:left center;
  transition:transform .3s cubic-bezier(.4,0,.2,1);
}
.tnav__link:hover{color:var(--tnav-brand);}
.tnav__link:hover::after,.tnav__link.is-active::after{transform:scaleX(1);}
.tnav__link.is-active{color:var(--tnav-brand);font-weight:700;}

/* ---------- cta ---------- */
.tnav__cta{
  display:inline-flex;align-items:center;gap:9px;
  margin-left:12px;padding:12px 23px;
  background:var(--tnav-brand);color:#fff;
  font-size:14px;font-weight:700;letter-spacing:.01em;
  border-radius:999px;text-decoration:none;white-space:nowrap;
  box-shadow:0 10px 22px -12px rgba(10,69,84,.75);
  transition:transform .25s ease,box-shadow .25s ease,background-color .25s ease;
}
.tnav__cta-icon{width:16px;height:16px;flex:0 0 auto;transition:transform .25s ease;}
.tnav__cta:hover{background:var(--tnav-brand-dark);transform:translateY(-2px);box-shadow:0 16px 28px -12px rgba(10,69,84,.9);}
.tnav__cta:hover .tnav__cta-icon{transform:translateX(3px);}

/* ---------- burger ---------- */
.tnav__burger{
  display:none;width:48px;height:48px;margin-left:auto;
  background:transparent;border:0;cursor:pointer;border-radius:11px;
  flex-direction:column;align-items:center;justify-content:center;gap:5px;
}
.tnav__burger span{display:block;width:25px;height:2px;border-radius:2px;background:var(--tnav-ink);transition:transform .3s ease,opacity .2s ease;}

/* =========================================================
   SOLID variant — inner pages
   ========================================================= */
.tnav--solid{
  position:sticky;top:0;
  background:rgba(255,255,255,.9);
  -webkit-backdrop-filter:saturate(150%) blur(12px);
  backdrop-filter:saturate(150%) blur(12px);
  border-bottom:1px solid rgba(10,69,84,.10);
  box-shadow:0 8px 30px -22px rgba(8,30,40,.7);
}

/* =========================================================
   OVERLAY variant — home page, floats over the hero image
   ========================================================= */
.hero{position:relative;}
.tnav--overlay{
  position:absolute;top:0;left:0;right:0;
  background:transparent;
}
.tnav--overlay .tnav__logo{filter:brightness(0) invert(1);}
.tnav--overlay .tnav__name{color:#fff;}
.tnav--overlay .tnav__tag{color:rgba(255,255,255,.82);}
.tnav--overlay .tnav__link{color:#eef4f5;}
.tnav--overlay .tnav__link::after{background:#fff;}
.tnav--overlay .tnav__link:hover,.tnav--overlay .tnav__link.is-active{color:#fff;}
.tnav--overlay .tnav__cta{background:#fff;color:var(--tnav-brand);box-shadow:0 12px 26px -12px rgba(0,0,0,.55);}
.tnav--overlay .tnav__cta:hover{background:#eaf3f4;color:var(--tnav-brand-dark);}
.tnav--overlay .tnav__burger span{background:#fff;}

/* =========================================================
   Responsive — collapse to burger + dropdown panel
   ========================================================= */
@media (max-width:991px){
  .tnav__burger{display:flex;}
  .tnav__menu{
    position:absolute;top:calc(100% + 1px);left:0;right:0;z-index:1001;
    flex-direction:column;align-items:stretch;gap:2px;
    padding:14px 20px 22px;
    background:#fff;
    border-top:1px solid rgba(10,69,84,.10);
    box-shadow:0 26px 44px -22px rgba(8,30,40,.5);
    opacity:0;visibility:hidden;pointer-events:none;
    transform:translateY(-12px);
    transition:opacity .26s ease,transform .26s ease,visibility .26s;
  }
  .tnav__link{padding:14px 14px;font-size:16px;border-radius:11px;}
  .tnav__link::after{display:none;}
  .tnav__link:hover,.tnav__link.is-active{background:rgba(10,69,84,.07);}
  .tnav__cta{margin:12px 0 2px;justify-content:center;padding:15px 23px;font-size:15px;}

  /* overlay's dropdown gets a dark panel so links stay readable */
  .tnav--overlay .tnav__menu{background:#0a2730;border-top-color:rgba(255,255,255,.14);}
  .tnav--overlay .tnav__link{color:#eaf1f2;}
  .tnav--overlay .tnav__link:hover,.tnav--overlay .tnav__link.is-active{background:rgba(255,255,255,.1);color:#fff;}
  .tnav--overlay .tnav__cta{background:#fff;color:var(--tnav-brand);}

  /* open state (checkbox checked) */
  .tnav-toggle:checked ~ .tnav .tnav__menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0);}
  .tnav-toggle:checked ~ .tnav .tnav__burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .tnav-toggle:checked ~ .tnav .tnav__burger span:nth-child(2){opacity:0;}
  .tnav-toggle:checked ~ .tnav .tnav__burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
}

@media (max-width:560px){
  .tnav__inner{padding:0 18px;}
  .tnav__logo{height:42px;}
  .tnav__name{font-size:17px;}
  .tnav__tag{display:none;}
}