/* Identidad Fátima Martín Jimenez. Compartida por todas las plantillas. */
.site-header {
  min-height: 116px;
  gap: 28px;
  padding-block: 12px;
}
.site-header.is-scrolled { min-height: 116px; }
.site-header .brand,
.site-footer .brand {
  gap: 16px;
  font-family: var(--font-display);
  font-size: 27px;
  font-weight: 400;
  letter-spacing: -.025em;
  line-height: 1.12;
  white-space: normal;
  color: #513763;
}
.site-header .brand { min-width: 0; flex-shrink: 0; }
.site-header .brand > span { max-width: 320px; }
.site-header .brand-logo { width: 88px; height: 88px; }
.site-footer .brand { flex-direction: column; align-items: flex-start; gap: 15px; }
.site-footer .brand-logo { width: 112px; height: 112px; }
.site-header .brand small,
.site-footer .brand small {
  margin-top: 9px;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--teal-dark);
}
.site-header .brand > span { transition: color .3s ease; }
.site-header .brand:hover > span { color: var(--purple); }
.site-header .brand-logo { transform: none; animation: none; }
.nav ul.primary-links li a { transition-duration: .3s; }
html { scroll-padding-top: 140px; }

/* El nombre completo conserva su espacio antes de que la navegación se comprima. */
@media (max-width: 1150px) {
  .site-header,
  .site-header.is-scrolled {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px 20px;
    min-height: 0;
    padding: 12px 5%;
  }
  .site-header .nav { display: contents; }
  .site-header .nav ul.primary-links {
    display: flex;
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    justify-content: center;
  }
  .site-header .nav ul.primary-links li { flex: 1; text-align: center; }
  .site-header .nav ul.primary-links li a { display: grid; }
  .site-header .header-booking { grid-column: 2; grid-row: 1; margin: 0; }
  html { scroll-padding-top: 190px; }
}
@media (max-width: 560px) {
  .site-header,
  .site-header.is-scrolled { gap: 10px; padding: 10px 4%; }
  .site-header .brand { gap: 8px; font-size: 20px; }
  .site-header .brand > span { max-width: 150px; }
  .site-header .brand-logo { width: 56px; height: 56px; }
  .site-header .brand small { font-size: 8px; letter-spacing: .16em; margin-top: 6px; }
  .site-header .header-booking { font-size: 10px; padding: 10px; min-height: 44px; }
  .site-header .nav ul.primary-links li a { min-height: 44px; }
  html { scroll-padding-top: 175px; }
}
@media (prefers-reduced-motion: reduce) {
  .site-header .brand > span,
  .nav ul.primary-links li a { transition: none; }
}
