:root {
  --jp-header-blue: #013274;
}

html {
  scroll-behavior: auto !important;
  overflow-x: clip;
}

body {
  overflow-x: clip;
}

section[id] {
  scroll-margin-top: 96px;
}

/* Cabecera: color sólido tomado del fondo real del logotipo. */
.site-header {
  background: var(--jp-header-blue) !important;
  border-bottom-color: rgba(255, 255, 255, 0.14) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.brand,
.brand img,
.nav {
  background-color: var(--jp-header-blue) !important;
}

/* Subtítulo principal más fino y sobrio. */
.hero-kicker {
  color: #d8e5ef !important;
  font-family: "Helvetica Neue", "Segoe UI", Arial, sans-serif !important;
  font-size: clamp(12px, 1vw, 14px) !important;
  font-weight: 300 !important;
  letter-spacing: 0.2em !important;
  text-transform: none !important;
}

/* Elimina los símbolos decorativos de flecha. */
.button > span[aria-hidden="true"],
.text-link > span[aria-hidden="true"] {
  display: none !important;
}

.button,
.text-link {
  gap: 0 !important;
}

.area-row {
  grid-template-columns: 65px 1fr 1fr !important;
}

.area-row > a {
  display: none !important;
}

/* Balanza del logotipo, integrada como medallón animado. */
.process-intro::before {
  content: "";
  display: block;
  width: 140px;
  aspect-ratio: 1;
  margin-bottom: 38px;
  border: 1px solid rgba(1, 50, 116, 0.16);
  border-radius: 50%;
  background-color: var(--jp-header-blue);
  background-image: url("/images/logo-horizontal.jpeg");
  background-repeat: no-repeat;
  background-position: -20px -48px;
  background-size: 550px auto;
  box-shadow: 0 18px 45px rgba(1, 50, 116, 0.14);
  transform-origin: 50% 22%;
  animation: jp-balance-sway 4.8s ease-in-out infinite;
}

@keyframes jp-balance-sway {
  0%, 100% {
    transform: translateY(0) rotate(-1.8deg);
  }
  50% {
    transform: translateY(-7px) rotate(1.8deg);
  }
}

/* Mejoras táctiles y de lectura en móvil. */
@media (max-width: 800px) {
  section[id] {
    scroll-margin-top: 82px;
  }

  .nav {
    background: var(--jp-header-blue) !important;
  }

  .hero-kicker {
    font-size: 11px !important;
    letter-spacing: 0.16em !important;
    line-height: 1.65 !important;
  }

  .area-row {
    grid-template-columns: 35px 1fr !important;
  }

  .area-row p {
    grid-column: 2 !important;
  }

  .process-intro::before {
    width: 110px;
    margin-bottom: 28px;
    background-position: -16px -38px;
    background-size: 435px auto;
  }

  .appointment-form input,
  .appointment-form select {
    font-size: 16px !important;
  }

  .nav a,
  .button,
  .menu-toggle,
  .footer-bottom button {
    min-height: 44px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .process-intro::before {
    animation: none !important;
  }
}

/* Marca tipográfica del pie: sin fondo rectangular de la imagen. */
.footer-brand img {
  display: none !important;
}
.footer-brand::before {
  content: "Játiva Porcar";
  display: block;
  color: #fff;
  font-family: "Helvetica Neue", "Segoe UI", Arial, sans-serif;
  font-size: 30px;
  font-weight: 400;
  letter-spacing: -0.025em;
  line-height: 1.2;
}
.footer-brand p::before {
  content: "ASESORES & ABOGADOS";
  display: block;
  margin: 8px 0 20px;
  color: #adc4d1;
  font-family: "Helvetica Neue", "Segoe UI", Arial, sans-serif;
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.18em;
  line-height: 1.5;
}