/* V299 definitive header/logo source cleanup.
   Built from V290, not from the failed V291-V298 overlay chain.
   Goals: remove logo/header grey wash at the source, preserve logo typography,
   and keep the Mobile App dropdown visible and correctly stacked. */

:root{--z-final-white:#ffffff;}

/* Header surface: flat white, visible overflow for dropdowns, no overlays. */
html body .site-header,
html body header.site-header{
  position:sticky !important;
  top:0 !important;
  z-index:1000 !important;
  isolation:auto !important;
  overflow:visible !important;
  background:#ffffff !important;
  background-color:#ffffff !important;
  background-image:none !important;
  border-bottom:1px solid rgba(217,229,247,.72) !important;
  box-shadow:none !important;
  filter:none !important;
  -webkit-filter:none !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
  opacity:1 !important;
  mix-blend-mode:normal !important;
}

/* Disable header/brand paint layers that caused repeated failed logo fixes. */
html body .site-header::before,
html body .site-header::after,
html body header.site-header::before,
html body header.site-header::after,
html body .site-header > .container::before,
html body .site-header > .container::after,
html body .site-header .nav-wrap::before,
html body .site-header .nav-wrap::after,
html body .site-header .brand::before,
html body .site-header .brand::after,
html body a.brand::before,
html body a.brand::after{
  content:none !important;
  display:none !important;
  background:none !important;
  background-image:none !important;
  box-shadow:none !important;
  filter:none !important;
  opacity:0 !important;
}

/* Keep the white header surface on the real structural wrappers. */
html body .site-header > .container,
html body .site-header .container.nav-wrap,
html body .site-header .nav-wrap{
  position:relative !important;
  z-index:1 !important;
  overflow:visible !important;
  background:#ffffff !important;
  background-color:#ffffff !important;
  background-image:none !important;
  box-shadow:none !important;
  filter:none !important;
  -webkit-filter:none !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
  opacity:1 !important;
  mix-blend-mode:normal !important;
}

/* Wordmark: no font/size/weight/spacing changes; only remove surrounding visual effects. */
html body .brand,
html body .site-header .brand,
html body .nav-wrap .brand,
html body a.brand{
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  text-shadow:none !important;
  filter:none !important;
  -webkit-filter:none !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
  opacity:1 !important;
  mix-blend-mode:normal !important;
  -webkit-text-stroke:0 !important;
}
html body .site-header .brand:hover,
html body .site-header .brand:focus,
html body .site-header .brand:focus-visible{
  color:#071632 !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  text-shadow:none !important;
  filter:none !important;
}

/* Dropdown: keep it visible above page content. Do not clip it with header overflow. */
html body .site-header .nav-dropdown{
  position:relative !important;
  z-index:1010 !important;
  overflow:visible !important;
}
html body .site-header .nav-dropdown__menu{
  z-index:1200 !important;
  overflow:visible !important;
  width:min(246px,calc(100vw - 34px)) !important;
  top:calc(100% + 8px) !important;
}
html body .site-header .nav-dropdown__panel{
  padding:13px !important;
  border-radius:16px !important;
  background:#ffffff !important;
  background-color:#ffffff !important;
  background-image:none !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
  box-shadow:0 18px 44px rgba(18,67,142,.14),0 8px 20px rgba(5,17,56,.06) !important;
}
html body .site-header .nav-dropdown__title{font-size:14.5px !important;line-height:1.12 !important;margin-bottom:5px !important;}
html body .site-header .nav-dropdown__text{font-size:11px !important;line-height:1.42 !important;margin-bottom:8px !important;}
html body .site-header .nav-dropdown__eyebrow{font-size:9px !important;padding:4px 8px !important;margin-bottom:7px !important;}
html body .site-header .nav-dropdown__badges{gap:7px !important;}
html body .site-header .nav-dropdown__badges a{border-radius:10px !important;display:block !important;transition:transform .18s ease, box-shadow .18s ease, filter .18s ease !important;box-shadow:0 8px 18px rgba(10,25,60,.10) !important;}
html body .site-header .nav-dropdown__badges a:hover,
html body .site-header .nav-dropdown__badges a:focus-visible{transform:translateY(-2px) !important;box-shadow:0 14px 28px rgba(10,25,60,.16) !important;filter:brightness(1.035) contrast(1.02) !important;outline:2px solid rgba(11,99,246,.28) !important;outline-offset:3px !important;}

/* Header CTA remains polished but with a tighter shadow so it does not create a wash across the header. */
html body .site-header .btn-primary,
html body .nav-actions .btn-primary{
  color:#ffffff !important;
  background:linear-gradient(135deg,#0b67ff 0%,#315df5 56%,#5b35f2 100%) !important;
  opacity:1 !important;
  box-shadow:0 10px 22px rgba(11,99,246,.18), inset 0 1px 0 rgba(255,255,255,.22) !important;
  filter:none !important;
}
html body .site-header .btn-primary *,html body .nav-actions .btn-primary *{color:#ffffff !important;opacity:1 !important;}
html body .site-header .btn-primary:hover,html body .site-header .btn-primary:focus-visible,
html body .nav-actions .btn-primary:hover,html body .nav-actions .btn-primary:focus-visible{
  color:#ffffff !important;
  background:linear-gradient(135deg,#1672ff 0%,#3867ff 54%,#653af5 100%) !important;
  box-shadow:0 14px 28px rgba(11,99,246,.22), inset 0 1px 0 rgba(255,255,255,.30) !important;
  transform:translateY(-1px) !important;
  filter:none !important;
}

/* Preserve account input/back-link fixes from the approved final browser polish. */
html .login-page .input-shell,html .create-invoice-page .input-shell,html .account-page .input-shell{border-radius:15px !important;box-shadow:inset 0 1px 0 rgba(255,255,255,.96),0 7px 16px rgba(26,75,142,.035) !important;transform:none !important;}
html .login-page .input-shell:focus-within,html .create-invoice-page .input-shell:focus-within,html .account-page .input-shell:focus-within{box-shadow:0 0 0 3px rgba(11,99,246,.16),0 10px 22px rgba(26,75,142,.08) !important;transform:none !important;}
html .zg-back-link{width:auto !important;min-height:42px !important;padding:0 16px !important;border-radius:999px !important;font-size:14px !important;justify-self:start !important;box-shadow:0 10px 22px rgba(11,99,246,.07) !important;}
@media(max-width:680px){
  html .nav-dropdown__menu{width:min(244px,calc(100vw - 28px)) !important;}
  html .nav-dropdown__panel{padding:13px !important;}
  html .zg-back-link{max-width:100% !important; white-space:normal !important;}
}
@media(prefers-reduced-motion:reduce){
  html .site-header .btn-primary,html .nav-actions .btn-primary,html .nav-dropdown__badges a,html .zg-back-link{transition:none !important;}
  html .site-header .btn-primary:hover,html .nav-actions .btn-primary:hover,html .nav-dropdown__badges a:hover,html .zg-back-link:hover{transform:none !important;}
}

/* V301 definitive logo/header wash fix: the visible grey wash was the off-canvas skip-link shadow bleeding into the header.
   Keep the skip link accessible, but remove all visual paint while it is hidden. */
html body .z-skip-link:not(:focus):not(:focus-visible){
  opacity:0 !important;
  box-shadow:none !important;
  filter:none !important;
  pointer-events:none !important;
  transform:translateY(-220%) !important;
}
html body .z-skip-link:focus,
html body .z-skip-link:focus-visible{
  opacity:1 !important;
  pointer-events:auto !important;
  box-shadow:0 18px 42px rgba(7,22,50,.22) !important;
  transform:translateY(0) !important;
}

/* V302: hero gradient-text clipping fix
   Root cause: large negative letter spacing + background-clipped inline gradient text can clip the
   final glyph at the right edge of a hero line. Give gradient hero spans a tiny paint buffer while
   preserving the approved typography, color, layout, and text content. */
.z-simple-hero h1,
.z-hero h1,
.hero h1,
.invoice-generator-hero h1,
.invoice-generator-master .invoice-generator-hero h1,
.industry-hero h1,
.industry-template-simple h1,
.template-hero h1,
.invoice-template-final .template-hero h1,
.invoice-template-final-page h1{
  overflow:visible !important;
  text-wrap:balance;
}
.z-simple-hero h1 span,
.z-hero h1 span,
.hero h1 span,
.invoice-generator-hero h1 span,
.invoice-generator-master .invoice-generator-hero h1 span,
.industry-hero h1 span,
.industry-template-simple h1 span,
.template-hero h1 span,
.invoice-template-final .template-hero h1 span,
.invoice-template-final-page h1 span,
.gradient-text{
  display:inline-block !important;
  max-width:100% !important;
  overflow:visible !important;
  padding-right:.075em !important;
  margin-right:-.075em !important;
  padding-left:.015em !important;
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
}
@media(max-width:760px){
  .z-simple-hero h1 span,
  .z-hero h1 span,
  .hero h1 span,
  .invoice-generator-hero h1 span,
  .invoice-generator-master .invoice-generator-hero h1 span,
  .industry-hero h1 span,
  .industry-template-simple h1 span,
  .template-hero h1 span,
  .invoice-template-final .template-hero h1 span,
  .invoice-template-final-page h1 span,
  .gradient-text{
    padding-right:.095em !important;
    margin-right:-.095em !important;
  }
}


/* V303: SEO Read More/content readable-width containment fix.
   Keeps all SEO article copy inside the approved readable card/shell width and prevents
   any misplaced SEO paragraph from stretching full viewport width. No content, link,
   header, logo, hero, or typography changes. */
.z-seo-content-v110{
  overflow:hidden;
}
.z-seo-content-v110 > .container,
.z-seo-content-v110 .z-seo-shell{
  max-width:1120px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:24px !important;
  padding-right:24px !important;
  box-sizing:border-box !important;
}
.z-seo-content-v110 .z-seo-content-card,
.z-seo-content-v110 .z-seo-card{
  max-width:1040px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}
.z-seo-content-v110 p,
.z-seo-content-v110 li{
  max-width:920px;
}
.z-seo-content-v110 .z-seo-content-card p,
.z-seo-content-v110 .z-seo-card p,
.z-seo-content-v110 .z-seo-content-card li,
.z-seo-content-v110 .z-seo-card li{
  margin-left:0;
  margin-right:0;
}
.z-seo-content-v110 > p,
.z-seo-content-v110 > .container > p,
.z-seo-content-v110 > .z-seo-shell > p{
  max-width:920px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:24px !important;
  padding-right:24px !important;
  box-sizing:border-box !important;
}
@media(max-width:760px){
  .z-seo-content-v110 > .container,
  .z-seo-content-v110 .z-seo-shell{
    padding-left:18px !important;
    padding-right:18px !important;
  }
  .z-seo-content-v110 > p,
  .z-seo-content-v110 > .container > p,
  .z-seo-content-v110 > .z-seo-shell > p{
    padding-left:18px !important;
    padding-right:18px !important;
  }
}

/* V304: category template card description weight polish
   Keep card headings and View Template CTAs strong, but make body copy easier to scan. */
.industry-category-page .z-category-card small,
.invoice-template-category-page .z-category-card small,
.z-category-card__body small{
  font-weight:400 !important;
  color:#5f708a !important;
}


/* V305: focused visual/content polish batch.
   1) Hero gradient text clipping: add vertical/horizontal paint room for large clipped hero spans,
      especially descenders such as g/y/p and final glyphs at line ends. No font-size, weight,
      wording, color, or letter-spacing changes.
   2) Mobile App dropdown description: lighten body copy only; keep title and badges strong. */
html body .z-simple-hero h1,
html body .z-hero h1,
html body .hero h1,
html body .invoice-generator-hero h1,
html body .invoice-generator-master .invoice-generator-hero h1,
html body .industry-hero h1,
html body .industry-template-simple h1,
html body .template-hero h1,
html body .invoice-template-final .template-hero h1,
html body .invoice-template-final-page h1,
html body .home-final-page .home-hero-copy h1,
html body .z-template-hero h1,
html body .z-page-hero h1{
  overflow:visible !important;
  padding-bottom:.055em !important;
}
html body .z-simple-hero h1 span,
html body .z-hero h1 span,
html body .hero h1 span,
html body .invoice-generator-hero h1 span,
html body .invoice-generator-master .invoice-generator-hero h1 span,
html body .industry-hero h1 span,
html body .industry-template-simple h1 span,
html body .template-hero h1 span,
html body .invoice-template-final .template-hero h1 span,
html body .invoice-template-final-page h1 span,
html body .home-final-page .home-hero-copy h1 span,
html body .z-template-hero h1 span,
html body .z-page-hero h1 span,
html body .gradient-text{
  display:inline-block !important;
  overflow:visible !important;
  max-width:100% !important;
  line-height:1.12 !important;
  padding-top:.015em !important;
  padding-bottom:.14em !important;
  padding-left:.025em !important;
  padding-right:.12em !important;
  margin-left:-.025em !important;
  margin-right:-.12em !important;
  margin-bottom:-.14em !important;
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
  vertical-align:baseline !important;
}
html body .site-header .nav-dropdown__text{
  font-weight:400 !important;
}

/* V310: sitewide SEO/content heading polish
   Keeps long Read More card headings readable across all pages and prevents oversized, heavy lines from dominating the content card. */
.z-seo-content-v110 .z-seo-content-card h2,
.z-seo-content-v110 .z-seo-card h2{
  max-width:920px !important;
  font-size:clamp(28px,2.35vw,38px) !important;
  line-height:1.14 !important;
  letter-spacing:-.042em !important;
  margin-bottom:16px !important;
  text-wrap:balance;
}
.z-seo-content-v110 .z-seo-content-card h3,
.z-seo-content-v110 .z-seo-card h3{
  max-width:880px !important;
  font-size:clamp(21px,1.55vw,27px) !important;
  line-height:1.22 !important;
  letter-spacing:-.025em !important;
  color:#071f4d !important;
  margin:30px 0 12px !important;
  text-wrap:balance;
}
.z-seo-content-v110 .z-seo-content-card,
.z-seo-content-v110 .z-seo-card{
  padding-top:38px !important;
  padding-bottom:38px !important;
}
@media(max-width:760px){
  .z-seo-content-v110 .z-seo-content-card h2,
  .z-seo-content-v110 .z-seo-card h2{
    font-size:clamp(26px,7vw,32px) !important;
    line-height:1.16 !important;
    letter-spacing:-.035em !important;
  }
  .z-seo-content-v110 .z-seo-content-card h3,
  .z-seo-content-v110 .z-seo-card h3{
    font-size:21px !important;
  }
}
