/* ProComPi shared site shell v30: responsive header, full-screen mobile menu and proportionate footer logo. */
:root{
  --pc-deep:#001a3e;
  --pc-navy:#003274;
  --pc-royal:#025fdd;
  --pc-sky:#91c0ff;
  --pc-white:#ffffff;
  --pc-shell:1240px;
  --pc-header-expanded:92px;
  --pc-header-compact:64px;
  --pc-logo-expanded:184px;
  --pc-logo-compact:164px;
  --pc-footer-logo-expanded:110.4px; /* 60% of 184px */
  --pc-footer-logo-compact:98.4px; /* 60% of 164px */
}

html{
  scroll-padding-top:calc(var(--pc-header-compact) + 24px);
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body{overflow-x:hidden}
body.site-menu-is-open{overflow:hidden;touch-action:none}
main,section,header,footer{min-width:0}
img,svg,video,canvas{max-width:100%;height:auto}
button,input,select,textarea{font:inherit}

.site-header{
  position:fixed;
  z-index:9999;
  inset:0 0 auto;
  height:var(--pc-header-expanded);
  color:var(--pc-white);
  background:transparent;
  border-bottom:1px solid transparent;
  box-shadow:none;
  transition:
    height .28s cubic-bezier(.2,.75,.25,1),
    background-color .24s ease,
    border-color .24s ease,
    box-shadow .24s ease,
    backdrop-filter .24s ease;
}
.site-header.is-scrolled{
  height:var(--pc-header-compact);
  background:rgba(0,26,62,.95);
  border-bottom-color:rgba(255,255,255,.13);
  box-shadow:0 12px 34px rgba(0,20,52,.24);
  backdrop-filter:blur(16px) saturate(130%);
  -webkit-backdrop-filter:blur(16px) saturate(130%);
}
.site-header .site-nav{
  position:static !important;
  inset:auto !important;
  display:block;
  height:100%;
  padding:0 !important;
  color:inherit;
  background:none !important;
  border:0 !important;
}
.site-shell{
  width:min(calc(100% - 48px),var(--pc-shell));
  height:100%;
  margin-inline:auto;
}
.site-nav__inner{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  height:100%;
}
.site-brand{
  position:relative;
  z-index:3;
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  line-height:0;
}
.site-brand img{
  display:block;
  width:var(--pc-logo-expanded) !important;
  max-width:none;
  height:auto;
  filter:drop-shadow(0 5px 16px rgba(0,0,0,.22));
  transition:width .28s cubic-bezier(.2,.75,.25,1);
}
.site-header.is-scrolled .site-brand img{width:var(--pc-logo-compact) !important}

.site-nav__links{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:24px;
  margin-left:auto;
}
.site-nav__links a{
  position:relative;
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:4px 0;
  color:rgba(255,255,255,.90) !important;
  text-decoration:none !important;
  font-size:.86rem;
  font-weight:780;
  line-height:1.2;
  letter-spacing:.005em;
  white-space:nowrap;
  transition:color .18s ease,background .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.site-nav__links a:not(.site-nav__cta)::after{
  content:"";
  position:absolute;
  right:0;
  bottom:5px;
  left:0;
  height:2px;
  border-radius:99px;
  background:var(--pc-sky);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .18s ease;
}
.site-nav__links a:not(.site-nav__cta):hover,
.site-nav__links a:not(.site-nav__cta):focus-visible,
.site-nav__links a[aria-current="page"]{color:#fff !important}
.site-nav__links a:not(.site-nav__cta):hover::after,
.site-nav__links a:not(.site-nav__cta):focus-visible::after,
.site-nav__links a[aria-current="page"]::after{transform:scaleX(1)}

/* High-contrast CTA in every header state. */
.site-nav__cta{
  min-height:48px !important;
  padding:12px 19px !important;
  color:#fff !important;
  background:var(--pc-royal) !important;
  border:1px solid rgba(255,255,255,.75) !important;
  border-radius:999px !important;
  box-shadow:0 10px 28px rgba(0,24,68,.24),inset 0 0 0 1px rgba(255,255,255,.08);
}
.site-header.is-scrolled .site-nav__cta{
  color:var(--pc-deep) !important;
  background:var(--pc-sky) !important;
  border-color:var(--pc-sky) !important;
}
.site-nav__cta:hover,
.site-nav__cta:focus-visible{
  transform:translateY(-2px);
  color:var(--pc-deep) !important;
  background:#fff !important;
  border-color:#fff !important;
  box-shadow:0 14px 34px rgba(0,18,48,.28);
}

.site-menu-toggle{
  position:relative;
  z-index:3;
  display:none;
  flex:0 0 auto;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  padding:0;
  color:#fff !important;
  background:var(--pc-royal) !important;
  border:2px solid var(--pc-sky) !important;
  border-radius:14px;
  box-shadow:0 8px 24px rgba(0,20,52,.28),0 0 0 1px rgba(255,255,255,.22) inset;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  cursor:pointer;
}
.site-header.is-scrolled .site-menu-toggle{
  color:#fff !important;
  background:var(--pc-royal) !important;
  border-color:var(--pc-sky) !important;
}
.site-menu-toggle:hover{
  color:#fff !important;
  background:var(--pc-navy) !important;
  border-color:#fff !important;
}
.site-menu-toggle:focus-visible{
  color:#fff !important;
  background:var(--pc-navy) !important;
  border-color:#fff !important;
  outline:3px solid var(--pc-sky);
  outline-offset:3px;
}
.site-menu-toggle__icon,
.site-menu-toggle__icon::before,
.site-menu-toggle__icon::after{
  display:block;
  width:22px;
  height:2px;
  border-radius:2px;
  background:currentColor;
  transition:transform .2s ease,opacity .2s ease,top .2s ease;
}
.site-menu-toggle__icon{position:relative}
.site-menu-toggle__icon::before,
.site-menu-toggle__icon::after{content:"";position:absolute;left:0}
.site-menu-toggle__icon::before{top:-7px}
.site-menu-toggle__icon::after{top:7px}
.site-header.menu-open .site-menu-toggle__icon{background:transparent}
.site-header.menu-open .site-menu-toggle__icon::before{top:0;transform:rotate(45deg)}
.site-header.menu-open .site-menu-toggle__icon::after{top:0;transform:rotate(-45deg)}

/* Keep page heroes clear of the expanded transparent header. */
.page-home .hero,
.page-methodology .hero,
.page-discovery .page-hero,
.page-privacy .legal-hero,
.page-terms .legal-hero{
  padding-top:max(164px,calc(var(--pc-header-expanded) + 72px)) !important;
}
.page-methodology .hero,
.page-discovery .page-hero,
.page-privacy .legal-hero,
.page-terms .legal-hero{border-bottom:1px solid rgba(145,192,255,.25)}

.site-footer{
  position:relative;
  padding:58px 0 24px !important;
  color:#fff !important;
  background:
    radial-gradient(circle at 82% 10%,rgba(2,95,221,.18),transparent 30%),
    linear-gradient(145deg,var(--pc-deep),#00295f 72%,#003274) !important;
  border-top:1px solid rgba(145,192,255,.20);
}
.site-footer__main{
  display:grid;
  grid-template-columns:minmax(0,1.75fr) minmax(150px,.55fr) minmax(150px,.55fr);
  gap:56px;
  align-items:start;
  height:auto;
}
.site-footer__brand img{
  display:block;
  width:var(--pc-footer-logo-expanded) !important;
  max-width:none;
  height:auto;
  margin:0 0 18px;
  transition:width .28s cubic-bezier(.2,.75,.25,1);
}
body.site-header-is-scrolled .site-footer__brand img{
  width:var(--pc-footer-logo-compact) !important;
}
.site-footer__note{
  max-width:680px;
  margin:0;
  color:rgba(255,255,255,.68) !important;
  font-size:.78rem;
  line-height:1.72;
}
.site-footer__column h2{
  margin:4px 0 15px;
  color:#fff;
  font-family:inherit;
  font-size:.76rem;
  line-height:1.2;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.site-footer__links{display:grid;gap:11px}
.site-footer__links a{
  width:max-content;
  max-width:100%;
  color:rgba(255,255,255,.82) !important;
  text-decoration:none !important;
  font-size:.84rem;
  line-height:1.4;
}
.site-footer__links a:hover,
.site-footer__links a:focus-visible{color:#fff !important;text-decoration:underline !important;text-underline-offset:4px}
.site-footer__bottom{
  display:flex;
  justify-content:space-between;
  gap:24px;
  height:auto;
  margin-top:42px;
  padding-top:20px;
  color:rgba(255,255,255,.58);
  border-top:1px solid rgba(255,255,255,.12);
  font-size:.72rem;
  line-height:1.5;
}

/* General resilience across narrow and wide screens. */
@media (max-width:1080px){
  :root{
    --pc-logo-expanded:172px;
    --pc-logo-compact:154px;
    --pc-footer-logo-expanded:103.2px; /* 60% of 172px */
    --pc-footer-logo-compact:92.4px; /* 60% of 154px */
  }
  .site-nav__links{gap:18px}
  .site-nav__links a{font-size:.81rem}
}

@media (max-width:940px){
  :root{
    --pc-header-expanded:80px;
    --pc-header-compact:56px;
    --pc-logo-expanded:166px;
    --pc-logo-compact:146px;
    --pc-footer-logo-expanded:99.6px; /* 60% of 166px */
    --pc-footer-logo-compact:87.6px; /* 60% of 146px */
  }
  .site-shell{width:min(calc(100% - 34px),var(--pc-shell))}
  .site-menu-toggle{display:inline-flex}

  /* Full-page mobile navigation. */
  .site-nav__links{
    position:fixed;
    z-index:2;
    inset:0;
    width:100%;
    height:100vh;
    height:100dvh;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    gap:4px;
    margin:0;
    padding:
      calc(env(safe-area-inset-top,0px) + var(--pc-header-expanded) + 28px)
      clamp(24px,8vw,72px)
      calc(env(safe-area-inset-bottom,0px) + 26px);
    overflow-y:auto;
    overscroll-behavior:contain;
    background:
      radial-gradient(circle at 80% 18%,rgba(145,192,255,.18),transparent 27%),
      radial-gradient(circle at 18% 82%,rgba(2,95,221,.20),transparent 30%),
      linear-gradient(160deg,#001a3e 0%,#003274 62%,#002456 100%);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-12px);
    transition:opacity .22s ease,visibility .22s ease,transform .22s ease;
  }
  .site-header.menu-open .site-nav__links{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
  }
  .site-header.menu-open{
    background:transparent;
    border-bottom-color:transparent;
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
  .site-header.menu-open .site-brand img{width:var(--pc-logo-expanded) !important}
  .site-header.menu-open .site-menu-toggle{
    color:#fff !important;
    background:var(--pc-royal) !important;
    border-color:var(--pc-sky) !important;
  }

  .site-nav__links a{
    width:min(100%,440px);
    min-height:58px;
    justify-content:center;
    padding:12px 18px;
    color:#fff !important;
    border-radius:14px;
    font-size:clamp(1.22rem,4.2vw,1.55rem);
    font-weight:780;
    line-height:1.15;
    letter-spacing:-.015em;
    text-align:center;
    white-space:normal;
  }
  .site-nav__links a:first-child{margin-top:auto}
  .site-nav__links a:not(.site-nav__cta)::after{display:none}
  .site-nav__links a:not(.site-nav__cta):hover,
  .site-nav__links a:not(.site-nav__cta):focus-visible,
  .site-nav__links a[aria-current="page"]{
    color:#fff !important;
    background:rgba(255,255,255,.10);
  }
  /* Mobile CTA uses a solid high-contrast treatment in every state,
     including when it is the current page. The more specific selector
     prevents the generic aria-current navigation rule from overriding it. */
  .site-nav__links .site-nav__cta,
  .site-header.is-scrolled .site-nav__links .site-nav__cta,
  .site-nav__links .site-nav__cta[aria-current="page"]{
    width:min(100%,440px) !important;
    min-height:60px !important;
    margin-top:auto;
    padding:15px 22px !important;
    color:var(--pc-navy) !important;
    background:#fff !important;
    border:2px solid #fff !important;
    font-size:clamp(1.02rem,3.5vw,1.18rem) !important;
    box-shadow:0 16px 42px rgba(0,13,35,.34),inset 0 0 0 1px rgba(0,50,116,.12);
  }
  .site-nav__links .site-nav__cta:hover,
  .site-nav__links .site-nav__cta:focus-visible,
  .site-nav__links .site-nav__cta[aria-current="page"]:hover,
  .site-nav__links .site-nav__cta[aria-current="page"]:focus-visible{
    color:var(--pc-deep) !important;
    background:var(--pc-sky) !important;
    border-color:var(--pc-sky) !important;
  }

  .site-footer__main{grid-template-columns:1fr 1fr;gap:38px 28px}
  .site-footer__brand{grid-column:1/-1}
}

@media (max-width:620px){
  :root{
    --pc-logo-expanded:154px;
    --pc-logo-compact:138px;
    --pc-footer-logo-expanded:92.4px; /* 60% of 154px */
    --pc-footer-logo-compact:82.8px; /* 60% of 138px */
  }
  .site-shell{width:min(calc(100% - 28px),var(--pc-shell))}
  .site-header.menu-open .site-brand img{width:var(--pc-logo-expanded) !important}
  .site-menu-toggle{width:46px;height:46px;border-radius:13px}
  .site-header.is-scrolled .site-menu-toggle{width:42px;height:42px}

  .page-home .hero,
  .page-methodology .hero,
  .page-discovery .page-hero,
  .page-privacy .legal-hero,
  .page-terms .legal-hero{
    padding-top:max(132px,calc(var(--pc-header-expanded) + 48px)) !important;
  }

  .site-nav__links{
    padding-right:20px;
    padding-left:20px;
  }
  .site-nav__links a{font-size:clamp(1.2rem,6vw,1.45rem)}

  .site-footer{padding-top:46px !important}
  .site-footer__main{grid-template-columns:1fr;gap:30px;text-align:center}
  .site-footer__brand{grid-column:auto}
  .site-footer__brand img{margin-inline:auto}
  .site-footer__note{margin-inline:auto}
  .site-footer__links{justify-items:center}
  .site-footer__bottom{flex-direction:column;align-items:center;gap:8px;margin-top:34px;text-align:center}
}

/* Short mobile screens and landscape: keep every item reachable. */
@media (max-width:940px) and (max-height:640px){
  .site-nav__links{
    gap:0;
    padding-top:calc(env(safe-area-inset-top,0px) + var(--pc-header-expanded) + 14px);
  }
  .site-nav__links a{
    min-height:46px;
    padding:8px 14px;
    font-size:1.05rem;
  }
  .site-nav__links a:first-child{margin-top:0}
  .site-nav__links .site-nav__cta,
  .site-header.is-scrolled .site-nav__links .site-nav__cta,
  .site-nav__links .site-nav__cta[aria-current="page"]{
    min-height:50px !important;
    margin-top:18px;
    font-size:1rem !important;
  }
}

@media (forced-colors:active){
  .site-menu-toggle{
    color:ButtonText !important;
    background:ButtonFace !important;
    border:2px solid ButtonText !important;
    forced-color-adjust:auto;
  }
}

@media (prefers-reduced-motion:reduce){
  .site-header,
  .site-header *,
  .site-header *::before,
  .site-header *::after{scroll-behavior:auto!important;transition:none!important}
}
