/*
 * Base styles for maniac.agency (Hello's reset.css and theme.css are switched off in its settings).
 * Only what Elementor's controls cannot set. Low specificity (:where) so every Elementor control wins.
 * Colors only through kit globals (docs/SITE-PROFILE-MANIAC.md section 6).
 */

/* Text rendering as on the Framer site (it sets these on :root). */
:root {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* clip, not hidden: hidden breaks position: sticky. */
html {
	overflow-x: clip;
	/* Keyboard focus, the skip link and in-page links scroll a target clear of the fixed header (100px, 60px on
	   phones; profile section 5): Shift+Tab in Chromium left a control under the frosted bar. */
	scroll-padding-top: 100px;
}

@media (max-width: 809px) {
	html {
		scroll-padding-top: 60px;
	}
}

/* Scrolling jumps, as on the live site (D7, native scroll): Elementor's generated frontend CSS turns on
   `html { scroll-behavior: smooth }` under prefers-reduced-motion: no-preference; (0,1,0) beats its (0,0,1). */
:root {
	scroll-behavior: auto;
}

body {
	margin: 0;
}

/* Framer text has no paragraph or heading margins; spacing comes from container gaps. */
:where(p, h1, h2, h3, h4, h5, h6, figure, blockquote) {
	margin-block: 0;
}

/* Links take the color of the text around them and carry no underline (Framer's link style). */
:where(a) {
	color: inherit;
	text-decoration: none;
}

/* The office address (footer, /connect/; D64) is an <address>, which browsers draw in italics. */
:where(address) {
	font-style: normal;
}

:where(img, video) {
	max-width: 100%;
	height: auto;
}

/* WordPress's visually hidden text (the skip link, form labels). */
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.skip-link.screen-reader-text:focus {
	top: 10px;
	left: 10px;
	z-index: 100000;
	width: auto;
	height: auto;
	margin: 0;
	padding: 15px 30px;
	overflow: visible;
	clip: auto;
	white-space: normal;
	border-radius: 10px;
	background: var(--e-global-color-primary, #282828);
	color: var(--e-global-color-accent, #FFF8EF);
}

/* A visible keyboard focus ring everywhere (WCAG 2.4.7); widgets with their own ring override it. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

/* An Image widget's box is its picture. The img is inline-block with vertical-align: middle inside the body's 30px
   line, so a picture shorter than the line (the 20px header logo) sat 2px below its container's center. With no line
   box around it, the widget is exactly the picture's height (captions, unused on this site, keep a normal line). */
:where(.elementor-widget-image) {
	line-height: 0;
}

:where(.elementor-widget-image .widget-image-caption, .elementor-widget-image figcaption) {
	line-height: normal;
}

/* Long-form copy (the legal pages): a Text Editor with the CSS class maniac-prose (Advanced, CSS Classes). Framer's
   lists have no margins, the text 21px in and a bullet at the left edge: here the marker is the bullet and three
   spaces (20.67px in Inter Display 16.5, so the bullet starts where Framer's ::before does; the browser's disc made
   each item 0.5px taller in Firefox). Its links are the text's own Smoke with no underline (Tim 2026-10-25, q9, D66;
   Elementor's `.elementor a` already removes the underline): they no longer stand out from the text (WCAG 1.4.1),
   Tim's call; keyboard focus still draws the ring. */
:where(.maniac-prose) :where(ul) {
	margin: 0;
	padding-left: 21px;
	list-style-type: "\2022\20\20\20"; /* the bullet and three spaces */
}

/* A text whose links are underlined in the text's own color: the "Wander NGA" attribution (q12, D58), a Text Editor
   with the class maniac-link-underline. Two classes: Elementor's frontend sheet removes link underlines with
   `.elementor a` (0,1,1), loaded after this file. */
.maniac-link-underline.elementor-widget-text-editor a {
	text-decoration: underline;
}

/* The legal pages' section titles are real headings (h2 sections, h3 parts, h4 below that; WCAG 1.3.1) drawn as the
   bold lines Framer shows: the text's own size, line, tracking and features, one step bolder (900, as <strong>, D6),
   and the blank 30px line above each as its top margin (tools/site-build/docs/page_privacy_policy.headings()). */
.maniac-prose.elementor-widget-text-editor :is(h2, h3, h4) {
	margin: 30px 0 0;
	padding: 0;
	color: inherit;
	font-family: inherit;
	font-size: inherit;
	font-style: inherit;
	font-weight: bolder;
	line-height: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
	font-feature-settings: inherit;
}

/* Case study split copy (D12) that must break where Framer's hand split does: a Text Editor with the class
   maniac-cols-fill takes its row's min-height less the row's padding (the container's own --min-height and
   --padding-* variables, which the widget inherits: Framer's column-1 height plus the last paragraph's 30px) and fills
   column 1 to that height before column 2 starts. column-fill: auto needs a definite height (with an auto height
   Chromium put the whole text in column 1 and WebKit balanced). The last paragraph's margin becomes padding, so the
   columns end at Framer's column-1 height and the row keeps its height. Desktop only (one column from 1159 down). */
@media (min-width: 1160px) {
	.elementor .elementor-widget-text-editor.maniac-cols-fill {
		column-fill: auto;
		box-sizing: border-box;
		height: calc(var(--min-height, auto) - var(--padding-top, 0px) - var(--padding-bottom, 0px));
		padding-bottom: 30px;
	}

	.elementor .elementor-widget-text-editor.maniac-cols-fill p:last-child {
		margin-bottom: 0;
		margin-block-end: 0;
	}
}

/* A forced line break that only desktop and tablet keep (Framer breaks a few headings by hand there and lets the
   phone text wrap): <br class="maniac-br-tablet-up"> after a space. Hidden from 809px down (Elementor Mobile
   Landscape, Framer's phone layout). */
@media (max-width: 809px) {
	br.maniac-br-tablet-up {
		display: none;
	}
}

/* Work (child theme 1.0.11): a case study's services list ([maniac_work_services] in a Text Editor with the class
   maniac-plain-list) is a plain list: no bullets, no margins or indent, one service per 30px line, as the Icon List it
   replaced (D25). */
.elementor .elementor-widget-text-editor.maniac-plain-list ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.elementor .elementor-widget-text-editor.maniac-plain-list li {
	margin: 0;
	padding: 0;
}

/* "You may also be interested in" is a Loop Grid of three case studies with the class maniac-related-cards: from
   1159px down it shows the first two (Framer's tablet and phone layouts), as the third static card's responsive
   visibility did. nth-of-type: Pro may put a <style> element in the loop container. */
@media (max-width: 1159px) {
	.elementor-widget-loop-grid.maniac-related-cards .e-loop-item:nth-of-type(n+3) {
		display: none;
	}
}