/*
Theme Name: Sonar
Description: Sonar child theme for Ollie. Brand colors, type, accessible text variants, sonar ring styles, and page patterns.
Author: Sonar
Template: ollie
Version: 0.9.6
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sonar
*/

/* Eyebrow label: Oswald, all caps, short rule above
---------------------------------------------------------------------------- */
p.is-style-eyebrow {
	font-family: var(--wp--preset--font-family--label);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1.3;
}
p.is-style-eyebrow::before {
	content: "";
	display: block;
	width: 2.5rem;
	height: 2px;
	margin-bottom: 0.75rem;
	background: currentColor;
}

/* Sonar rings: radiating circles + light grain, for dark sections
---------------------------------------------------------------------------- */
.is-style-sonar-rings {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}
.is-style-sonar-rings::before {
	content: "";
	position: absolute;
	z-index: -1;
	right: -22rem;
	top: 50%;
	transform: translateY(-50%);
	width: 60rem;
	height: 60rem;
	pointer-events: none;
	background: repeating-radial-gradient(circle at center, transparent 0 4.5rem, rgba(162, 255, 233, 0.22) 4.5rem calc(4.5rem + 1px));
	-webkit-mask-image: radial-gradient(circle at center, #000 30%, transparent 70%);
	mask-image: radial-gradient(circle at center, #000 30%, transparent 70%);
}
.is-style-sonar-rings::after {
	content: "";
	position: absolute;
	z-index: -1;
	inset: 0;
	pointer-events: none;
	opacity: 0.08;
	mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Links and focus on dark sections (white or Aqua only, per contrast rules)
---------------------------------------------------------------------------- */
.has-midnight-background-color a:where(:not(.wp-element-button)),
.has-marine-background-color a:where(:not(.wp-element-button)),
[class*="-gradient-background"] a:where(:not(.wp-element-button)) {
	color: var(--wp--preset--color--aqua);
}

/* Visible keyboard focus everywhere
---------------------------------------------------------------------------- */
:where(a, button, summary, input, select, textarea, .wp-element-button):focus-visible {
	outline: 3px solid var(--wp--preset--color--ember-text);
	outline-offset: 3px;
}
.has-midnight-background-color :focus-visible,
.has-marine-background-color :focus-visible,
[class*="-gradient-background"] :focus-visible {
	outline-color: var(--wp--preset--color--aqua);
}

/* Outline buttons: Aqua on dark, Teal text on light
---------------------------------------------------------------------------- */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	border: 2px solid currentColor;
	color: var(--wp--preset--color--teal-text);
}
.has-midnight-background-color .wp-block-button.is-style-outline > .wp-block-button__link,
.has-marine-background-color .wp-block-button.is-style-outline > .wp-block-button__link,
[class*="-gradient-background"] .wp-block-button.is-style-outline > .wp-block-button__link {
	color: var(--wp--preset--color--aqua);
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--aqua);
	border-color: var(--wp--preset--color--aqua);
	color: var(--wp--preset--color--midnight);
}

/* FAQ: plus/minus marker on details blocks
---------------------------------------------------------------------------- */
.wp-block-details summary {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 600;
	font-size: var(--wp--preset--font-size--medium);
	list-style: none;
	cursor: pointer;
	position: relative;
	padding-right: 2.5rem;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after {
	content: "+";
	position: absolute;
	right: 0.25rem;
	top: 0;
	font-weight: 400;
	color: var(--wp--preset--color--teal-text);
}
.wp-block-details[open] summary::after { content: "\2212"; }

@media (prefers-reduced-motion: reduce) {
	* { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}


/* Footer
---------------------------------------------------------------------------- */
.sonar-footer a:where(:not(.wp-element-button)) {
	color: var(--wp--preset--color--white);
	text-decoration: none;
}
.sonar-footer a:where(:not(.wp-element-button)):hover {
	text-decoration: underline;
	text-underline-offset: 0.2em;
}
.sonar-footer-list {
	list-style: none;
	padding-left: 0;
	margin: 0.75rem 0 0;
}
.sonar-footer-list li + li { margin-top: 0.4rem; }
.sonar-footer-title {
	white-space: nowrap;
	font-family: var(--wp--preset--font-family--label);
	font-size: var(--wp--preset--font-size--medium);
	letter-spacing: 0.3em;
	text-transform: uppercase;
	font-weight: 400;
}

/* Full-bleed sections meet the header and footer with no white gap
---------------------------------------------------------------------------- */
.wp-site-blocks > footer,
.page-template-page-service .wp-site-blocks > main { margin-block-start: 0; }
.page-template-page-service .wp-block-post-content > .alignfull:first-child { margin-block-start: 0; }

/* Section layout: hairline between white sections, heading row
---------------------------------------------------------------------------- */
.sonar-rule { border-top: 1px solid var(--wp--preset--color--border-light); }
.sonar-section-head { margin-bottom: var(--wp--preset--spacing--large); }
.sonar-section-head h2 { max-width: 24ch; margin-top: 0.5rem; margin-bottom: 0; }

/* Emphasis in headlines: italic, Aqua on dark, Teal text on light */
:where(h1, h2) em { font-style: italic; font-weight: 500; color: var(--wp--preset--color--teal-text); }
.has-white-color :where(h1, h2) em { color: var(--wp--preset--color--aqua); }

/* Numbered items (offerings, differentiators)
---------------------------------------------------------------------------- */
.sonar-items { column-gap: clamp(2rem, 5vw, 5rem); row-gap: var(--wp--preset--spacing--large); }
.sonar-item {
	border-top: 1px solid var(--wp--preset--color--border-light);
	padding-top: 1.25rem;
}
.sonar-item h3 { margin-top: 0.25rem; margin-bottom: 0.5rem; }
.sonar-item p { margin-top: 0; }
.sonar-index {
	font-family: var(--wp--preset--font-family--label);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--teal-text);
	margin: 0;
}
.sonar-more {
	font-family: var(--wp--preset--font-family--label);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* Statement */
.sonar-statement { font-size: var(--wp--preset--font-size--x-large); font-weight: 500; max-width: 20ch; }

/* Stats
---------------------------------------------------------------------------- */
.sonar-stat { border-left: 1px solid var(--wp--preset--color--border-light); padding-left: 1.5rem; }
.sonar-stat-number {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(2.5rem, 4.5vw, 3.75rem);
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.03em;
	margin: 0 0 0.5rem;
}

/* Hero columns breathe on wide screens */
.sonar-hero-columns { column-gap: clamp(2rem, 6vw, 6rem); }

/* Marine band (statement + stats): adjacent bands read as one */
.sonar-dark-band + .sonar-dark-band { padding-top: 0 !important; }
.sonar-dark-band .sonar-stat { border-left-color: rgba(255, 255, 255, 0.25); }
.has-marine-background-color :focus-visible { outline-color: var(--wp--preset--color--aqua); }
.has-neutral-background-color .sonar-item { border-top-color: #EADFD6; }
.has-neutral-background-color + .sonar-rule { border-top-color: transparent; }

/* Header: logo left, navigation and Contact right
---------------------------------------------------------------------------- */
.sonar-header { border-bottom: 1px solid var(--wp--preset--color--border-light); }
.sonar-header-right { gap: clamp(1rem, 3vw, 2.5rem); align-items: center; }
.sonar-nav .wp-block-navigation-item__content { padding: 0.25rem 0; }
.sonar-nav .wp-block-navigation__submenu-container {
	border: 1px solid var(--wp--preset--color--border-light) !important;
	padding: 0.5rem 0;
	min-width: 15rem !important;
}
.sonar-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: 0.45rem 1rem; }
.sonar-header .wp-block-site-logo img { height: auto; }

/* Panels, quotes, portraits, team
---------------------------------------------------------------------------- */
.sonar-panel h3 { margin-top: 0.5rem; }
.sonar-quote {
	border: 0;
	padding: 0;
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 400;
	line-height: 1.3;
}
.sonar-quote::before {
	content: "\201C";
	display: block;
	font-size: 4rem;
	line-height: 0.6;
	color: var(--wp--preset--color--teal);
}
.sonar-quote cite {
	display: block;
	margin-top: 1rem;
	font-family: var(--wp--preset--font-family--label);
	font-size: var(--wp--preset--font-size--small);
	font-style: normal;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--teal-text);
}
.sonar-portrait img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.sonar-member h3 { margin: 1rem 0 0.25rem; }
.sonar-role {
	font-family: var(--wp--preset--font-family--label);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--teal-text);
	margin-top: 0;
}
.sonar-founder { column-gap: clamp(2rem, 6vw, 6rem); }

/* Lists with check marks (objectives, landing benefits) */
.sonar-checklist { list-style: none; padding-left: 0; }
.sonar-checklist li { position: relative; padding-left: 1.75rem; margin-bottom: 0.5rem; }
.sonar-checklist li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55em;
	width: 0.85rem;
	height: 0.45rem;
	border-left: 2px solid var(--wp--preset--color--teal-text);
	border-bottom: 2px solid var(--wp--preset--color--teal-text);
	transform: rotate(-45deg);
}
.has-white-color .sonar-checklist li::before { border-color: var(--wp--preset--color--aqua); }

/* Blog: dates, bylines, author box */
.sonar-date {
	font-family: var(--wp--preset--font-family--label);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--teal-text);
}
.has-white-color .sonar-date { color: var(--wp--preset--color--aqua); }
.sonar-byline { gap: 0.35em; }
.sonar-byline p { margin: 0; }
.sonar-author-box { margin-top: var(--wp--preset--spacing--large); }
.sonar-author-box .wp-block-avatar img { border-radius: 50%; }
.sonar-item .wp-block-post-title a { color: inherit; text-decoration: none; }
.sonar-item .wp-block-post-title a:hover { text-decoration: underline; }

/* Search field on dark */
.sonar-search .wp-block-search__input { border: 0; padding: 0.75rem 1rem; }
.sonar-search .wp-block-search__button { background: var(--wp--preset--color--ember-text); color: #fff; }

/* Forms: box, placeholder note, and HubSpot fields in brand style
---------------------------------------------------------------------------- */
.sonar-form-box { border-top: 3px solid var(--wp--preset--color--teal); }
.sonar-form-placeholder {
	border: 2px dashed var(--wp--preset--color--border-light);
	padding: 1.25rem;
	color: var(--wp--preset--color--secondary);
	font-size: var(--wp--preset--font-size--small);
}
.hs-form fieldset { max-width: none !important; }
.hs-form label {
	font-family: var(--wp--preset--font-family--label);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--midnight);
}
.hs-form .hs-input:not([type="checkbox"]):not([type="radio"]) {
	width: 100% !important;
	padding: 0.7rem 0.85rem;
	border: 1px solid #8A94A3;
	border-radius: 0;
	font: inherit;
	color: var(--wp--preset--color--midnight);
	background: #fff;
}
.hs-form .hs-input:focus { outline: 3px solid var(--wp--preset--color--ember-text); outline-offset: 1px; }
.hs-form .hs-button {
	background: var(--wp--preset--color--ember-text);
	color: #fff;
	border: 0;
	padding: 0.85rem 1.6rem;
	font-family: var(--wp--preset--font-family--label);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
}
.hs-form .hs-error-msgs label { color: var(--wp--preset--color--ember-text); text-transform: none; letter-spacing: 0; }

/* Landing and CTA form box text stays dark on white */
.sonar-form-box a { color: var(--wp--preset--color--teal-text); }

/* About: founder photo fills its column; team as photo-beside-bio cards */
.sonar-portrait { width: 100%; margin: 0; }
.sonar-portrait img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; }
.sonar-founder { align-items: center; }
.sonar-founder .wp-block-column:last-child > p { max-width: 62ch; }
.sonar-member { border-top: 1px solid #EADFD6; padding-top: 1.5rem; }
.sonar-member-row { column-gap: 1.5rem; margin-bottom: 0; }
.sonar-member h3 { margin: 0 0 0.25rem; }

/* Team photo pair (0.9.3): headshot first, lifestyle photo fades in on hover,
   keyboard focus or tap. In the editor both photos show, stacked and labeled,
   so either can be replaced. */
.wp-block-group.sonar-photo-swap { position: relative; margin: 0; }
.sonar-photo-swap > .wp-block-image { margin: 0; }
body:not(.editor-styles-wrapper) .sonar-photo-swap { display: grid; }
body:not(.editor-styles-wrapper) .sonar-photo-swap > .wp-block-image { grid-area: 1 / 1; margin: 0; }
body:not(.editor-styles-wrapper) .sonar-photo-swap > .wp-block-image + .wp-block-image {
	opacity: 0;
	transition: opacity 0.5s ease;
}
@media (hover: hover) {
	.sonar-member:hover .sonar-photo-swap > .wp-block-image + .wp-block-image,
	.sonar-photo-swap:hover > .wp-block-image + .wp-block-image { opacity: 1; }
}
body:not(.editor-styles-wrapper) .sonar-photo-swap.is-flipped > .wp-block-image + .wp-block-image { opacity: 1; }
.sonar-photo-swap.has-swap { cursor: pointer; -webkit-tap-highlight-color: transparent; }
.sonar-photo-swap:focus-visible { outline: 2px solid var(--wp--preset--color--teal-text); outline-offset: 3px; }
/* Two small dots in the corner hint there is a second photo */
.sonar-photo-swap.has-swap::before,
.sonar-photo-swap.has-swap::after {
	content: "";
	position: absolute;
	z-index: 2;
	bottom: 0.75rem;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
	transition: opacity 0.3s;
	pointer-events: none;
}
.sonar-photo-swap.has-swap::before { right: 1.5rem; opacity: 1; }
.sonar-photo-swap.has-swap::after { right: 0.75rem; opacity: 0.45; }
.sonar-photo-swap.is-flipped::before { opacity: 0.45; }
.sonar-photo-swap.is-flipped::after { opacity: 1; }
@media (hover: hover) {
	.sonar-member:hover .sonar-photo-swap.has-swap::before,
	.sonar-photo-swap.has-swap:hover::before { opacity: 0.45; }
	.sonar-member:hover .sonar-photo-swap.has-swap::after,
	.sonar-photo-swap.has-swap:hover::after { opacity: 1; }
}
/* Editor: label the two photos */
.editor-styles-wrapper .sonar-photo-swap > .wp-block-image + .wp-block-image { margin-top: 0.75rem; }
.editor-styles-wrapper .sonar-photo-swap > .wp-block-image::before {
	content: "Headshot (shows first)";
	display: block;
	font-size: 12px;
	margin-bottom: 0.25rem;
	color: var(--wp--preset--color--teal-text);
}
.editor-styles-wrapper .sonar-photo-swap > .wp-block-image + .wp-block-image::before { content: "Lifestyle photo (shows on hover or tap)"; }

/* Mid-page form band (Mist), target of the hero's Get started button */
.sonar-form-band { scroll-margin-top: 1rem; }
.sonar-form-band .sonar-form-box { border-top-color: var(--wp--preset--color--teal); }
html { scroll-behavior: smooth; }

/* Role-based band colors: links and focus on the accent band */
.has-band-accent-background-color a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--aqua); }
.has-band-accent-background-color :focus-visible { outline-color: var(--wp--preset--color--aqua); }
.has-band-accent-background-color .wp-block-button.is-style-outline > .wp-block-button__link { color: var(--wp--preset--color--aqua); }
.has-band-warm-background-color .sonar-item,
.has-band-warm-background-color .sonar-member { border-top-color: #EADFD6; }
.has-band-warm-background-color + .sonar-rule { border-top-color: transparent; }

/* Client logos: scrolling band (still grid without JS or with reduced motion) */
.sonar-logos-head { margin-bottom: var(--wp--preset--spacing--medium); }
.sonar-logos-head p { margin: 0.25rem 0 0; }
.sonar-logos { gap: 0.5rem 2rem; align-items: center; }
.sonar-logo { margin: 0; flex: 0 0 auto; }
.sonar-logo img { display: block; width: 150px; height: 60px; object-fit: contain; opacity: 0.7; transition: opacity 0.2s; }
.sonar-logo img:hover { opacity: 1; }
.sonar-marquee.is-scrolling {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.sonar-marquee-track { display: flex; width: max-content; animation: sonar-marquee var(--sonar-marquee-time, 90s) linear infinite; }
.sonar-marquee.is-scrolling .sonar-logos { flex-wrap: nowrap !important; justify-content: flex-start !important; padding-right: 2rem; }
.sonar-marquee:hover .sonar-marquee-track,
.sonar-marquee:focus-within .sonar-marquee-track { animation-play-state: paused; }
@keyframes sonar-marquee { to { transform: translateX(-50%); } }
@media (min-width: 782px) { .sonar-logo img { width: 180px; height: 72px; } }

/* Testimonials */
.sonar-testimonial { border-top: 2px solid var(--wp--preset--color--teal); padding-top: 1.25rem; }
.sonar-testimonial-quote p {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.45;
	margin-top: 0;
}
.sonar-testimonial-quote p:first-child::before { content: "\201C"; }
.sonar-testimonial-quote p:last-child::after { content: "\201D"; }
.sonar-testimonial-name {
	font-family: var(--wp--preset--font-family--label);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--teal-text);
}
.sonar-reviews { margin-top: var(--wp--preset--spacing--small); }

/* Full-width header row */
.sonar-header-row { width: 100%; max-width: none; gap: 2rem; }
.sonar-header .wp-block-site-logo { flex-shrink: 0; }

/* Two-up lists on desktop regardless of container math (offerings, steps, team) */
@media (min-width: 782px) {
	.wp-block-group.sonar-items { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 781px) {
	.wp-block-group.sonar-items { grid-template-columns: 1fr !important; }
}

/* Long-form SEO sub-pages: readable column plus sticky side panel */
.sonar-longform { column-gap: clamp(2rem, 6vw, 6rem); }
.sonar-longform-main > p { max-width: 68ch; }
.sonar-longform-main h2 { margin-top: var(--wp--preset--spacing--large); scroll-margin-top: 1.5rem; }
.sonar-longform-main h2:first-of-type { margin-top: var(--wp--preset--spacing--medium); }
.sonar-aside {
	position: sticky;
	top: 2rem;
	border-left: 1px solid var(--wp--preset--color--border-light);
	padding-left: 1.5rem;
}
.sonar-aside-list { list-style: none; padding-left: 0; margin: 0.5rem 0 1.75rem; }
.sonar-aside-list li { margin-bottom: 0.45rem; }
.sonar-aside-list a { text-decoration: none; color: var(--wp--preset--color--main); }
.sonar-aside-list a:hover { text-decoration: underline; color: var(--wp--preset--color--teal-text); }
@media (max-width: 781px) { .sonar-aside { position: static; border-left: 0; padding-left: 0; } }

/* ==========================================================================
   Dark Page template (Who We Help): Midnight page, journey path
   ========================================================================== */
.wp-site-blocks:has(.sonar-header-dark) { background: var(--wp--preset--color--midnight); }
.sonar-header-dark { border-bottom-color: rgba(255, 255, 255, 0.12); }
.sonar-header-dark .sonar-nav,
.sonar-header-dark .sonar-nav .wp-block-navigation-item__content { color: #fff; }
.sonar-header-dark .sonar-nav .wp-block-navigation__submenu-container {
	background: var(--wp--preset--color--midnight) !important;
	border-color: rgba(255, 255, 255, 0.2) !important;
}
.sonar-header-dark .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--midnight) !important;
	color: #fff !important;
}
.sonar-header-dark :focus-visible,
.sonar-dk :focus-visible { outline-color: var(--wp--preset--color--aqua); }

/* Sections on Midnight, separated by hairlines */
.sonar-dk-rule { border-top: 1px solid rgba(255, 255, 255, 0.12); }
.sonar-dk a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--aqua); }
.sonar-dk .wp-block-button.is-style-outline > .wp-block-button__link { color: var(--wp--preset--color--aqua); }

/* Hero: the problem as a question, then the short answer */
.sonar-fix {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--x-large);
	font-style: italic;
	font-weight: 500;
	color: var(--wp--preset--color--aqua);
	margin-top: 1rem;
}

/* Hero: centered on the page, rings centered behind */
.sonar-hero-center { text-align: center; max-width: 960px; margin-left: auto !important; margin-right: auto !important; }
.sonar-hero-center > * { margin-left: auto !important; margin-right: auto !important; }
.sonar-hero-center h1 { max-width: 26ch; }
.sonar-hero-center p.is-style-eyebrow::before { margin-left: auto; margin-right: auto; }
.sonar-hero-center .wp-block-buttons { justify-content: center; }
.sonar-dk-hero.is-style-sonar-rings::before { right: auto; left: 50%; transform: translate(-50%, -50%); }

/* Outcome cards */
.sonar-dk-cards { gap: 1.25rem; }
@media (min-width: 600px) {
	.wp-block-group.sonar-dk-cards { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
.sonar-dk-card { border-top: 3px solid var(--wp--preset--color--aqua); }
.sonar-dk-card h3 { margin-top: 0; font-size: var(--wp--preset--font-size--medium); }
.sonar-dk-card p { margin-bottom: 0; }

/* Journey: two starting paths that merge into one track */
.sonar-fork { gap: 1.25rem; }
.sonar-path { border: 1px solid rgba(162, 255, 233, 0.4); }
.sonar-path h3 { margin: 0.25rem 0 0.5rem; }
.sonar-path p:last-child { margin-bottom: 0; }
.wp-block-spacer.sonar-merge {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 80' preserveAspectRatio='none'%3E%3Cpath d='M25 0 C25 45 50 35 50 80 M75 0 C75 45 50 35 50 80' fill='none' stroke='%23A2FFE9' stroke-width='2' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}
.sonar-track-label { text-align: center; margin-top: 0.75rem !important; }
.sonar-track-label::before { display: none !important; }
.sonar-track { position: relative; gap: 1rem; margin-top: 1.5rem !important; }
.sonar-track::before {
	content: "";
	position: absolute;
	top: 1.5rem;
	left: 10%;
	right: 10%;
	height: 1px;
	background: rgba(162, 255, 233, 0.5);
}
.sonar-step { position: relative; text-align: center; }
.sonar-node {
	width: 3rem;
	height: 3rem;
	margin: 0 auto 0.75rem;
	border: 1px solid var(--wp--preset--color--aqua);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--wp--preset--color--midnight);
	color: var(--wp--preset--color--aqua);
	font-family: var(--wp--preset--font-family--label);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.06em;
}
.sonar-step:first-child .sonar-node { background: var(--wp--preset--color--aqua); color: var(--wp--preset--color--midnight); }
.sonar-step h3 { margin: 0; font-family: var(--wp--preset--font-family--label); text-transform: uppercase; letter-spacing: 0.05em; }
.sonar-track-note { margin-top: var(--wp--preset--spacing--medium) !important; text-align: center; color: rgba(255, 255, 255, 0.85); }
@media (min-width: 782px) {
	.wp-block-group.sonar-track { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
	.wp-block-group.sonar-fork { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 599px) {
	.wp-block-group.sonar-dk-cards { grid-template-columns: 1fr !important; gap: 0.75rem; }
}
@media (max-width: 781px) {
	.wp-block-spacer.sonar-merge { display: none; }
	.sonar-track-label { margin-top: var(--wp--preset--spacing--medium) !important; }
	.wp-block-group.sonar-track { grid-template-columns: 1fr !important; gap: 1.25rem; }
	.wp-block-group.sonar-fork { grid-template-columns: 1fr !important; }
	.sonar-dk-card { padding: 1.25rem !important; }
	.sonar-track::before { left: 1.5rem; right: auto; top: 1.5rem; bottom: 1.5rem; width: 1px; height: auto; }
	.sonar-step { display: flex; align-items: center; gap: 1rem; text-align: left; }
	.sonar-node { margin: 0; flex-shrink: 0; }
	.sonar-track-label, .sonar-track-note { text-align: left; }
}

/* Query cards, items and testimonials on dark bands */
.sonar-on-dark .sonar-item,
.sonar-dk .sonar-item { border-top-color: rgba(255, 255, 255, 0.2); }
.sonar-on-dark .wp-block-post-title a { color: #fff; }
.sonar-on-dark .sonar-index,
.sonar-on-dark .sonar-testimonial-name { color: var(--wp--preset--color--aqua); }
.sonar-on-dark .sonar-testimonial { border-top-color: var(--wp--preset--color--aqua); }
.sonar-on-dark .sonar-form-placeholder { border-color: rgba(255, 255, 255, 0.3); color: rgba(255, 255, 255, 0.85); }
.sonar-local { border-left: 3px solid var(--wp--preset--color--aqua); padding-left: 1.5rem; }
.sonar-local h3 { margin-top: 0; }

/* ==========================================================================
   Blog: masthead, featured post, row list, single post, post calls to action
   ========================================================================== */
.sonar-masthead { border-bottom: 1px solid var(--wp--preset--color--border-light); }
.sonar-masthead-row { align-items: flex-end; column-gap: clamp(2rem, 6vw, 6rem); margin-bottom: 0; }
.sonar-masthead-title {
	font-size: clamp(3rem, 8vw, 6.5rem) !important;
	line-height: 0.95;
	letter-spacing: -0.045em;
	font-weight: 600;
	margin: 0 0 1.25rem;
}
.sonar-masthead-lead { color: var(--wp--preset--color--secondary); max-width: 42ch; margin-bottom: 0; }
.sonar-blog-search .wp-block-search__inside-wrapper { border: 0; padding: 0; }
.sonar-blog-search .wp-block-search__input { border: 1px solid #8A94A3; border-radius: 0; padding: 0.75rem 1rem; }
.sonar-blog-search .wp-block-search__button {
	background: var(--wp--preset--color--ember-text);
	color: #fff;
	border: 0;
	border-radius: 0;
	margin-left: 0;
	font-family: var(--wp--preset--font-family--label);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* Featured post: a dark panel, type only, so posts without images still look right */
.sonar-featured-title { font-size: clamp(1.75rem, 3.6vw, 2.75rem); line-height: 1.12; letter-spacing: -0.02em; margin: 0.5rem 0 1rem; }
.sonar-featured-title a { color: #fff; text-decoration: none; }
.sonar-featured-title a:hover { text-decoration: underline; text-decoration-color: var(--wp--preset--color--aqua); text-underline-offset: 0.2em; }
.sonar-featured-excerpt { font-size: var(--wp--preset--font-size--medium); color: rgba(255, 255, 255, 0.85); max-width: 60ch; }
.sonar-featured-excerpt p { margin: 0; }
.sonar-featured-meta { border-top: 1px solid rgba(255, 255, 255, 0.2); padding-top: 1rem; margin-top: 1.5rem !important; align-items: center; }
.sonar-featured-meta .sonar-date { color: var(--wp--preset--color--aqua); margin: 0; }
.sonar-featured-more {
	color: var(--wp--preset--color--aqua) !important;
	font-family: var(--wp--preset--font-family--label);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}
.sonar-featured :focus-visible { outline-color: var(--wp--preset--color--aqua); }
body.paged .sonar-featured-wrap { display: none; }

/* Post list as rows: date, title and excerpt, read link */
.sonar-rows { list-style: none; padding: 0; margin: 0; }
.sonar-row {
	display: grid;
	grid-template-columns: 10.5rem minmax(0, 1fr) auto;
	column-gap: clamp(1.5rem, 4vw, 3rem);
	align-items: start;
	border-top: 1px solid var(--wp--preset--color--border-light);
	padding: 1.75rem 0;
}
.sonar-rows > li:last-child .sonar-row { border-bottom: 1px solid var(--wp--preset--color--border-light); }
.sonar-row-date { margin: 0.35rem 0 0; white-space: nowrap; }
.sonar-row-main .wp-block-post-title { margin: 0 0 0.5rem; line-height: 1.2; }
.sonar-row-main .wp-block-post-title a { color: var(--wp--preset--color--main); text-decoration: none; }
.sonar-row-main .wp-block-post-title a:hover { color: var(--wp--preset--color--teal-text); text-decoration: underline; }
.sonar-row-main .wp-block-post-excerpt p { margin: 0; color: var(--wp--preset--color--secondary); max-width: 70ch; }
.sonar-row-more { align-self: center; white-space: nowrap; }
@media (max-width: 781px) {
	.sonar-masthead-row { row-gap: 1.5rem; }
	.sonar-row { grid-template-columns: 1fr; row-gap: 0.4rem; }
	.sonar-row-date { margin: 0; }
	.sonar-row-more { display: none; }
	.sonar-featured { padding: 1.5rem !important; }
	.sonar-featured-excerpt { font-size: var(--wp--preset--font-size--base); }
}

/* Single post */
.sonar-back { margin: 0 0 1.5rem; }
.sonar-back a {
	font-family: var(--wp--preset--font-family--label);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--teal-text);
	text-decoration: none;
}
.sonar-back a:hover { text-decoration: underline; }
.sonar-post-title { font-size: clamp(2.25rem, 4.6vw, 3.5rem) !important; line-height: 1.06; letter-spacing: -0.025em; margin: 0 0 1.5rem; }
.sonar-post-meta { gap: 0.6rem; color: var(--wp--preset--color--secondary); font-size: var(--wp--preset--font-size--small); }
.sonar-post-meta p, .sonar-post-meta .wp-block-post-date, .sonar-post-meta .wp-block-post-author-name { margin: 0; }
.sonar-post-meta .wp-block-post-author-name a { color: var(--wp--preset--color--main); font-weight: 600; text-decoration: none; }
.sonar-post-meta .wp-block-avatar img { border-radius: 50%; display: block; }
.sonar-meta-dot { color: var(--wp--preset--color--border-dark); }
.sonar-post-image { margin: 0; }
.sonar-post-image img { width: 100%; display: block; object-fit: cover; }
.sonar-post-columns { column-gap: clamp(2rem, 6vw, 5rem); margin-bottom: 0; }
.sonar-post-body { font-size: 1.125rem; line-height: 1.7; }
.sonar-post-body > * { max-width: 70ch; }
.sonar-post-body h2 { margin-top: var(--wp--preset--spacing--large); line-height: 1.2; }
.sonar-post-body h3 { margin-top: var(--wp--preset--spacing--medium); }
.sonar-post-body img { max-width: 100%; height: auto; }
.sonar-post-aside {
	position: sticky;
	top: 2rem;
	border-top: 3px solid var(--wp--preset--color--teal);
	padding-top: 1.25rem;
}
.sonar-post-aside p { margin: 0 0 1rem; }
@media (max-width: 781px) {
	.sonar-post-columns > .wp-block-column:last-child { display: none; }
}

/* Calls to action inside posts */
.sonar-inline-cta-title {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	line-height: 1.25;
	margin: 0 0 0.5rem;
}
.sonar-inline-cta {
	background: var(--wp--preset--color--band-form);
	border-left: 4px solid var(--wp--preset--color--teal);
	margin-top: var(--wp--preset--spacing--medium) !important;
	margin-bottom: var(--wp--preset--spacing--medium) !important;
}
.sonar-inline-cta p { margin: 0 0 1rem; }
.sonar-inline-cta .wp-block-buttons { margin: 0; }
.sonar-post-cta { scroll-margin-top: 1rem; }

/* Results page masthead: call to action on the right */
.sonar-masthead-cta { border-top: 3px solid var(--wp--preset--color--teal); padding-top: 1rem; }
.sonar-masthead-cta .wp-block-buttons { margin: 0; }
@media (min-width: 782px) { .sonar-masthead-cta { max-width: 20rem; margin-left: auto; } }
.post-type-archive-case_study .wp-block-post-template { margin-top: var(--wp--preset--spacing--small); }
@media (max-width: 781px) { .sonar-masthead-row > .wp-block-column { align-self: stretch !important; } }

/* ==========================================================================
   Lead paragraph (block style), homepage v2
   ========================================================================== */
p.is-style-lead {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 400;
	line-height: 1.35;
}

/* Hero: headline runs wide, lead stays readable */
.sonar-home-hero h1 { max-width: none; }
.sonar-home-hero .is-style-lead { max-width: 52ch; }

/* Centered intro */
.sonar-intro-center { text-align: center; }
.sonar-intro-center > * { max-width: 940px; margin-left: auto !important; margin-right: auto !important; }
.sonar-intro-center p.is-style-eyebrow::before { margin-left: auto; margin-right: auto; }
.sonar-intro-center p { font-size: 1.125rem; line-height: 1.7; }
.sonar-intro-center p:last-child { margin-top: var(--wp--preset--spacing--medium); font-size: var(--wp--preset--font-size--medium); line-height: 1.45; }

/* How we work: channels as a quiet list, the new offering as a feature */
.sonar-channels { border-top: 1px solid #EADFD6; }
.sonar-channel { border-bottom: 1px solid #EADFD6; padding: 1rem 0; }
.sonar-channel h3 { margin: 0 0 0.25rem; }
.sonar-channel h3 a { color: var(--wp--preset--color--main); text-decoration: none; }
.sonar-channel h3 a:hover { color: var(--wp--preset--color--teal-text); text-decoration: underline; }
.sonar-channel p { margin: 0; color: var(--wp--preset--color--secondary); }
.sonar-new-row { column-gap: clamp(2rem, 5vw, 4rem); margin-bottom: 0; align-items: flex-start; }
.sonar-new h3 { margin-top: 0.5rem; line-height: 1.15; }
.sonar-new p:not(.is-style-eyebrow) { margin-top: 0; }
.sonar-new :focus-visible { outline-color: var(--wp--preset--color--aqua); }

/* Working with us: four steps */
.sonar-section-lead { max-width: 60ch; margin-bottom: var(--wp--preset--spacing--medium); }
.sonar-steps { column-gap: clamp(1.5rem, 3vw, 2.5rem); row-gap: var(--wp--preset--spacing--medium); }
@media (min-width: 1000px) { .wp-block-group.sonar-steps { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; } }
@media (min-width: 600px) and (max-width: 999px) { .wp-block-group.sonar-steps { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }

/* Footer: brand column wide enough for the email address */
.sonar-footer-grid { column-gap: clamp(1.5rem, 4vw, 3rem); }
@media (min-width: 1000px) {
	.wp-block-group.sonar-footer-grid { grid-template-columns: minmax(17rem, 1.3fr) repeat(3, minmax(0, 1fr)) !important; }
}
@media (min-width: 600px) and (max-width: 999px) {
	.wp-block-group.sonar-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
.sonar-footer a[href^="mailto:"] { overflow-wrap: anywhere; }

/* Case study images: wide band under the hero, and one beside each story section */
.sonar-cs-feature { margin: 0; }
.sonar-cs-feature img { display: block; width: 100%; height: auto; max-height: 640px; object-fit: cover; border: 1px solid var(--wp--preset--color--border-light); }
.sonar-cs-image { margin: var(--wp--preset--spacing--medium) 0 0; }
.sonar-cs-image img { display: block; width: 100%; height: auto; border: 1px solid var(--wp--preset--color--border-light); }
.sonar-cs-split { column-gap: clamp(2rem, 6vw, 5rem); }

/* 0.9.4: nav and Contact always sit far right, with or without a logo */
.sonar-header-row > .sonar-header-right { margin-left: auto; }
.sonar-footer-address { font-style: normal; }

/* SEO sub-page (short service page, 10/19) */
.sonar-parent-link a { color: var(--wp--preset--color--aqua); text-decoration: none; }
.sonar-parent-link a::before { content: "\2190\00a0"; }
.sonar-parent-link a:hover { text-decoration: underline; }
.sonar-included { border-top: 3px solid var(--wp--preset--color--teal); }
.sonar-included h3 { margin-top: 0; }
.sonar-included .sonar-checklist { margin-bottom: 1.5rem; }
.sonar-steps-3 { column-gap: clamp(1.5rem, 4vw, 3rem); row-gap: var(--wp--preset--spacing--medium); }
@media (min-width: 782px) { .wp-block-group.sonar-steps-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
.has-band-warm-background-color .sonar-steps-3 .sonar-item { border-top-color: #EADFD6; }
.sonar-more-services { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 2rem; row-gap: 0.75rem; }
.sonar-more-services p.is-style-eyebrow { margin: 0; }
.sonar-more-services p.is-style-eyebrow::before { display: none; }
.sonar-service-links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; column-gap: 1.75rem; row-gap: 0.5rem; }
.sonar-service-links a { color: var(--wp--preset--color--main); font-weight: 500; text-decoration: none; border-bottom: 1px solid var(--wp--preset--color--teal); }
.sonar-service-links a:hover { color: var(--wp--preset--color--teal-text); }
.sonar-service-links a[aria-current="page"] { border-bottom-width: 2px; }