.content{ max-width:var(--container-lg); margin-inline:auto; padding-inline:var(--space-4); }
.content-inner{ max-width:var(--container-md); margin-inline:auto; }
.surface{ background:var(--surface); border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); }
.wrapper {
  max-width: min(1440px, 92vw);
  margin-inline: auto;
}

/* helpers */
.stack > * + *{ margin-block-start:var(--space-6); }
.cluster{ display:flex; flex-wrap:wrap; gap:var(--space-4); align-items:center; }
.grid{ display:grid; gap:var(--space-6); }
.grid-2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid-3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.grid-4{ grid-template-columns:repeat(4,minmax(0,1fr)); }

@media (max-width: 768px){
  .md\:grid-1{ grid-template-columns:1fr; }
}

/* Header sticky */
.header-sticky{ position:sticky; top:0; z-index:var(--z-sticky); background:var(--surface); }

/* Focus i accessibilitat */
:where(a,button,[role="button"],input,select,textarea):focus-visible{
  outline:2px solid var(--color-focus); outline-offset:2px;
}
.visually-hidden{ position:absolute!important; width:1px;height:1px; margin:-1px; padding:0; border:0; clip:rect(0 0 0 0); overflow:hidden; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.01ms!important; animation-iteration-count:1!important; transition-duration:0.01ms!important; scroll-behavior:auto!important; }
}

/* ===== Header base + layout ===== */
.site-header{
  position: relative;
  z-index: 50;
  padding-block: .5rem;
}

.site-header .header-grid{
  display: grid;
  grid-template-columns: 1fr auto 1fr;   /* centre 100% centrat */
  align-items: center;
  gap: 1rem;
  max-width: min(var(--container-lg), 92vw);
  margin-inline: auto;
  padding-inline: 16px;
}

.site-header .brand{ justify-self: start; display:inline-flex; align-items:center; }
.site-header .primary-nav{ justify-self: center; }
.site-header .header-cta{ justify-self: end; }

/* ===== Estat fosc amb text invertit (el teu bloc) ===== */
.site-header.header--strong{
  background: var(--color-bg-strong);
  color: var(--color-text-inverted);
}

/* En entorn fosc, enllaços en blanc per defecte */
.site-header.header--strong a{
  color: var(--color-text-inverted);
  text-decoration: none;
}

/* Logo / marca */
.site-header .brand{
  font-weight: 700;
  letter-spacing: .02em;
}

/* ===== Menú nivell 1 ===== */
.site-header .primary-nav > ul{
  display: flex;
  gap: .25rem;             /* separació entre items */
  list-style: none;
  margin: 0;
  padding: 0;
}

.site-header .primary-nav > ul > li > a{
  display: inline-block;
  padding: .75rem 1rem;
  color: var(--color-text-inverted);
  font-weight: 600;
  line-height: 1;
}

.site-header .primary-nav > ul > li > a:hover,
.site-header .primary-nav > ul > li.current-menu-item > a{
  color: var(--color-accent-alt); /* safrà clar al hover */
}




/* ===== Sticky + ombra separació ===== */
.header-sticky{
  position: sticky; top: 0; z-index: 60;
  box-shadow: 0 6px 20px rgba(0,0,0,.15);
}

/* ===== Focus accessibilitat sobre fons fosc ===== */
.site-header.header--strong a:focus-visible,
.site-header.header--strong button:focus-visible{
  outline: 3px solid var(--color-accent-alt);
  outline-offset: 3px;
  border-radius: .25rem;
}

/* ===== Responsive ===== */
@media (max-width: 992px){
  .site-header .primary-nav{ display: none; } /* canvia-ho per un menú hamburguesa si vols */
  .site-header .header-grid{ grid-template-columns: auto 1fr auto; }
}

@media (min-width: 1400px){
  .site-header .header-grid{ padding-inline: 24px; }
}

/* Grid amb columnes "elàstiques" i centre absolut */
.site-header .header-grid{
  display: grid;
  grid-template-columns: minmax(0,1fr) auto minmax(0,1fr);
  align-items: center;
  gap: 1rem;
  max-width: min(var(--container-lg), 92vw);
  margin-inline: auto;
  padding-inline: 16px;
}

/* Posicionament */
.site-header .brand{ justify-self: start; display: inline-flex; align-items: center; gap: .5rem; }
.site-header .primary-nav{ justify-self: center; display: grid; }

/* Logo WP i fallback de text */
.site-header .custom-logo{ display:block; height:auto; max-height: 44px; width:auto; }
.site-header .custom-logo-link{ display:inline-flex; align-items:center; }
.site-header .brand__text{
  font: 700 1.05rem/1 var(--font-sans, 'DM Sans', system-ui, sans-serif);
  letter-spacing: .02em;
  color: var(--color-text-inverted);
  text-decoration: none;
  white-space: nowrap;
}

/* Menú nivell 1 ben centrat (inline-flex al <ul>) */
.site-header .primary-nav > .menu{
  display: inline-flex;
  align-items: center;
  gap: .25rem;              /* separació entre <li> */
  list-style: none;
  margin: 0;
  padding: 0;
}
.site-header .primary-nav > .menu > li > a{
  display: inline-block;
  padding: .75rem 1rem;
  color: var(--color-text-inverted);
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
}
.site-header .primary-nav > .menu > li > a:hover,
.site-header .primary-nav > .menu > li.current-menu-item > a{
  color: var(--color-accent-alt);
}



/* Responsive: amaga menú (posa burger si vols) */
@media (max-width: 992px){
  .site-header .primary-nav{ display: none; }
  .site-header .header-grid{ grid-template-columns: auto 1fr auto; }
}