/* Windrush Studio — custom layer.
   Only put rules here that theme.json cannot express. */

/* Site header layout: logo on left, nav centred, CTAs on right. */
.wp-site-blocks > header {
  border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--muted) 40%, transparent);
}
.wp-block-site-logo img { width: 56px; height: 56px; object-fit: contain; }

/* Header CTA buttons: smaller padding and tighter tracking than body buttons. */
.wn-header-ctas .wp-block-button .wp-block-button__link {
  font-size: 0.75rem;
  padding: 0.55rem 0.95rem;
  letter-spacing: 0.12em;
}
.wn-header-ctas .wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent;
  color: var(--wp--preset--color--primary);
}

/* Underline-on-active navigation links (matches mockup). */
.wp-block-navigation .current-menu-item > a,
.wp-block-navigation .wp-block-navigation-item.current-menu-item > a {
  text-underline-offset: 6px;
  text-decoration: underline;
  text-decoration-thickness: 1px;
}

/* Decorative branch SVG corner accent: used in patterns via inline class. */
.wn-branch-accent {
  position: absolute;
  pointer-events: none;
  opacity: 0.7;
}
.wn-branch-accent--top-left  { top: 0;    left: 0;   width: 180px; }
.wn-branch-accent--top-right { top: 0;    right: 0;  width: 180px; transform: scaleX(-1); }

/* Gallery filter tabs. */
.wn-gallery-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  margin-block: var(--wp--preset--spacing--40);
}
.wn-gallery-tab {
  font-family: var(--wp--preset--font-family--body);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 0.55rem 1.1rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--wp--preset--color--muted) 60%, transparent);
  background: var(--wp--preset--color--background);
  color: var(--wp--preset--color--body);
  cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
}
.wn-gallery-tab[aria-pressed="true"] {
  background: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--primary-contrast);
  border-color: var(--wp--preset--color--primary);
}
.wn-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.75rem;
}
.wn-gallery-grid > figure { margin: 0; }
.wn-gallery-grid img {
  width: 100%; height: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 0.25rem;
}
.wn-gallery-grid > figure[hidden] { display: none; }

/* Service tiles (Contact page). */
.wn-service-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--wp--preset--spacing--40);
}
.wn-service-tile {
  text-align: center;
  padding: var(--wp--preset--spacing--40);
}
.wn-service-tile-icon {
  width: 48px; height: 48px; margin: 0 auto var(--wp--preset--spacing--30);
  display: grid; place-items: center;
  border-radius: 999px;
  border: 1px solid var(--wp--preset--color--muted);
  color: var(--wp--preset--color--primary);
}
.wn-service-tile h4 { margin: 0 0 0.5rem; }
.wn-service-tile p  { font-size: var(--wp--preset--font-size--sm); color: var(--wp--preset--color--body); margin: 0; }

/* Experiences icon grid (Community page). */
.wn-experiences {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: var(--wp--preset--spacing--40);
  text-align: center;
}
.wn-experiences > div span { display: block; font-size: 1.75rem; color: var(--wp--preset--color--primary); margin-bottom: 0.25rem; }
.wn-experiences > div p { font-size: var(--wp--preset--font-size--sm); margin: 0; }

/* Rates table. */
.wn-rates {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--wp--preset--spacing--40);
}
.wn-rates-col h4 {
  font-size: var(--wp--preset--font-size--lg);
  border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--muted) 50%, transparent);
  padding-bottom: 0.5rem;
}
.wn-rates-col ul { list-style: none; padding: 0; margin: 0; }
.wn-rates-col li {
  display: flex; justify-content: space-between; gap: 1rem;
  padding: 0.5rem 0;
  border-bottom: 1px dashed color-mix(in srgb, var(--wp--preset--color--muted) 30%, transparent);
}
.wn-rates-col li:last-child { border-bottom: 0; }
.wn-rates-price { font-weight: 600; color: var(--wp--preset--color--primary); white-space: nowrap; }

/* Hash-jump landings (e.g. /venue-hire/#gallery): leave a comfortable gap below the header. */
[id="gallery"],
[id="rates"],
[id="book-viewing"] {
  scroll-margin-top: 1rem;
}
