#cookie-banner{
  display:none;
  position:fixed; inset:0;
  z-index:3000;
  color:#111;
  text-align:center;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  justify-content:center; align-items:center;
}
#cookie-banner[aria-hidden="false"]{ display:flex }

#cookie-banner-content{
  width:40%; max-width:80%;
  padding:2rem; text-align:center; border-radius:1rem;
  background:#eef3f893;
  border:1px solid #000;
  box-shadow:0 .75rem 2rem rgba(0,0,0,.10);
}

#cookie-banner p{ margin:.25rem 0 1rem }

button.primary,
button.secondary{
  cursor:pointer; margin-top:1rem; font-size:1rem; color:#111;
  background:rgba(0,79,124,.08);
  border:1px solid #000;
  border-radius:.65rem; min-height:3rem; padding:.4rem 1rem;
  transition:background-color .25s, border-color .25s, transform .06s, box-shadow .25s;
}
button.primary{ width:12.5rem }
#secondary-buttons{ height:3rem; display:flex; justify-content:center; gap:.5rem }
button.secondary{ width:6rem }

button.primary:hover,
button.secondary:hover{ background:rgba(0,79,124,.14) }
button.primary:active,
button.secondary:active{ transform:translateY(1px); background:rgba(0,79,124,.18) }
button.primary:focus-visible,
button.secondary:focus-visible{ outline:.16rem solid rgba(0,79,124,.55); outline-offset:.18rem }

@media (orientation:portrait){
  #cookie-banner-content{ width:70% }
}