/* Cristal transparente con un canto ligero, sin franjas opacas. */
.header {
  --rim: 46px;
  background: transparent;
  -webkit-backdrop-filter: blur(0px);
  backdrop-filter: blur(0px);
  border: 1px solid #ffffff52;
}
.header, .header.scrolled {
  box-shadow: 0 15px 24px -19px #12243c66,
    inset 0 1px 1px #ffffff66, inset 0 -1px 2px #344e6326;
}
.header::before {
  inset: 6px;
  border-radius: calc(var(--rim) - 6px);
  border: 1px solid #ffffff33;
  background: none;
  box-shadow: 0 1px 1px #ffffff40, inset 0 -1px 1px #1839541a;
}
.header::after {
  inset: 1px;
  border-radius: calc(var(--rim) - 1px);
  background:
    radial-gradient(ellipse 30px 26px at 1.7% 17%, #ffffff66, transparent 78%),
    radial-gradient(ellipse 100px 5px at 57% 98%, #ffffff59, transparent 80%),
    radial-gradient(ellipse 100px 2px at 78% 0%, #ffffff80, transparent 80%),
    radial-gradient(ellipse 90px 2px at var(--shine-x) 1%, #ffffff66, transparent 85%);
  box-shadow: inset 0 1px 0 #ffffff59, inset 0 -1px 0 #ffffff33;
}
.header.scrolled { background: transparent; }
.header.scrolled::before { border-radius: calc(var(--rim) - 6px); }
.header.scrolled::after { border-radius: calc(var(--rim) - 1px); }
.header .glass-edge-light {
  border-width: 7px;
  filter: grayscale(1);
  opacity: .24;
  background:
    linear-gradient(180deg, #ffffffcc, #fff0 5px, #fff0 calc(100% - 6px), #ffffff99),
    conic-gradient(from 120deg at 50% 50%, #b6c5d326, #fff9 12%, #fff2 24%,
      #fff0 37%, #fff9 47%, #fff2 60%, #fff0 65%, #fff9 77%, #fff2 89%) border-box;
  background-origin: border-box;
  background-repeat: no-repeat;
}
.header .logo img { filter: none; }
.header .menu-links > a { text-shadow: 0 1px 1px #ffffff4d; }
.header .nav-contact {
  background: linear-gradient(155deg, #ffffffed, #f4f7f8c9 55%, #ffffffdb);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border-color: #ffffffd9;
  box-shadow: 0 6px 10px -6px #16304b80, inset 0 2px 2px #fff,
    inset 0 -2px 3px #45617a33, inset 2px 0 3px #fff9;
  transition: transform 100ms ease, box-shadow 100ms ease, background 100ms ease;
}
.header .nav-contact-phone { color: #10264d; font-size: 13px; font-weight: 700; text-shadow: none; }
.header .nav-contact-meta { color: #42526a; text-shadow: none; }
.header .nav-contact::before { color: #596d80; }
.header .nav-contact::after {
  inset: 4px; border-color: #ffffff73;
  background: radial-gradient(ellipse 40% 30% at 20% 0%, #fff6, transparent 90%);
  transition: opacity 100ms ease;
}
.header .nav-contact:active {
  transform: translateY(1px) scale(.985);
  background: linear-gradient(160deg, #e3eaf0e6, #ffffffe6);
  box-shadow: inset 0 3px 6px #10264d40, inset 0 -1px 1px #fff,
    0 1px 2px #16304b26;
  filter: none;
}
.header .nav-contact:active::after { opacity: .35; }
@media (prefers-reduced-motion: reduce) {
  .header .nav-contact, .header .nav-contact::after { transition: none; }
  .header .nav-contact:active { transform: none; }
}
.header .navlinks .button.primary {
  background:
    radial-gradient(ellipse 60% 15% at 50% 0%, #d9f4ffd9, transparent 95%),
    linear-gradient(180deg, #39658b 0%, #123b66 13%, #0a274d 47%, #081e3e 70%, #173e65 95%, #6894b0);
  border-color: #afd2eccc;
  box-shadow: 0 9px 13px -7px #071b39b3, inset 0 2px 2px #e2f6ffbf,
    inset 0 -4px 5px #020e2799, inset 4px 0 4px -2px #a4d6f5cc, inset -4px 0 4px -2px #a4d6f5cc;
}
.header .navlinks .button.primary::before {
  inset: 3px 9px auto; height: 29%;
  background: linear-gradient(172deg, #ffffff6b, #ffffff0a 70%, transparent);
  box-shadow: inset 0 1px 0 #fff9;
}
.header .navlinks .button.primary::after {
  inset: 5px; border-color: #9bcaec59;
  background: radial-gradient(ellipse 40% 9% at 50% 100%, #b3e1ff73, transparent);
  box-shadow: inset 0 -1px 1px #86bde666;
}
@media (max-width: 860px) { .header { --rim: 36px; } }
@media (max-width: 680px) { .header { --rim: 30px; } .header .glass-edge-light { border-width: 5px; } }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .header, .header.scrolled { background: #faf8f2; }
  .header .nav-contact { background: #edf1f3; }
}
