/* Safari-only switch to scroll to avoid the seam */
@supports (-webkit-touch-callout: none) {
  .has-background[style*="background-attachment:fixed"],
  .wp-block-cover[style*="background-attachment:fixed"] {
    background-attachment: scroll !important;
  }
}

/* DOTTED SEPARATOR */

:root :where(.wp-block-separator.is-style-dots):before {
  color: currentColor;
  content: "·········";  /* 9 dots */
  font-family: serif;
  font-size: 1.5em;
  letter-spacing: 0.8em;  /* tighter spacing so it fits nicely */
  padding-left: 25px;        /* remove extra indent */
}

.wp-block-separator.is-style-dots {
  text-align: center;     /* keeps it centered on the page */
}

/* NAVIGATION TWEAKS */

/* 1) Make the top-level nav list a flex row and center items vertically */
.wp-block-navigation ul.wp-block-navigation__container,
.wp-block-navigation > ul {
  display: flex;
  align-items: center;
}

/* 2) Each top-level LI becomes a tiny grid: [link] [dot] */
.wp-block-navigation ul.wp-block-navigation__container > li,
.wp-block-navigation > ul > li {
  display: grid;
  grid-auto-flow: column;
  align-items: center;
  column-gap: clamp(8px, 1.2vw, 18px);
}

/* 3) The dot cell (only for non-last items) */
.wp-block-navigation ul.wp-block-navigation__container > li:not(:last-child)::after,
.wp-block-navigation > ul > li:not(:last-child)::after {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff;
  justify-self: center;
  margin-right: -14px;
}

/* 4) Normalize link metrics so font line-height can’t nudge the dot */
.wp-block-navigation a {
  display: inline-block;
  line-height: 1;
}

/* Responsive tweaks */
@media (max-width: 900px) {
  .wp-block-navigation ul.wp-block-navigation__container > li:not(:last-child)::after,
  .wp-block-navigation > ul > li:not(:last-child)::after {
    width: 6px;
    height: 6px;
    column-gap: 16px;
    margin-right: -10px;
  }
}

@media (max-width: 700px) {
  .wp-block-navigation ul.wp-block-navigation__container > li::after,
  .wp-block-navigation > ul > li::after {
    display: none;
  }
}



/* --- 1. Hide all regular page titles (like 'About', 'Contact', etc.) --- */
body.page .wp-block-group.alignfull > .wp-block-post-title {
	display: none !important;
}

/* --- 2. Keep all individual blog post titles visible --- */
body.single-post .wp-block-post-title {
	display: block !important;
}

/* --- 3. Hide the 'Blog' summary page title --- */
/* This hides the heading at the top of the Blog posts list */
body.blog h1.wp-block-heading,
body.blog .wp-block-post-title,
body.blog .entry-title {
	display: none !important;
}

/* --- 4. Optional: if your blog summary is a static Page set as Posts page --- */
/* Replace 123 with the Blog page ID (found in the URL in the admin editor, e.g. post=123) */
body.page-id-123 .wp-block-post-title {
	display: none !important;
}

#wp--skip-link--target > .wp-block-group.has-global-padding.is-layout-constrained.alignfull {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

:root :where(.is-layout-constrained) > * {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
}

:where(.wp-site-blocks) > * {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
}

/* NAVIGATION RULES */

/* Reset any default outline or box shadow */
.wp-block-navigation a:focus {
  outline: none;
  box-shadow: none;
}

/* Show a custom or default focus style for keyboard users only */
.wp-block-navigation a:focus-visible {
  outline: 2px solid #3a86ff; /* or your brand color */
  outline-offset: 4px;
  border-radius: 4px;
}

/* Optional — if you just want it gone completely for mouse clicks */
.wp-block-navigation a:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}

/* Remove outline and box shadow on mouse click */
.query-loop-blog-post-title a:focus:not(:focus-visible),
.wp-block-post-title a:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}

/* Keep a clean, accessible focus style for keyboard users */
.query-loop-blog-post-title a:focus-visible,
.wp-block-post-title a:focus-visible {
  outline: 2px solid #3a86ff;  /* or whatever fits your design */
  outline-offset: 4px;
  border-radius: 4px;
}

/* MOBILE RULES */

.second_strapline {
  font-size: clamp(14px, 4vw, 20px);
  line-height: 1.4;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: keep-all;
  letter-spacing: 4px;
  text-align: center;
}

/* Target specific text content (optional and risky depending on content) */
.second_strapline:after {
  content: "";
  display: block;
}

/* Break dots manually using advanced regex selectors (non-standard) */

/* COLUMNS HEIGHT */

.wp-block-columns.recent-project-columns {
  align-items: flex-start !important;
}

.wp-block-columns.recent-project-columns .wp-block-column {
  min-height: 0 !important;
  height: auto !important;
  flex-grow: 0 !important;
}

/* TEXT SHADOWS */

/* Simple text shadow */


/* GLOBAL IMAGE BACKGROUND OPACITY */

/* Reusable utility class for dark overlay */
.bg-darken {
  position: relative;
  z-index: 0;
}

.bg-darken::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5); /* adjust darkness */
  z-index: 1;
}

/* Ensure content sits above the overlay */
.bg-darken > * {
  position: relative;
  z-index: 2;
}

/* BACKGROUND OPACITY */

.blog-loop-wrapper {
  position: relative;
  overflow: hidden; /* keeps overlay confined to the block */
}

.blog-loop-wrapper::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.25); /* adjust opacity as needed */
  z-index: 1;
  pointer-events: none; /* lets you still click buttons/links inside */
}

.blog-loop-wrapper > * {
  position: relative;
  z-index: 2;
}

.single-post-background {
  position: relative;
  overflow: hidden; /* keeps overlay confined to the block */
}

.single-post-background::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45); /* adjust opacity as needed */
  z-index: 1;
  pointer-events: none; /* lets you still click buttons/links inside */
}

.single-post-background > * {
  position: relative;
  z-index: 2;
}

/* RESTORE PARAGRAPHS */

body.single-post .entry-content p,
body.single-post .wp-block-post-content p {
  margin-block-start: 1em !important;
  margin-block-end: 1em !important;
}