/* ==========================================================================
   Tehila's re-check of 25.10 (theme 3.10.34). Every page. Loaded last.
   ========================================================================== */

/* ── Item 22: on phones the cookie card was 224px, a quarter of the screen ──
   Now one compact card: the message, then the three actions on ONE row. The
   title stays in the markup (the region is labelled by it) but is visually
   hidden on phones; the icon badge goes. About 130px instead of 224px. */
@media (max-width: 639.98px) {
	#sg-cookies.sg-cookies--card .sg-cookies__card {
		display: grid;
		grid-template-columns: 1fr 1fr auto;
		gap: 8px;
		align-items: center;
		padding: 10px 12px !important;
		border-radius: 14px;
	}
	#sg-cookies .sg-cookies__head {
		position: absolute !important;
		inline-size: 1px; block-size: 1px;
		overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%);
		white-space: nowrap;
	}
	#sg-cookies .sg-cookies__card .sg-cookies__message {
		grid-column: 1 / -1;
		margin: 0 !important;
		font-size: 12.5px !important;
		line-height: 1.45 !important;
	}
	#sg-cookies .sg-cookies__actions { display: contents; }
	#sg-cookies .sg-cookies__card .sg-cookies__btn {
		min-block-size: 38px !important;
		margin: 0 !important;
		padding: 6px 10px !important;
		inline-size: 100%;
		font-size: 13px !important;
	}
	#sg-cookies .sg-cookies__card .sg-cookies__settings {
		margin: 0 !important;
		padding: 6px 4px;
		min-block-size: 38px;
		font-size: 12.5px;
		gap: 4px;
	}
	#sg-cookies .sg-cookies__card .sg-cookies__settings .sg-cookies__icon { inline-size: 16px; block-size: 16px; }
	/* the drag-handle bar some skins draw on top of the card */
	#sg-cookies .sg-cookies__card::before { display: none !important; }
}

/* ── Item 22: the accessibility button smaller on phones ───────────────────
   36px on screen (was 44px). The touch target stays 44px through an invisible
   ring around it, so it is no harder to tap. Desktop keeps 44px. */
@media (max-width: 899.98px) {
	html #sg-a11y.sg-a11y { --sga-size: 36px !important; }
	/* widget.css floors the toggle at 44px whatever the setting; the ring below keeps the 44px target */
	html #sg-a11y .sg-a11y__toggle { position: relative; min-inline-size: 0 !important; min-block-size: 0 !important; border-width: 2px !important; }
	html #sg-a11y .sg-a11y__toggle::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; }
	html #sg-a11y .sg-a11y__toggle svg { inline-size: 19px; block-size: 19px; }
}

/* ── Item 22: footer social icons in their own brand colours (same discs as the rail) ── */
.sg-footer__social a.sg-brand-ico,
.sg-footer__social a.sg-brand-ico:hover {
	inline-size: 36px; block-size: 36px;
	padding: 0; border: 0; border-radius: 50%;
	background: transparent !important;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .18);
	transition: transform .2s ease;
}
.sg-footer__social a.sg-brand-ico:hover { transform: scale(1.08); }
.sg-footer__social a.sg-brand-ico svg { inline-size: 100%; block-size: 100%; stroke: none !important; fill: initial !important; color: inherit !important; }

/* ── Item 13: the logo mark without the baked-in dark drop shadow ──────────
   logo-mark.png is now the client's own mark with only the shadow pixels
   removed (the letters untouched). A faint neutral shadow keeps the silver
   legible on the light band photo; it is not the old dark smear. */
.sg-topband .sg-topband__logo.sg-topband__mark,
.sg-logo__mark { filter: drop-shadow(0 1px 1.5px rgba(0, 0, 0, .28)); }

/* ── Item 13: logo + tagline read as one silver unit on the home band ─────────
   The tagline takes the logo letters' metal (inc/tagline.php default stops) and
   the SAME soft shadow as the mark; its dark glow halo goes. Silver on the light
   beige band measured 1.9-2.5:1, so a soft dark radial shade sits behind the
   logo block (no box edge, it fades to nothing) to bring the tagline over 4.5:1.
   The letters themselves are not darkened. */
.sg-topband .sg-tl__glow { display: none !important; }
.sg-topband .sg-tl__word { filter: drop-shadow(0 1px 1.5px rgba(0, 0, 0, .28)); }
.sg-topband__brand,
.sg-topband .sg-topband__tag.sg-tl { position: relative !important; isolation: isolate; }
.sg-topband__brand::before,
.sg-topband .sg-topband__tag.sg-tl::before {
	content: "";
	position: absolute;
	z-index: -1;
	pointer-events: none;
	border-radius: 50%;
}
.sg-topband__brand::before {
	inset: -12% -40% -30%;
	background: radial-gradient(closest-side, rgba(16, 13, 10, .40) 0%, rgba(16, 13, 10, .30) 50%, rgba(16, 13, 10, .12) 80%, rgba(16, 13, 10, 0) 100%);
}
/* Wide and tall so its edge is never seen: it fades into the logo's shade above it. */
.sg-topband .sg-topband__tag.sg-tl::before {
	inset: -150% -22%;
	background: radial-gradient(closest-side, rgba(16, 13, 10, .58) 0%, rgba(16, 13, 10, .5) 38%, rgba(16, 13, 10, .26) 68%, rgba(16, 13, 10, .08) 88%, rgba(16, 13, 10, 0) 100%);
}

/* ── Testimonials page (client report 25.10): the reviews on the first screen ── */
.sg-page--testimonials .sg-testim-gallery { padding-block: 20px 48px; }
.sg-page--testimonials .sg-testim-gallery__head { margin-block-end: 0; }
.sg-page--testimonials .sg-testim-gallery__head .sg-section__title { margin-block: 0 6px; font-size: clamp(1.4rem, 1.1rem + 1.4vw, 2.1rem); }
.sg-page--testimonials .sg-testim-gallery__head .sg-section__sub { margin: 0; }
.sg-testim-gallery__rating {
	display: inline-flex; align-items: center; gap: 8px;
	margin-block-start: 10px; padding: 6px 14px;
	border-radius: 999px; background: #fff; border: 1px solid rgba(34, 37, 43, .12);
	color: #22252b; font-weight: 700; font-size: .92rem; text-decoration: none;
}
.sg-testim-gallery__rating:hover, .sg-testim-gallery__rating:focus-visible { border-color: #8C6B26; }
.sg-testim-gallery__stars { color: #B98A1E; letter-spacing: 1px; }
.sg-page--testimonials .sg-testim-gallery__grid { margin-block-start: 16px; }
.sg-page--testimonials .sg-testim-gallery__img { inline-size: 100%; block-size: auto; aspect-ratio: 1 / 1; }

/* ── Hero tagline on phones: at least 16px from each screen edge (owner 25.10) ── */
@media (max-width: 699px) {
	.sg-topband .sg-topband__tag.sg-tl {
		max-inline-size: calc(100vw - 32px);
		font-size: clamp(14px, 4.5vw, 18px) !important;
		gap: 4px;
	}
}

/* ── Found 25.10 (production too): tablets 761-1279px squeezed the home sections ──
   b1-polish.css pads the containers with calc(84px - (100vw - 1280px) / 2), meant to
   keep an 84px gutter on wide screens. Below 1280px that term grows instead of
   shrinking: 340px a side at 768px, leaving an 88px column for the inspiration and
   business sections. Capped at 84px; identical from 1280px up. */
@media (min-width: 761px) {
	.sg-main .sg-container, .sg-footer .sg-container, .sg-hb {
		padding-inline: max(var(--space-5, 1.5rem), min(84px, calc(84px - (100vw - var(--container, 1280px)) / 2)));
	}
}

/* ── Item 13: the header's small tagline in the same SILVER as the logo (was gold).
   Same selector weight as rc31-brand.css, loaded after it. On the charcoal header
   the lightest stop is ~13:1 and the darkest ~8:1. */
.sg-header.sg-header.sg-header .sg-header__main .sg-logo .sg-logo__tl {
	background: linear-gradient(180deg, #F3F3F1, #C6C5C3 55%, #EAE9E7);
	-webkit-background-clip: text;
	background-clip: text;
}