/* Salvagente base layer — tokens beyond theme.json, from the design handoff (S:n = Salvagente Site.dc.html line). */

:root {
	--pg: 40px; /* page gutter (S:41) */
	--sv-stroke-hair: rgba(12, 26, 42, .08);    /* --stroke-hair (docs/design/tokens.json) */
	--sv-stroke-glass: rgba(255, 255, 255, .85); /* --stroke-glass */
}
@media (max-width: 1100px) { :root { --pg: 28px; } } /* S:43 */
@media (max-width: 720px)  { :root { --pg: 18px; } } /* S:53 */
@media (max-width: 480px)  { :root { --pg: 16px; } } /* S:126 */

body {
	background-color: #cfe7ef;
	background-image: var(--wp--preset--gradient--page); /* S:131 */
}

.sv-label {
	text-transform: uppercase;
	letter-spacing: .14em;
}
.sv-label b {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
}

.sv-mono {
	font-family: var(--wp--preset--font-family--mono);
	font-weight: 500;
}

.sv-glass {
	background: rgba(255, 255, 255, .42);
	-webkit-backdrop-filter: blur(16px) saturate(140%);
	backdrop-filter: blur(16px) saturate(140%);
	border: 1px solid rgba(255, 255, 255, .85);
	border-radius: 20px;
}

:focus-visible {
	outline: 2px solid var(--wp--preset--color--ink);
	outline-offset: 2px;
}
:where(.sv-dark, .has-black-background-color, .has-ink-background-color) :focus-visible {
	outline-color: var(--wp--preset--color--primary);
}
/* Post titles in a list (the interim /za/ index until the 5b Home): a 44px target on mobile (§4). */
@media (max-width: 720px) { .wp-block-post-title a { display: inline-flex; align-items: center; min-height: 44px; } }

/* Molecular texture (S:133, S:3814-3828): tex-mol-a and -b repeated behind the page, faded in by a mask in page
   coordinates, Home 1180-1560 px and elsewhere 260-640 px. Pure CSS (Ana A3, D32: the scroll fade ships; the
   prototype's JS opacity toggle is removed, exit F8). The hero's opaque black covers it while the hero is on screen. */
body { position: relative; }
body::before {
	--sv-tex-from: 260px;
	--sv-tex-to: 640px;
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background-image: url(../img/tex-mol-a.png), url(../img/tex-mol-b.png);
	background-repeat: repeat;
	-webkit-mask-image: linear-gradient(180deg, transparent var(--sv-tex-from), #000 var(--sv-tex-to));
	mask-image: linear-gradient(180deg, transparent var(--sv-tex-from), #000 var(--sv-tex-to));
}
body:is(.home, .page-template-market-home)::before { --sv-tex-from: 1180px; --sv-tex-to: 1560px; }

/* Read by assistive technology, not drawn. */
.sv-visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* The visible new-tab mark (↗) after a link that opens a new tab; its words are in a .sv-visually-hidden span (Ana exit F4). */
.sv-ext { margin-left: .4em; letter-spacing: 0; }
