/* Desktop vs Figma fixes: Shop (post 35), frame 4:4 "Sales Page – Webinar/Products"
   at its 1512px artboard. Every rule sits in min-width:1025px, the range mobile-nav.js scales
   proportionally from the 1512 artboard, so neither the mobile pass
   (mobile-pages/shop.css) nor the unscaled 768-1024 tablet range changes. Numbers are Figma node y/x/w/h; gaps are
   start-to-start distances in the frame (text box heights in the spec overflow). */

@media (min-width: 1025px) {

	/* ── Header ─────────────────────────────────────────────────────────────
	   On this light pink hero Figma strokes the nav cells and the bar's bottom
	   rule in #462222 (Rectangles 88-94, Line 52); the build drew them cream,
	   which all but vanished on the pink. */
	body.page-id-35 .sh-nav {
		border-bottom-color: #462222 !important;
	}
	body.page-id-35 .sh-nav > .e-flexbox-base,
	body.page-id-35 .sh-nav-links > .e-flexbox-base {
		border-color: #462222 !important;
	}

	/* Buttons (51px, 4px radius, inset shadow) are site-wide in custom.css;
	   only page-specific widths are set below. */

	/* ── Hero: stag #3B1919 at y=144, eyebrow 263, h1 315 in a 677px measure
	   (two lines: "1:1 SEO consulting / call with Crystal"), copy 467 in 609px,
	   CTA 596, pink ends 835. */
	body.page-id-35 .elementor-element-e55108b {
		padding: 73px 40px 188px !important;
	}
	body.page-id-35 .elementor-element-e55108b > img.e-c8f5229-85f0d6 {
		content: url('../../img/shop-deer-dark.png');
		filter: none !important;
	}
	body.page-id-35 .elementor .e-b111cf2-4e2f58 {
		max-width: 677px !important;
		margin-top: 34px !important;
	}
	body.page-id-35 .elementor .e-65adc4b-f11713 {
		max-width: 609px !important;
	}

	/* ── "Do you show up on Google": copy 46px under the h2, CTA 51px under
	   the copy, tan band at 1612. */
	body.page-id-35 .elementor .e-1031d91-2cd0ab {
		margin-top: 46px !important;
	}
	body.page-id-35 .elementor .e-ee58a80-d2a110 {
		margin-top: 51px !important;
	}
	body.page-id-35 .elementor-element-a4567ef {
		padding-bottom: 119px !important;
	}

	/* ── "This sounds like you": script at 1705, h2 25px under it, cards from
	   2023 (row pitch unchanged), cream CTA 81px under the last row, band ends
	   3026. Card copy is inset 19px left / 31px top (Figma text at x=257 in a
	   box at 238). */
	body.page-id-35 .elementor-element-81c16f3 {
		padding: 93px 49px 97px !important;
	}
	/* The container adds a 5px gap, so the stock 20px margin already lands the
	   h2 75px under the script, exactly as in the frame. */
	body.page-id-35 .elementor-element-f2a9045 > .e-flexbox-base > .e-flexbox-base {
		padding: 31px 22px 36px 19px !important;
	}
	body.page-id-35 .elementor .e-82a7329-e6568b {
		margin-top: 81px !important;
		background-color: #EAE4D8 !important;
		color: #462222 !important;
	}

	/* ── "Bubbly: SEO Power Hours": h2 163px into the section; paragraphs 24px
	   apart, the last two in an 810px measure (two lines each); dark CTA 77px
	   under them; olive band at 4008. */
	body.page-id-35 .elementor-element-c9157fe {
		padding: 163px 40px 190px !important;
	}
	body.page-id-35 .elementor-element-e622afa > .e-paragraph-base + .e-paragraph-base {
		margin-top: 24px !important;
	}
	body.page-id-35 .elementor .e-43a93c2-cd6a02,
	body.page-id-35 .elementor .e-5f04542-faecaa {
		max-width: 810px !important;
		width: 810px !important;
	}
	body.page-id-35 .elementor .e-7f00a28-db1023 {
		margin-top: 77px !important;
	}

	/* ── "Pick your Focus": script 4083 (75px in), h2 25px under, note 45px
	   under the h2, a DOUBLE full-bleed rule at 4436/4463, rows with the body
	   copy 12px above the heading, rules full-bleed at 4685/4931/5165/5411,
	   cream CTA 72px under the last rule, band ends 5611. */
	body.page-id-35 .elementor-element-52e2c11 {
		padding: 75px 49px 77px !important;
	}
	body.page-id-35 .elementor .e-5e8cc75-bca5a3 {
		margin-top: 25px !important;
	}
	body.page-id-35 .elementor .e-1128d50-7abcf9 {
		margin-top: 45px !important;
	}
	body.page-id-35 .elementor-element-3e2aaf9 {
		margin-top: 93px !important;
	}
	body.page-id-35 .elementor-element-3e2aaf9 > .e-div-block-base {
		width: calc(100% + 98px) !important;
		max-width: none !important;
		margin-left: -49px !important;
		margin-right: -49px !important;
		background-color: #EAE4D8 !important;
	}
	body.page-id-35 .elementor-element-3e2aaf9 > .elementor-element-c7d680a.e-div-block-base {
		height: 28px !important;
		background-color: transparent !important;
		background:
			linear-gradient(#EAE4D8, #EAE4D8) top / 100% 1px no-repeat,
			linear-gradient(#EAE4D8, #EAE4D8) bottom / 100% 1px no-repeat !important;
	}
	body.page-id-35 .elementor-element-4c2598c { padding: 38px 0 51px !important; }
	body.page-id-35 .elementor-element-249c1f1 { padding: 62px 0 51px !important; }
	body.page-id-35 .elementor-element-210fcef { padding: 50px 0 51px !important; }
	body.page-id-35 .elementor-element-7dfacbf { padding: 62px 0 51px !important; }
	body.page-id-35 .elementor-element-3e2aaf9 > .e-flexbox-base > .e-heading-base {
		margin-top: 12px !important;
	}
	body.page-id-35 .elementor-element-3e2aaf9 > .e-flexbox-base > .e-paragraph-base {
		margin-right: -6px !important;
	}
	body.page-id-35 .elementor .e-8b20d69-b6c018 {
		margin-top: 72px !important;
	}

	/* ── Results: eyebrow 5772 (161 in), h2 38px under, stat headings at 6246
	   with their copy 29px under (the hover reveal from custom.css is kept; the
	   geometry matches the revealed state, which is what the frame draws),
	   navy CTA 96px under, fresco band at 6721. Stat 3's heading runs a 456px
	   measure, 1 and 2 a 362px one. */
	body.page-id-35 .elementor-element-687be55 {
		padding: 161px 49px 139px !important;
	}
	body.page-id-35 .elementor .e-1057903-13867a {
		margin-top: 38px !important;
	}
	/* The stats are About's flip cards (client feedback 2026-10-11): the card
	   rules live in desktop-pages/about.css, which includes this grid. Only
	   the gap under the heading is set here. */
	body.page-id-35 .sh-stat-grid {
		margin-top: 148px !important;
	}
	body.page-id-35 .elementor .e-5f80ac2-3364b2 {
		margin: 96px 16px 0 0 !important;
	}

	/* ── Fresco band ("An hour of dedicated decision making"): 778px, the row
	   centred on y=7110 (389px in), heading at x=49 (490px), copy at x=671,
	   201px CTA ending at x=1466. */
	body.page-id-35 .elementor-element-829e0af {
		padding-top: 293px !important;
	}
	/* The frame's fresco is much darker than the photo (mean luma 58 vs 108,
	   measured outside the text row): a 46% black scrim reproduces it. The
	   existing custom.css scrim sat UNDER the band's images (all children are
	   z-index 1), so it never showed; this one is raised above them. */
	body.page-id-35 .elementor-element-829e0af::before {
		background: rgba(0, 0, 0, 0.46) !important;
		z-index: 2 !important;
	}
	body.page-id-35 .elementor-element-9a73541 {
		z-index: 3 !important;
		justify-content: flex-start !important;
		padding: 60px 46px 60px 49px !important;
	}
	body.page-id-35 .elementor .e-784aa06-e988e6 {
		flex: 0 0 490px !important;
		width: 490px !important;
		max-width: none !important;
	}
	body.page-id-35 .elementor .e-8957337-4a212c {
		margin-left: 132px !important;
	}
	body.page-id-35 .elementor .e-4c45634-0c5b82 {
		margin-left: auto !important;
		min-width: 201px !important;
		width: 201px !important;
		padding: 0 10px !important;
		white-space: nowrap !important;
	}
	/* Wider than the 1512 design the heading stayed at the left edge and the
	   button ran off to the right one (client feedback 2026-10-11, as for
	   About's mission band). The row is held to the 1512 design and centred;
	   the fresco still fills the band. */
	@media (min-width: 1513px) {
		body.page-id-35 .elementor-element-9a73541 {
			box-sizing: border-box !important;
			width: 100% !important;
			max-width: 1512px !important;
			margin-inline: auto !important;
		}
		/* The band stayed 778px tall as it widened, so the cover-fit fresco
		   was zoomed in and its top and bottom cut off (client feedback
		   2026-10-11). It now keeps the 1512x778 design proportions, showing
		   the same framing as at 1512, with the row centred in it as there
		   (293px down a 778px band holding a 192px row). */
		body.page-id-35 .elementor-element-829e0af {
			aspect-ratio: 1512 / 778;
			min-height: 0 !important;
			height: auto !important;
			padding-top: 0 !important;
			justify-content: center !important;
		}
	}
	/* With the band growing, the 1512-size heading, copy and button looked
	   lost on large screens. The row is scaled with it in steps (zoom =
	   step / 1512, the step's lower edge, so the zoomed 1512 row never
	   overflows), keeping the band the 1512 design enlarged. */
	@media (min-width: 1700px) { body.page-id-35 .elementor-element-9a73541 { zoom: 1.124; } }
	@media (min-width: 1920px) { body.page-id-35 .elementor-element-9a73541 { zoom: 1.27; } }
	@media (min-width: 2200px) { body.page-id-35 .elementor-element-9a73541 { zoom: 1.455; } }
	@media (min-width: 2560px) { body.page-id-35 .elementor-element-9a73541 { zoom: 1.693; } }
	@media (min-width: 3000px) { body.page-id-35 .elementor-element-9a73541 { zoom: 1.984; } }
	@media (min-width: 3440px) { body.page-id-35 .elementor-element-9a73541 { zoom: 2.275; } }
	@media (min-width: 3840px) { body.page-id-35 .elementor-element-9a73541 { zoom: 2.54; } }

	/* ── Testimonials: cards 66px under the fresco, pink at 8195. */
	body.page-id-35 .elementor-element-be691fd {
		padding: 66px 0 94px !important;
	}

	/* ── "With …, You'll": h2 117px in, note 38px under a two-line h2, list
	   106px under the note in a grid starting x=311 (Figma sits 11px left of
	   centre), body copy 25px under each heading; olive at 9241. The pink tag
	   is 274x283 at x=1030, 85px above the olive. */
	body.page-id-35 .elementor-element-087285e {
		padding: 117px 10px 209px !important;
	}
	body.page-id-35 .elementor .e-330fdff-f21605 {
		margin-top: 38px !important;
	}
	body.page-id-35 .elementor-element-caf0953 {
		margin: 106px 324px 0 301px !important;
		row-gap: 0 !important;
	}
	body.page-id-35 .elementor-element-caf0953 > .e-flexbox-base > .e-flexbox-base > .e-paragraph-base {
		margin-top: 25px !important;
	}
	body.page-id-35 .elementor .e-e38ef9e-cd3cfb {
		inset-block-start: auto !important;
		top: auto !important;
		bottom: -198px !important;
		/* x=1030 on the 1512 artboard = 274px right of centre, kept relative to
		   centre so it holds its place on screens wider than the artboard. */
		inset-inline-start: calc(50% + 274px) !important;
		left: calc(50% + 274px) !important;
		width: 274px !important;
		height: 283px !important;
		z-index: 5 !important;
	}

	/* ── Content coal: cream stag 110px into the olive (x=712), h2 27px under,
	   copy 39px under (x=430), 238px CTA (x=628), olive ends 9939. The page-wide
	   light-hero filter in custom.css had turned this cream stag near-black. */
	body.page-id-35 .elementor-element-9f46bb0 {
		padding-top: 0 !important;
	}
	body.page-id-35 .elementor-element-ff53432 {
		padding: 110px 40px 160px !important;
	}
	body.page-id-35 .elementor .e-ef1c59a-7220aa {
		filter: none !important;
		margin-right: 22px !important;
	}
	body.page-id-35 .elementor .e-a21e4e2-d3b648 {
		margin-right: 20px !important;
	}
	/* Figma insets the label 20px (text x=648 in a box at 628); the stock 22px
	   padding wrapped "Show me service details" onto two lines at 238px. */
	body.page-id-35 .elementor .e-611425f-41f585 {
		min-width: 238px !important;
		width: 238px !important;
		padding-inline: 20px !important;
		white-space: nowrap !important;
		margin-right: 18px !important;
	}

	/* ── Newsletter: 263px pink band; h2 at x=37 (58 in); two 339x55 outlined
	   fields 13px apart starting 71px in at x=764/1116, 20px Source Serif
	   placeholders; 281x51 button 17px under, left-aligned. */
	body.page-id-35 .elementor-element-af4adff {
		height: auto !important;
	}
	body.page-id-35 .elementor-element-b62e003 {
		align-items: flex-start !important;
		justify-content: flex-start !important;
		padding: 58px 57px 69px 37px !important;
	}
	body.page-id-35 .elementor .e-976a214-563afe {
		flex: 0 0 524px !important;
	}
	body.page-id-35 .elementor-element-87a1a57 {
		flex: 0 0 691px !important;
		width: 691px !important;
		margin: 13px 0 0 auto !important;
	}
	body.page-id-35 .elementor-element-af4adff .elementor-form-fields-wrapper {
		margin: 0 !important;
		column-gap: 13px !important;
		row-gap: 0 !important;
	}
	body.page-id-35 .elementor-element-af4adff .elementor-field-group {
		padding: 0 !important;
		margin: 0 !important;
	}
	body.page-id-35 .elementor-element-af4adff .elementor-field-group:not(.e-form__buttons) {
		flex: 0 0 339px !important;
		width: 339px !important;
		max-width: 339px !important;
	}
	body.page-id-35 .elementor-element-af4adff .elementor-field-group.e-form__buttons {
		flex: 0 0 100% !important;
		width: 100% !important;
		max-width: 100% !important;
		margin-top: 17px !important;
		justify-content: flex-start !important;
	}
	body.page-id-35 .elementor-element-af4adff input.elementor-field-textual {
		height: 55px !important;
		min-height: 55px !important;
		padding: 0 19px !important;
		border: 1px solid #3B1919 !important;
		border-radius: 0 !important;
		background: transparent !important;
		font-family: 'Source Serif Pro', Georgia, serif !important;
		font-size: 20px !important;
		letter-spacing: -0.6px !important;
		color: #3B1919 !important;
	}
	body.page-id-35 .elementor-element-af4adff input.elementor-field-textual::placeholder {
		color: #3B1919 !important;
		opacity: 1 !important;
	}
	body.page-id-35 .elementor-element-af4adff .e-form__buttons .elementor-button {
		flex: 0 0 281px !important;
		width: 281px !important;
		min-width: 281px !important;
		padding-inline: 20px !important;
		white-space: nowrap !important;
	}

	/* ── Footer: blurb at x=37, NAVIGATION column at x=1133 (links 4px in),
	   CONNECT at x=1348; the wordmark 1413px wide from x=41; legal bar 89px
	   with its links 18px down at x=37 / 167 / 1364. */
	body.page-id-35 .elementor-element-26af3de {
		padding: 38px 47px 0 37px !important;
	}
	body.page-id-35 .elementor-element-7f0252f {
		flex: 0 0 332px !important;
		width: 332px !important;
		gap: 0 !important;
	}
	body.page-id-35 .elementor-element-5cb8ec9 {
		flex: 0 0 215px !important;
		width: 215px !important;
	}
	body.page-id-35 .elementor-element-db40cf5 {
		flex: 0 0 117px !important;
		width: 117px !important;
	}
	body.page-id-35 .elementor-element-5cb8ec9 > p:not(:first-child) {
		padding-left: 4px !important;
	}
	body.page-id-35 .elementor-element-2a06f6e {
		padding-top: 257px !important;
		padding-bottom: 25px !important;
	}
	body.page-id-35 .elementor .e-1ebb5ac-b53969 {
		width: 1413px !important;
		max-width: none !important;
		height: 186px !important;
		margin: 0 17px 0 0 !important;
	}
	body.page-id-35 .elementor-element-b5ddb34 {
		padding: 18px 60px 53px 37px !important;
		align-items: flex-start !important;
	}
	body.page-id-35 .elementor-element-1953379 {
		column-gap: 12px !important;
	}
	body.page-id-35 .elementor-element-b5ddb34 a {
		min-height: 0 !important;
		height: 18px !important;
		line-height: 18px !important;
	}
}

/* ── Visual QA 2026-10-04: Bubbly (post 35), desktop ────────────────────────
   "Pick your focus" rows: the client's colour panels (custom.css, QA #21)
   came after the paddings above, which zero the side padding. The copy then
   sat flush against the panel's left edge and ran 6px past its right edge,
   while the hairlines between rows ran edge to edge. Run the panels edge to
   edge like the hairlines; the copy keeps its Figma x positions (49 / 868). */
@media (min-width: 1025px) {
	body.page-id-35 .elementor-element-3e2aaf9 > .e-flexbox-base {
		width: calc(100% + 98px) !important;
		max-width: none !important;
		margin-left: -49px !important;
		margin-right: -49px !important;
		padding-left: 49px !important;
		padding-right: 49px !important;
		box-sizing: border-box !important;
	}
}

/* ── Visual QA 2026-10-04: Bubbly (post 35), tablet ─────────────────────────
   Three things the desktop block fixes above 1024px were still wrong here. */
@media (min-width: 768px) and (max-width: 1024px) {
	/* Nav rules were cream on the pink hero. */
	body.page-id-35 .sh-nav {
		border-bottom-color: #462222 !important;
	}
	body.page-id-35 .sh-nav > .e-flexbox-base,
	body.page-id-35 .sh-nav-links > .e-flexbox-base {
		border-color: #462222 !important;
	}
	/* Fresco band: cream heading and copy washed out on the bright painting. */
	body.page-id-35 .elementor-element-829e0af::before {
		background: rgba(0, 0, 0, 0.42) !important;
		z-index: 2 !important;
	}
	body.page-id-35 .elementor-element-9a73541 {
		z-index: 3 !important;
	}
	/* Coal band stag: the page-wide light-hero filter turned it near-black on
	   the olive band; it is cream in the design. */
	body.page-id-35 .elementor-element-ff53432 > img.e-image-base[src*="deer"] {
		filter: none !important;
	}
}

/* ── Visual QA 2026-10-04: new Shop page (post 4187), tablet and desktop ────
   The page uses the default page template: theme header 196 over the parent
   theme's white ground, plus the parent theme's page title. The cream header
   was all but invisible and "Shop" showed in a system sans on a white band. */
@media (min-width: 768px) {
	body.page-id-4187 {
		background-color: #EAE4D8 !important;
	}
	/* Kept for assistive tech and search engines, hidden visually. */
	body.page-id-4187 .page-header {
		position: absolute !important;
		width: 1px !important;
		height: 1px !important;
		margin: -1px !important;
		padding: 0 !important;
		overflow: hidden !important;
		clip: rect(0, 0, 0, 0) !important;
		white-space: nowrap !important;
		border: 0 !important;
	}
	/* (The dark menu for Shop's light top was removed 2026-10-12: Shop now
	   opens on the dark sign-up hero, so the menu keeps its cream default.) */
}
@media (min-width: 768px) and (max-width: 1024px) {
	/* Service rows: the name ran straight into its description. */
	body.page-id-4187 .elementor-element-0c9b4b4 > .e-flexbox-base {
		column-gap: 24px !important;
	}
}

/* Visual QA 2026-10-04: Shop (post 4187). The intro's last line sat directly
   on the first service row with no rule above it. Same opening as the
   homepage module: air under the intro, then a rule above the first row. */
@media (min-width: 768px) {
	body.page-id-4187 .elementor-element-8890028 {
		padding-bottom: 110px !important;
	}
	body.page-id-4187 .elementor-element-0c9b4b4 {
		border-top: 1px solid #3B1919 !important;
	}
}
