/* V2.7 — Hero + capabilities layout with 80%-width liquid-glass navigation. */
:root { --floating-nav-radius: 39px; }
html { scroll-padding-top: 128px; }
body { background: #fafdff; }
.site-header {
  position: sticky;
  top: 16px;
  z-index: 100;
  width: 80%;
  max-width: 1480px;
  height: 82px;
  margin: 21px auto 0;
  border: 1px solid rgba(237,243,235,.8);
  border-radius: var(--floating-nav-radius);
  background:
    linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.54)),
    linear-gradient(115deg, rgba(181,208,174,.18), rgba(255,255,255,0) 28%),
    linear-gradient(245deg, rgba(121,241,208,.14), rgba(255,255,255,0) 36%);
  box-shadow:
    0 22px 60px rgba(46,56,41,.14),
    0 10px 24px rgba(105,162,91,.10),
    inset 0 1px 0 rgba(255,255,255,.9),
    inset 0 -1px 0 rgba(255,255,255,.36);
  backdrop-filter: blur(32px) saturate(175%);
  -webkit-backdrop-filter: blur(32px) saturate(175%);
  isolation: isolate;
  overflow: visible;
}
.site-header::before,
.site-header::after{content:"";position:absolute;pointer-events:none;inset:0;border-radius:inherit}
.site-header::before{
  background: linear-gradient(180deg, rgba(255,255,255,.8), rgba(255,255,255,0) 42%);
  opacity:.9;
  mask: linear-gradient(180deg, #000 0 56%, transparent 88%);
}
.site-header::after{
  inset: 2px;
  border-radius: calc(var(--floating-nav-radius) - 2px);
  border: 1px solid rgba(255,255,255,.36);
}
.site-header .nav-wrap.container {
  width: 100%; max-width: none; height: 100%; padding: 0 clamp(18px, 2.3vw, 34px); gap: 14px;
}
.site-header .logo {font-size: clamp(26px, 2.25vw, 32px); letter-spacing:-1.6px; }
/* The mark is a tight-trimmed image with no transparent slack, so the negative
   margins that tucked the old bar glyph against the wordmark are gone. */
.site-header .logo-mark {width: 31px;}
.site-header .desktop-nav { gap: clamp(16px,2.4vw,35px); margin-left:0; }
.site-header .desktop-nav>a,
.site-header .desktop-nav .nav-details>summary { font-size:14px; }
.site-header .header-actions {gap:clamp(12px,1.75vw,24px);}
.site-header .btn-header {
  height: 47px; padding: 0 21px; border-radius: 999px;
  background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.6));
  border: 1px solid rgba(255,255,255,.7);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 10px 18px rgba(87,123,79,.10);
}
.site-header .login-link{
  min-height:44px; display:inline-flex; align-items:center; padding:0 2px;
}
.site-header .nav-dropdown {top:58px; border-radius:20px; background:rgba(255,255,255,.84); backdrop-filter: blur(22px) saturate(160%); box-shadow:0 24px 54px rgba(66,93,60,.16);}
main .hero { min-height: max(840px, calc(100svh - 21px)); }
main .hero-grid { min-height: min(960px, calc(100svh - 20px)); }

@media (min-width:1111px) and (max-width:1310px) {
  .site-header .desktop-nav {gap:13px;}
  .site-header .desktop-nav>a, .site-header .desktop-nav .nav-details>summary {font-size:12px;}
  .site-header .logo {font-size:26px;}
  .site-header .header-actions {gap:12px;}
  .site-header .btn-header {padding:0 16px;}
}
@media(max-width:1110px){
  .site-header {height:74px; border-radius:28px;top:12px;margin-top:15px;width:min(92%, 880px);}
  .site-header .desktop-nav{display:none;}
  .site-header .menu-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border:0;background:transparent;width:46px;height:46px;padding:8px;border-radius:14px;}
  .site-header .menu-button span{width:22px;height:2px;border-radius:3px;background:#364532;}
  .site-header .mobile-menu:not([hidden]){
    display:flex;flex-direction:column;position:absolute;left:0;top:calc(100% + 10px);width:100%;
    padding:12px 19px 17px;gap:3px;background:rgba(255,255,255,.92);border:1px solid rgba(237,243,235,.86);
    border-radius:26px;box-shadow:0 24px 55px rgba(46,56,41,.17);backdrop-filter:blur(22px);overflow:auto;max-height:calc(100svh - 115px);
  }
  .site-header .mobile-menu a{padding:13px 8px; min-height:44px;}
}
@media(min-width:701px) and (max-width:1110px){
  main .hero{min-height:1150px;}
  main .hero-grid{min-height:1050px;}
}
@media(max-width:700px){
  .site-header {height:68px; top:10px; margin-top:13px; border-radius:24px; width:min(94%, 430px);}
  .site-header .nav-wrap.container{padding-inline:clamp(11px,3vw,18px);gap:3px;}
  .site-header .logo {font-size:clamp(23px,5.7vw,28px); gap:6px; letter-spacing:-1.25px;}
  .site-header .logo-mark{width:21px;}
  .site-header .header-actions{margin-left:auto;gap:4px;}
  .site-header .login-link{display:none;}
  .site-header .btn-header{height:42px;min-width:42px;width:42px;border-radius:999px;padding:0;gap:0;}
  .site-header .btn-header .header-cta-label{display:none;}
  .site-header .btn-header .icon{width:19px;height:19px;}
  .site-header .menu-button{width:40px;height:42px;padding:7px;}
  .site-header .menu-button span{width:19px;}
  .site-header .mobile-menu:not([hidden]){padding:10px 13px 14px;border-radius:22px;}
}
@media(max-width:350px){
  .site-header .nav-wrap.container{padding-inline:10px;}
  .site-header .logo{font-size:22px;}
  .site-header .btn-header{width:38px;min-width:38px;height:40px;}
  .site-header .menu-button{width:36px;}
}
@media(prefers-reduced-motion:reduce){.site-header {transition:none;}}

/* V2.8 contrast correction: visible conversion action on the liquid-glass nav. */
.site-header .btn-header,
.site-header .btn-header:link,
.site-header .btn-header:visited{
  color:var(--on-action);
  background:var(--action);
  border:1px solid rgba(63,74,60,.65);
  box-shadow:0 10px 24px rgba(63,74,60,.25),inset 0 1px 0 rgba(255,255,255,.23);
}
.site-header .btn-header:hover{box-shadow:0 14px 27px rgba(63,74,60,.32)}