/* Refinamientos sobre el diseño aprobado. */
html { scroll-padding-top: 120px; }
.header { position: sticky; top: 0; z-index: 20; background: var(--paper); }
/* Multiply conserva el archivo original y funde su fondo con la cabecera. */
.header .brand { mix-blend-mode: multiply; }
.hero h1 em { color: var(--clay); }
.process { padding-top: 72px; padding-bottom: 72px; }
.steps { gap: 0; margin-top: 36px; }
.steps article { padding-right: 36px; }
.steps article + article { border-left: 1px solid rgba(24,24,24,.10); padding-left: 36px; }
.steps article::before { content: ''; display: block; width: 46px; height: 2px; background: var(--clay); margin-bottom: 22px; }
.contact-channels { display: flex; flex-wrap: wrap; gap: 12px 27px; margin-top: 25px; }
.contact-channels[hidden] { display: none; }
.contact-channels a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; text-decoration: none; font-size: 15px; }
.contact-channels a:hover { text-decoration: underline; text-underline-offset: 5px; }
.contact-channels .icon-arrow { width: 15px; height: 15px; flex-basis: 15px; }
@media (max-width: 700px) {
  html { scroll-padding-top: 150px; }
  .process { padding-top: 48px; padding-bottom: 48px; }
  .steps { gap: 28px; margin-top: 28px; }
  .steps article, .steps article + article { border: 0; padding: 0; }
  .steps article::before { width: 38px; margin-bottom: 16px; }
  .contact-channels { gap: 8px 22px; }
}
/* Lleva el marfil del JPEG a blanco; multiply deja ver el fondo exacto de la cabecera. */
.header .brand img { filter: brightness(1.06); }
