/* =========================================================================
   TEZZ RENT AGREEMENT — Professional UI layer
   Design-only overrides. Loaded LAST on every page. No content is changed.
   ========================================================================= */
:root{
  --tz-navy:#0b1f3a;
  --tz-green:#16a34a;
  --tz-green-d:#059669;
  --tz-gold:#f0a500;
  --tz-gold-d:#d98e00;
  --tz-ease:cubic-bezier(.22,.8,.3,1);
  --tz-shadow-sm:0 4px 14px rgba(11,31,58,.07);
  --tz-shadow-lg:0 24px 50px rgba(11,31,58,.16);
}

/* ---------- scroll progress bar (created by tezz-pro.js) ---------- */
#tzProgress{position:fixed;top:0;left:0;height:3px;width:0;z-index:100001;
  background:linear-gradient(90deg,var(--tz-green),var(--tz-gold));transition:width .1s linear;pointer-events:none}

/* =========================================================================
   NAVBAR  — aligned, equal-height buttons, no wrapping
   ========================================================================= */
.tezz-nav,.nav-bar{background:rgba(255,255,255,.97)!important;
  -webkit-backdrop-filter:saturate(180%) blur(10px);backdrop-filter:saturate(180%) blur(10px);
  box-shadow:0 2px 18px rgba(11,31,58,.07);transition:box-shadow .3s ease}
.tezz-nav.tz-scrolled,.nav-bar.tz-scrolled{box-shadow:0 8px 28px rgba(11,31,58,.14)}

.navbar{align-items:center}
.navbar-brand{display:flex!important;align-items:center;flex-shrink:0}
.navbar-brand h2{line-height:1;margin:0!important;font-weight:800;letter-spacing:.4px}

@media (min-width:992px){
  .navbar .navbar-collapse{display:flex!important;align-items:center!important;gap:10px;flex-wrap:nowrap}
  .navbar .navbar-nav{display:flex;flex-direction:row;align-items:center;gap:2px;flex-wrap:nowrap}
}

/* every menu item: same height, same baseline */
.navbar .nav-item.nav-link,.navbar .nav-link{
  position:relative;display:inline-flex;align-items:center;height:44px;line-height:1;
  padding:0 14px!important;margin:0!important;border-radius:10px;
  font-size:15px;font-weight:600!important;color:#0f172a;white-space:nowrap;transition:color .25s,background .25s}
.navbar #servicesBtn{cursor:pointer;gap:6px}
.navbar #servicesBtn i{margin:0!important;font-size:13px;transition:transform .3s var(--tz-ease)}
.navbar #servicesBtn:hover i{transform:rotate(180deg)}
.navbar .nav-link::after{content:"";position:absolute;left:14px;right:14px;bottom:6px;height:2px;border-radius:2px;
  background:var(--tz-green);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--tz-ease)}
.navbar .nav-link:hover::after,.navbar .nav-link.active::after{transform:scaleX(1)}
.navbar .nav-link:hover,.navbar .nav-link.active{background:#eefaf3!important;color:var(--tz-green-d)!important}
.navbar .nav-item{display:flex;align-items:center;position:relative}

/* LOG IN + REQUEST CALLBACK — identical height, single line, aligned */
.navbar .btn.btn-primary,.navbar .callback-btn{
  display:inline-flex!important;align-items:center;justify-content:center;gap:8px;
  height:44px!important;min-height:44px;padding:0 22px!important;margin:0!important;
  flex:0 0 auto;white-space:nowrap!important;line-height:1!important;
  font-size:14.5px;font-weight:700;border:none!important;border-radius:10px!important;
  position:relative;overflow:hidden;cursor:pointer;text-decoration:none;
  transition:transform .3s var(--tz-ease),box-shadow .3s ease,filter .3s}
.navbar .btn.btn-primary{background:linear-gradient(135deg,#10b981,#059669)!important;color:#fff!important;
  box-shadow:0 8px 18px rgba(5,150,105,.28)}
.navbar .callback-btn{background:linear-gradient(135deg,#ffbf1f,#f0a500)!important;color:#111!important;
  box-shadow:0 8px 18px rgba(240,165,0,.32)}
.navbar .btn.btn-primary:hover,.navbar .callback-btn:hover{transform:translateY(-2px);filter:brightness(1.05);color:inherit}
.navbar .btn.btn-primary:hover{color:#fff!important}
.navbar .btn.btn-primary::before,.navbar .callback-btn::before{content:"";position:absolute;top:0;left:-70%;width:50%;height:100%;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);transition:left .6s ease}
.navbar .btn.btn-primary:hover::before,.navbar .callback-btn:hover::before{left:130%}

/* services dropdown */
.dropdown-menu{border:0!important;border-radius:14px!important;padding:8px!important;box-shadow:var(--tz-shadow-lg)!important}
.dropdown-menu .dropdown-item{border-radius:9px;padding:10px 14px;font-weight:500;transition:background .2s,padding-left .25s var(--tz-ease)}
.dropdown-menu .dropdown-item:hover{background:#eefaf3!important;color:var(--tz-green-d)!important;padding-left:20px}

@media (max-width:991.98px){
  .navbar .navbar-nav{align-items:stretch;gap:0}
  .navbar .nav-link{height:46px;padding:0 12px!important}
  .navbar .navbar-collapse{padding:10px 0 14px}
  .navbar .btn.btn-primary,.navbar .callback-btn{width:100%;margin:6px 0 0!important;display:flex!important}
}

/* =========================================================================
   BUTTONS (global)
   ========================================================================= */
.btn,.hero-btn,.cta-btn,.trx-btn,.primary-btn{
  transition:transform .3s var(--tz-ease),box-shadow .3s ease,background .25s,color .25s,filter .25s}
.btn:hover,.hero-btn:hover,.cta-btn:hover,.trx-btn:hover,.primary-btn:hover{transform:translateY(-3px)}
.btn:active,.hero-btn:active,.cta-btn:active{transform:translateY(0) scale(.98)}

/* =========================================================================
   CARDS — hover lift + shadow + accent, applied to every card type on the site
   ========================================================================= */
.card,.svc-card,.trx-card,.process-card,.process-box,.process-box-new,.feature-box,.feature-card-3d,
.service-card,.service-card-3d,.pro-card,.card-pro,.docs-card,.city-card,.info-card,.property-item,
.faq-card,.faq-item,.doc-tile,.about-card-3d,.content-card-3d,.card-3d,.mini-card,.sig-card,
.party-card,.big-card,.team-item,.cat-item,.phone-card,.premium-card,.success-feature-box{
  transition:transform .4s var(--tz-ease),box-shadow .4s ease,border-color .3s ease,background-color .3s ease;
  will-change:transform}
.card:hover,.svc-card:hover,.trx-card:hover,.process-card:hover,.process-box:hover,.process-box-new:hover,
.feature-box:hover,.feature-card-3d:hover,.service-card:hover,.service-card-3d:hover,.pro-card:hover,
.card-pro:hover,.docs-card:hover,.city-card:hover,.info-card:hover,.property-item:hover,.faq-card:hover,
.doc-tile:hover,.about-card-3d:hover,.content-card-3d:hover,.card-3d:hover,.mini-card:hover,.sig-card:hover,
.party-card:hover,.big-card:hover,.team-item:hover,.cat-item:hover,.phone-card:hover,.premium-card:hover{
  transform:translateY(-8px);
  box-shadow:var(--tz-shadow-lg)!important;
  border-color:rgba(22,163,74,.38)!important}

/* icons / step badges inside cards come alive on hover */
.svc-icon-wrap,.docs-card-icon,.step-circle,.feature-box i,.pro-card i,.service-card i{
  transition:transform .45s var(--tz-ease)}
.svc-card:hover .svc-icon-wrap,.docs-card:hover .docs-card-icon,.process-card:hover .step-circle,
.process-box:hover .step-circle,.feature-box:hover i,.pro-card:hover i,.service-card:hover i{
  transform:scale(1.14) rotate(-6deg)}

/* card images zoom softly */
.card-img,.card-img-top,.property-item img,.team-item img,.premium-image-box img{transition:transform .6s var(--tz-ease)}
.card:hover .card-img-top,.card:hover .card-img,.property-item:hover img,.team-item:hover img,
.premium-image-box:hover img{transform:scale(1.06)}
.card,.property-item,.team-item{overflow:hidden}

/* FAQ items */
.faq-item,.faq-card,.accordion-item{border-radius:14px}
.faq-item:hover,.faq-card:hover{border-color:rgba(22,163,74,.38)!important}

/* =========================================================================
   SCROLL-REVEAL  (class names added by tezz-pro.js — uses the independent
   `translate` property so it never fights the hover `transform`)
   ========================================================================= */
html.tz-js .tz-reveal{opacity:0;translate:0 34px;
  transition:opacity .75s var(--tz-ease),translate .75s var(--tz-ease),
             transform .4s var(--tz-ease),box-shadow .4s ease,border-color .3s ease;
  transition-delay:var(--tz-d,0ms),var(--tz-d,0ms),0ms,0ms,0ms}
html.tz-js .tz-reveal.tz-in{opacity:1;translate:0 0}
html.tz-js .tz-reveal.tz-left{translate:-40px 0}
html.tz-js .tz-reveal.tz-left.tz-in{translate:0 0}

/* =========================================================================
   CALLBACK POPUP — cleaner, trust-building
   ========================================================================= */
.overlay{background:rgba(4,12,26,.72)!important;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
.form-box{border-radius:20px!important;border-top:5px solid var(--tz-green);
  box-shadow:0 35px 80px rgba(0,0,0,.45)!important}
.form-box .form-head h4{font-weight:800;color:var(--tz-navy)}
.form-box .form-control{border:1.5px solid #dbe3ee!important;border-radius:10px!important;padding:11px 14px!important;
  background:#f8fafc;transition:border-color .25s,box-shadow .25s,background .25s}
.form-box .form-control:focus{background:#fff;border-color:var(--tz-green)!important;box-shadow:0 0 0 4px rgba(22,163,74,.15)!important}
.form-box button[type="submit"],.form-box .btn-success{
  background:linear-gradient(135deg,#10b981,#059669)!important;border:0!important;border-radius:10px!important;
  font-weight:700;padding:12px!important;box-shadow:0 10px 22px rgba(5,150,105,.3)}
.form-box button[type="submit"]:hover{transform:translateY(-2px);filter:brightness(1.06)}
.close-btn{transition:transform .3s var(--tz-ease),color .2s}
.close-btn:hover{transform:rotate(90deg);color:#dc2626}

/* inputs site-wide */
.form-control,.form-select{transition:border-color .25s,box-shadow .25s}
.form-control:focus,.form-select:focus{border-color:var(--tz-green);box-shadow:0 0 0 .22rem rgba(22,163,74,.16)}

/* =========================================================================
   FOOTER links + misc polish
   ========================================================================= */
.footer a,.trx-footer a{transition:color .25s,padding-left .25s var(--tz-ease)}
.footer a:hover,.trx-footer a:hover{padding-left:4px}
img{border-radius:inherit}
::selection{background:rgba(22,163,74,.25)}

@media (prefers-reduced-motion:reduce){
  html.tz-js .tz-reveal{opacity:1!important;translate:none!important;transition:none!important}
  .card:hover,.svc-card:hover,.trx-card:hover,.process-card:hover{transform:none!important}
  #tzProgress{display:none}
}
