/* PR & Influencer rebuild (October 2026). Scoped to .svc so nothing else on the site changes. */

/* Scales: type, spacing, grid. Adjust here, everything below follows. */
.svc {
	/* Colours (unchanged) */
	--svc-ink: #000;
	--svc-paper: #fff;
	--svc-mute: #6b6b6b;
	--svc-line: #d9d9d9;
	--svc-ph: #e9e9e9;

	/* Fonts (unchanged) */
	--svc-display: "acumin-variable", "Anton", Impact, sans-serif;
	--svc-body: "Founders Grotesk", "Hanken Grotesk", system-ui, sans-serif;

	/* Type scale: fluid from 375px to 1440px */
	--fs-display-xl: clamp(64px, calc(24.6px + 10.52vw), 176px);
	--fs-display-l: clamp(48px, calc(22.65px + 6.76vw), 120px);
	--fs-display-m: clamp(34px, calc(20.6px + 3.57vw), 72px);
	--fs-h3: clamp(26px, calc(21.07px + 1.31vw), 40px);
	--fs-card: clamp(24px, calc(21.89px + 0.56vw), 30px);
	--fs-lead: clamp(19px, calc(17.24px + 0.47vw), 24px);
	--fs-body: clamp(16px, calc(15.3px + 0.19vw), 18px);
	--fs-label: clamp(12px, calc(11.65px + 0.09vw), 13px);

	--lh-display: .9;
	--lh-display-m: .92;
	--lh-sub: 1.1;
	--lh-lead: 1.45;
	--lh-body: 1.55;
	--lh-label: 1.25;

	--ls-display: -.01em;
	--ls-label: .12em;

	/* Spacing scale (8px base) */
	--sp-1: 8px;
	--sp-2: 16px;
	--sp-3: 24px;
	--sp-4: 32px;
	--sp-6: 48px;
	--sp-8: 64px;
	--sp-12: 96px;
	--sp-16: 128px;

	/* Grid */
	--svc-margin: 24px;
	--svc-gap: var(--sp-3);
	--svc-max: 1440px;
	--svc-section: var(--sp-8);
	--svc-measure: 65ch;

	background: var(--svc-paper);
	color: var(--svc-ink);
	font: 400 var(--fs-body)/var(--lh-body) var(--svc-body);
	-webkit-font-smoothing: antialiased;
}
@media (min-width: 768px) {
	.svc { --svc-margin: 48px; }
}
@media (min-width: 1024px) {
	.svc { --svc-margin: 80px; --svc-section: var(--sp-12); }
}

.svc *, .svc *::before, .svc *::after { box-sizing: border-box; }
/* Reset at zero specificity so component spacing below always wins */
:where(.svc) :where(p, h1, h2, h3, ul, table) { margin: 0; padding: 0; }
/* The theme's global p { margin-bottom: 16px } outranks the zero-specificity reset above; cancel it so spacing comes only from the rules below */
.svc p { margin-bottom: 0; }
:where(.svc) ul { list-style: none; }
.svc a { color: inherit; }
.svc-wrap { padding: 0 var(--svc-margin); max-width: var(--svc-max); margin: 0 auto; }

/* Text hierarchy */
.svc-display,
.svc-row-t,
.svc-panel h3,
.svc-panel h4,
.svc-card-t,
.svc-table td h3,
.svc-table td h4,
.svc-block h3,
.svc-block h4 {
	font-family: var(--svc-display);
	font-variation-settings: "wght" 800, "wdth" 50, "slnt" 0;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: var(--ls-display);
	text-wrap: balance;
}
.svc-xl { font-size: var(--fs-display-xl); line-height: var(--lh-display); }
.svc-l  { font-size: var(--fs-display-l); line-height: var(--lh-display); }
.svc-m  { font-size: var(--fs-display-m); line-height: var(--lh-display-m); }
.svc-s  { font-size: var(--fs-h3); line-height: var(--lh-sub); }
.svc-label, .svc-num, .svc-card-s, .svc-tags li, .svc-ph {
	font: 500 var(--fs-label)/var(--lh-label) var(--svc-body);
	letter-spacing: var(--ls-label);
	text-transform: uppercase;
}
.svc p, .svc li { text-wrap: pretty; }
.svc-lead { font-size: var(--fs-lead); line-height: var(--lh-lead); max-width: 46ch; margin-top: var(--sp-4); }
.svc-eyebrow { color: var(--svc-mute); margin-bottom: var(--sp-2); }
.svc-intro { max-width: var(--svc-measure); margin-top: var(--sp-3); }

/* Negative space: sections */
.svc-sec { position: relative; padding: var(--svc-section) 0; }
/* Divider under each section, inset to the text edges (same inset as .svc-wrap) */
.svc-sec::after { content: ""; position: absolute; bottom: 0; height: 1px; background: var(--svc-ink); left: calc(max(0px, (100% - var(--svc-max)) / 2) + var(--svc-margin)); right: calc(max(0px, (100% - var(--svc-max)) / 2) + var(--svc-margin)); }
/* A tinted panel stands on its own, so it needs no divider above or below */
.svc-sec-panel { background: #f2f2ef; }
.svc-sec-panel::after,
.svc-sec:has(+ .svc-sec-panel)::after,
.svc-sec:last-child::after { display: none; }
.svc-head { display: grid; grid-template-columns: 1fr; gap: var(--sp-1); align-items: baseline; }
.svc-body { padding-top: var(--sp-4); }
.svc-ph { background: var(--svc-ph); display: flex; align-items: flex-end; padding: var(--sp-2); color: var(--svc-mute); }

/* Visual balance: 12-column grid from 1024px. Content runs the full width; paired blocks split on the grid. */
@media (min-width: 1024px) {
	.svc-work-head {
		display: grid;
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: var(--svc-gap);
	}
	.svc-work-head > :first-child { grid-column: 1 / 9; }
	.svc-work-head > :last-child { grid-column: 9 / -1; justify-self: end; }
}

/* Visually hidden text: still read by screen readers and search engines */
.svc-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Hero (site header sits over it) */
/* margin-top: the fixed header is a fraction shorter than the space reserved for it; tuck the hero under so no sliver of page shows */
.svc-hero { margin-top: -1px; position: relative; min-height: 92vh; background: var(--svc-ink); color: var(--svc-paper); display: flex; align-items: flex-end; padding-top: 160px; }
.svc-hero-media { position: absolute; inset: 0; background: repeating-linear-gradient(135deg, #151515 0 22px, #0e0e0e 22px 44px); }
/* Hero photo, darkened on the text side so the heading stays readable */
.svc-hero-media.has-image { background: #000; }
.svc-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.svc-hero-media.has-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.85) 0%, rgba(0,0,0,.45) 60%, rgba(0,0,0,.35) 100%); }
@media (min-width: 1024px) {
	.svc-hero-media.has-image::after { background: linear-gradient(90deg, rgba(0,0,0,.85) 0%, rgba(0,0,0,.55) 45%, rgba(0,0,0,.25) 100%); }
}
.svc-hero-media span { position: absolute; top: 128px; right: var(--svc-margin); font: 500 var(--fs-label)/var(--lh-label) var(--svc-body); color: #888; text-transform: uppercase; letter-spacing: var(--ls-label); }
.svc-hero .svc-wrap { position: relative; width: 100%; padding-bottom: var(--sp-8); }
.svc-hero h1 { margin: var(--sp-2) 0 var(--sp-3); color: var(--svc-paper); }
.svc-hero-line { font-size: var(--fs-lead); line-height: var(--lh-lead); max-width: 40ch; }
.svc-tags { display: flex; flex-wrap: wrap; gap: var(--sp-1); margin-top: var(--sp-4); }
.svc-tags li { border: 1px solid currentColor; border-radius: 999px; padding: 10px var(--sp-2); }
/* Tags that jump to a section */
.svc-tags li:has(a) { padding: 0; }
.svc-tags a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--sp-2); border-radius: 999px; text-decoration: none; transition: background .15s, color .15s; }
.svc-tags a:hover { background: var(--svc-paper); color: var(--svc-ink); }
.svc-tags a:active { transform: translateY(1px); }
.svc [id] { scroll-margin-top: 140px; }

/* Case study rows under a section */
.svc-case-row { margin-top: var(--sp-8); }
.svc-case-head { display: flex; justify-content: space-between; align-items: baseline; gap: var(--sp-2); flex-wrap: wrap; }
.svc-case-head a { font: 500 var(--fs-label)/var(--lh-label) var(--svc-body); letter-spacing: var(--ls-label); text-transform: uppercase; padding: 14px 0; }

/* 01 */
.svc-cols { display: grid; grid-template-columns: 1fr; gap: var(--sp-4); margin-top: var(--sp-6); }
.svc-cols > div { max-width: var(--svc-measure); }
.svc-cols h3 { margin-bottom: var(--sp-2); }
/* Discipline: the intro paragraph ends where the left-hand column below it ends */
.svc-discipline { --svc-col: 100%; }
.svc-discipline .svc-lead { max-width: var(--svc-col); }
.svc-discipline .svc-cols > div { max-width: none; }
@media (min-width: 1280px) {
	.svc-discipline { --svc-col: calc((100% - var(--svc-gap)) / 2); }
}
/* Equal space above the line, between the line and the text, and below the text to the section divider */
.svc-pull { margin-top: var(--svc-section); padding-top: var(--svc-section); border-top: 1px solid var(--svc-ink); }
/* Trim the type to its cap height and baseline, so the spacing above is measured from the letters, not the line box */
.svc-pull { text-box: trim-both cap alphabetic; }
.svc-cols p:last-child { text-box: trim-end cap alphabetic; }
@media (min-width: 1280px) {
	.svc-cols { grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; grid-auto-flow: column; column-gap: var(--svc-gap); row-gap: var(--sp-2); }
	.svc-cols > div { display: contents; }
	.svc-cols h3 { margin-bottom: 0; align-self: end; }
}

/* 02 */
.svc-jumps { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-4); }
.svc-jumps a { text-decoration: none; border: 1px solid var(--svc-ink); padding: 14px var(--sp-3); min-height: 48px; display: inline-flex; align-items: center; font: 500 var(--fs-label)/var(--lh-label) var(--svc-body); letter-spacing: var(--ls-label); text-transform: uppercase; transition: background .15s, color .15s; }
.svc-track { margin-top: var(--sp-16); scroll-margin-top: var(--sp-16); }
.svc-track-head { border-bottom: 1px solid var(--svc-ink); padding-bottom: var(--sp-2); }
.svc-track-head .svc-display { margin-top: var(--sp-1); }
.svc-rows { margin-top: var(--sp-3); }

/* Services: big titles that open to the detail */
.svc-services { margin-top: var(--sp-4); }
.svc-service > summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 1fr 32px; align-items: center; gap: var(--sp-2); padding: var(--sp-2) 0; }
.svc-service > summary::-webkit-details-marker { display: none; }
.svc-service > summary h3 { color: var(--svc-ink); }
.svc-service > summary:hover h3 { text-decoration: underline; text-underline-offset: 8px; text-decoration-thickness: 3px; }
.svc-service[open] > summary .svc-pm::after { transform: rotate(0); }
.svc-service-inner { padding: 0 0 var(--sp-6); }
/* Even gap between an open title and whichever layout it holds */
.svc-service-inner > :first-child { margin-top: var(--sp-2); }
.svc-service-inner > .svc-case-row { margin-top: var(--sp-6); }
.svc-service-inner > .svc-body { padding-top: var(--sp-2); }
.svc-service-inner > .svc-body > :first-child { margin-top: 0; }

/* Services overview page: heading, intro, then the services as big links */
.svc-index .svc-sec::after { display: none; }
.svc-index .svc-lead { max-width: 46ch; }
.svc-index-list { margin-top: var(--sp-8); }
.svc-index-list a { display: flex; justify-content: space-between; align-items: center; gap: var(--sp-3); padding: var(--sp-1) 0; text-decoration: none; }
.svc-index-list h2 { color: var(--svc-ink); }
.svc-index-arrow { font-family: var(--svc-display); font-size: var(--fs-display-m); line-height: 1; transition: transform .2s; }
.svc-index-list a:hover h2 { text-decoration: underline; text-underline-offset: 8px; text-decoration-thickness: 3px; }
.svc-index-list a:hover .svc-index-arrow { transform: translateX(8px); }
/* Inverted list for black sections (homepage services) */
.svc-invert { --svc-ink: #FCFCF8; --svc-paper: #000; --svc-mute: #8c8c8c; background: transparent; }
.svc-home-services .svc-index-list { margin-top: 0; }

/* Click-to-open rows */
.svc-row { border-bottom: 1px solid var(--svc-line); }
.svc-row summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 1fr 32px; align-items: center; gap: var(--sp-2); padding: var(--sp-3) 0; min-height: 48px; }
.svc-row summary::-webkit-details-marker { display: none; }
.svc-row-t { display: block; font-size: var(--fs-h3); line-height: var(--lh-sub); }
.svc-row-claim { display: block; color: var(--svc-mute); margin-top: var(--sp-1); max-width: var(--svc-measure); }
.svc-pm { justify-self: end; width: 24px; height: 24px; position: relative; }
.svc-pm::before, .svc-pm::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 2px; margin-top: -1px; background: var(--svc-ink); transition: transform .2s; }
.svc-pm::after { transform: rotate(90deg); }
.svc-row[open] .svc-pm::after { transform: rotate(0); }
.svc-row-inner { padding: 0 0 var(--sp-4); }
.svc-row-inner ul, .svc-row-inner p { max-width: var(--svc-measure); }
.svc-row-inner li { padding: var(--sp-1) 0; border-top: 1px solid var(--svc-line); }
.svc-faq .svc-row-t { font-family: var(--svc-body); font-variation-settings: normal; font-weight: 500; text-transform: none; letter-spacing: 0; font-size: var(--fs-lead); line-height: 1.3; }
.svc-faq { margin-top: var(--sp-6); }

/* Track 02 */
.svc-panels { display: grid; grid-template-columns: 1fr; gap: var(--sp-3); margin-top: var(--sp-6); }
.svc-panel .svc-ph { aspect-ratio: 4 / 3; }
@media (min-width: 600px) {
	.svc-panel .svc-ph { aspect-ratio: 3 / 4; }
}
.svc-panel h3, .svc-panel h4 { font-size: var(--fs-card); line-height: var(--lh-sub); margin-top: var(--sp-2); }
.svc-panel ul { margin-top: var(--sp-2); }
.svc-panel li { color: var(--svc-mute); padding: var(--sp-1) 0; border-top: 1px solid var(--svc-line); }
/* Video panels: the poster fills the box until the video loads */
.svc-panel-media { position: relative; padding: 0; overflow: hidden; background: #000; }
.svc-panel-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* Numbered steps: a rule, a large numeral, the title and its points. No image needed. */
:where(.svc) ol.svc-steps { list-style: none; margin: var(--sp-6) 0 0; padding: 0; }
.svc-step { border-top: 1px solid var(--svc-ink); padding-top: var(--sp-3); }
.svc-step-n { display: block; font-size: var(--fs-display-l); line-height: var(--lh-display); text-box: trim-both cap alphabetic; }
.svc-step h4 { margin-top: var(--sp-3); }
.svc-feature { margin-top: var(--sp-8); background: var(--svc-ink); color: var(--svc-paper); padding: var(--sp-4) var(--sp-3); display: grid; grid-template-columns: 1fr; gap: var(--sp-6); }
.svc-feature .svc-display { margin-top: var(--sp-2); }
.svc-feature h3, .svc-feature h4 { color: var(--svc-paper); }
.svc-feature > div:first-child > :first-child { margin-top: 0; }
.svc-feature p:not(.svc-label):not(.svc-display) { margin-top: var(--sp-3); color: #cfcfcf; max-width: 46ch; }
.svc-feature .svc-label { color: #9a9a9a; margin-bottom: var(--sp-2); }
.svc-feature h4.svc-s { margin-bottom: var(--sp-2); }
.svc-feature li { padding: var(--sp-1) 0; border-top: 1px solid #333; }
.svc-recent { margin-top: var(--sp-8); }
.svc-recent .svc-case-row { margin-top: 0; }
.svc-recent-grid { display: grid; grid-template-columns: 1fr; gap: var(--sp-3); margin-top: var(--sp-3); }
/* Cards: fixed ratio boxes so images never shift the layout */
.svc-r-43 { aspect-ratio: 4 / 3; }
.svc-r-45 { aspect-ratio: 4 / 5; }
.svc-media { overflow: hidden; background: var(--svc-ph); }
.svc-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
a.svc-card { display: block; text-decoration: none; }
a.svc-card:hover .svc-media img { transform: scale(1.03); }
a.svc-card:hover .svc-card-t { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 2px; }
.svc-card-t { font-size: var(--fs-card); line-height: var(--lh-sub); margin-top: var(--sp-2); }
.svc-card-s { color: var(--svc-mute); margin-top: var(--sp-1); }
@media (min-width: 600px) {
	.svc-panels, .svc-recent-grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1280px) {
	.svc-panels { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.svc-recent-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.svc-recent-grid.svc-count-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.svc-feature { grid-template-columns: 1.1fr 1fr 1fr; padding: var(--sp-8); }
}

/* Digital: three blocks, fit table, stats */
.svc-blocks { display: grid; grid-template-columns: 1fr; gap: var(--sp-6); margin-top: var(--sp-6); }
.svc-block { border-top: 1px solid var(--svc-ink); padding-top: var(--sp-3); }
.svc-block h3, .svc-block h4 { font-size: var(--fs-card); line-height: var(--lh-sub); }
.svc-block-sub { color: var(--svc-mute); margin-top: var(--sp-1); }
.svc-block ul { margin-top: var(--sp-3); }
.svc-block li { padding: var(--sp-1) 0; border-top: 1px solid var(--svc-line); }
.svc-fit { margin-top: var(--sp-12); }
.svc-fit .svc-display { margin-top: var(--sp-2); }
.svc-stats { display: grid; grid-template-columns: 1fr; gap: var(--sp-6); margin-top: var(--sp-8); }
.svc-stat { border-top: 1px solid var(--svc-ink); padding-top: var(--sp-3); }
.svc-stat p:nth-child(2) { margin-top: var(--sp-2); max-width: 36ch; }
.svc-source { font: 500 var(--fs-label)/var(--lh-label) var(--svc-body); letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--svc-mute); margin-top: var(--sp-3); }
@media (min-width: 1024px) {
	.svc-blocks, .svc-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-4); }
}

/* 03 table */
.svc-table { width: 100%; table-layout: fixed; border-collapse: collapse; margin-top: var(--sp-6); }
.svc-table th { text-align: left; font: 500 var(--fs-label)/var(--lh-label) var(--svc-body); letter-spacing: var(--ls-label); text-transform: uppercase; padding: 0 var(--sp-3) var(--sp-2) 0; border-bottom: 1px solid var(--svc-ink); }
.svc-table td { vertical-align: top; padding: var(--sp-3) var(--sp-3) var(--sp-3) 0; border-bottom: 1px solid var(--svc-line); }
.svc-table td h3, .svc-table td h4 { font-size: var(--fs-card); line-height: var(--lh-sub); }

/* Connected: image and text share top and bottom edges */
.svc-connected { display: grid; grid-template-columns: 1fr; gap: var(--sp-6); align-items: stretch; }
.svc-connected .svc-ph { min-height: 280px; }
.svc-connected-media { position: relative; min-height: 320px; overflow: hidden; background: var(--svc-ph); }
.svc-connected-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.svc-connected h3 + p { margin: var(--sp-2) 0 var(--sp-6); max-width: 46ch; }
.svc-connected p:last-child { margin-bottom: 0; }
.svc-connected > div > h3:first-child { text-box: trim-start cap alphabetic; }
/* Links on to the other services */
.svc-links { margin-top: 0; border-bottom: 1px solid var(--svc-line); }
.svc-links li { border-top: 1px solid var(--svc-line); }
.svc-links a { display: flex; justify-content: space-between; align-items: center; gap: var(--sp-2); min-height: 48px; padding: var(--sp-2) 0; text-decoration: none; }
.svc-links-t { font-family: var(--svc-display); font-variation-settings: "wght" 800, "wdth" 50, "slnt" 0; font-weight: 800; text-transform: uppercase; letter-spacing: var(--ls-display); font-size: var(--fs-card); line-height: var(--lh-sub); }
.svc-links .svc-label { white-space: nowrap; }
.svc-links a:hover .svc-links-t { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 2px; }
@media (min-width: 1024px) {
	.svc-body.svc-connected { padding-top: 0; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--svc-gap); }
	.svc-body.svc-connected > .svc-ph,
	.svc-body.svc-connected > .svc-connected-media { grid-column: 1 / 7; min-height: 0; }
	.svc-body.svc-connected > div { grid-column: 7 / -1; }
}

/* Case study ticker */
.svc-work-head { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--sp-2); flex-wrap: wrap; margin-top: var(--sp-4); }
.svc-work-head a { font: 500 var(--fs-label)/var(--lh-label) var(--svc-body); letter-spacing: var(--ls-label); text-transform: uppercase; padding: 14px 0; }
.svc-ticker { overflow: hidden; margin-top: var(--sp-6); }
.svc-ticker-track { display: flex; gap: var(--sp-2); width: max-content; animation: svc-scroll 80s linear infinite; }
.svc-ticker:hover .svc-ticker-track,
.svc-ticker:focus-within .svc-ticker-track { animation-play-state: paused; }
.svc-ticker .svc-card { width: 280px; flex: none; }
@keyframes svc-scroll { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
	.svc-ticker { overflow-x: auto; }
	.svc-ticker-track { animation: none; }
}

/* User experience cues */
.svc-jumps a:hover { background: var(--svc-ink); color: var(--svc-paper); }
.svc-row summary:hover .svc-row-t { text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 2px; }
.svc-work-head a:hover { text-decoration-thickness: 2px; }
.svc-jumps a:active,
.svc-row summary:active { transform: translateY(1px); }
.svc a:focus-visible,
.svc summary:focus-visible {
	outline: 2px solid var(--svc-ink);
	outline-offset: 4px;
}
.svc-hero a:focus-visible,
.svc-feature a:focus-visible { outline-color: var(--svc-paper); }

/* Desktop and mobile optimisation */
@media (max-width: 699px) {
	.svc-row summary { grid-template-columns: 1fr 24px; gap: var(--sp-2); }
	.svc-table thead { display: none; }
	.svc-table tr, .svc-table td { display: block; width: 100%; }
	.svc-table td { border: none; padding: var(--sp-1) 0 0; }
	.svc-table tr { border-bottom: 1px solid var(--svc-line); padding: var(--sp-3) 0; }
	.svc-table td[data-h]::before { content: attr(data-h); display: block; font: 500 var(--fs-label)/var(--lh-label) var(--svc-body); letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--svc-mute); margin: var(--sp-1) 0 4px; }
}
