/* ShowLove — components on top of theme.json. Classes are added to core blocks as
   "Additional CSS class" (sl-*) or block styles (is-style-*). Loaded in the editor too. */

:root {
	--sl-ink: var(--wp--preset--color--ink);
	--sl-ink-2: var(--wp--preset--color--ink-2);
	--sl-line: var(--wp--preset--color--line);
	--sl-faint: #3A3644;
	--sl-paper: var(--wp--preset--color--paper);
	--sl-paper-dim: var(--wp--preset--color--paper-dim);
	--sl-muted: var(--wp--preset--color--muted);
	--sl-muted-2: #A9A4B0;
	--sl-muted-ink: var(--wp--preset--color--muted-ink);
	--sl-red: var(--wp--preset--color--red);
	--sl-red-ink: var(--wp--preset--color--red-ink);
	--sl-blue: var(--wp--preset--color--blue);
	--sl-yellow: var(--wp--preset--color--yellow);
	--sl-white: var(--wp--preset--color--white);
	--sl-display: var(--wp--preset--font-family--display);
	--sl-tag: var(--wp--preset--font-family--tag);
	--sl-ease: var(--wp--custom--ease);
	--sl-section: var(--wp--preset--spacing--80);
	--sl-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
}

/* ---------- base ---------- */
html { scroll-behavior: smooth; }
body { overflow-x: clip; -webkit-font-smoothing: antialiased; }
/* full-width sections stack without gaps */
.wp-site-blocks > *,
.sl-main,
.sl-main.sl-main > *,
.wp-block-post-content.sl-sections > * { margin-block: 0; }
/* titles are white on dark backgrounds and follow the text colour on light ones */
body, .has-ink-background-color, .has-ink-2-background-color, .has-blue-background-color { --sl-heading: var(--sl-white); }
.has-paper-background-color, .has-red-background-color, .has-yellow-background-color, .sl-card--paper { --sl-heading: currentColor; }
:where(h1, h2, h3, h4, h5, h6) { color: var(--sl-heading, inherit); }
/* focus ring follows the background: yellow on dark, ink on paper/red */
:focus-visible { outline: 3px solid var(--sl-focus, var(--sl-yellow)); outline-offset: 3px; }
.has-paper-background-color, .has-red-background-color { --sl-focus: var(--sl-ink); }

/* ---------- sections ---------- */
.sl-section { position: relative; padding-block: var(--sl-section); }
.sl-section--flush-top { padding-top: 0; }
.sl-section--divider { border-top: 1px solid var(--sl-line); }

/* spray grain on dark sections */
.sl-grain { position: relative; isolation: isolate; }
.sl-grain::after {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .07;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* torn paper top edge: the section itself is masked, so its colour and grain run into the edge */
.is-style-torn {
	--torn-h: 34px;
	--torn-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 40' preserveAspectRatio='none'%3E%3Cpath d='M0 40L0 18L24 8L50 24L65 6L96 7L121 22L136 20L156 5L172 17L199 6L220 6L251 17L266 22L283 11L317 24L349 5L381 22L407 5L428 5L459 8L482 17L500 21L517 22L540 21L575 9L592 22L624 24L644 15L661 21L697 6L729 5L762 10L791 21L818 14L846 22L874 15L897 11L916 11L932 22L955 20L984 14L1021 18L1044 23L1060 7L1090 17L1109 14L1127 19L1154 5L1189 6L1200 21L1200 40Z'/%3E%3C/svg%3E");
	position: relative;
	-webkit-mask: var(--torn-mask) 0 0 / 100% var(--torn-h) no-repeat, linear-gradient(#000 0 0) 0 calc(var(--torn-h) - 1px) / 100% 100% no-repeat;
	mask: var(--torn-mask) 0 0 / 100% var(--torn-h) no-repeat, linear-gradient(#000 0 0) 0 calc(var(--torn-h) - 1px) / 100% 100% no-repeat;
}
.wp-block-post-content.sl-sections > .is-style-torn,
.sl-main > .is-style-torn { margin-top: calc(-1 * var(--torn-h)); }
.sl-section.is-style-torn { padding-top: calc(var(--sl-section) + var(--torn-h)); }

/* breathing room for whatever follows a card grid (notes, buttons) */
.sl-section :is(.sl-grid-2, .sl-grid-3, .sl-grid-4) + * { margin-top: 48px !important; }
/* plain text links on light backgrounds: yellow would be unreadable */
.has-paper-background-color :is(p, li):not(.sl-link-arrow) > a:not([class]) { color: var(--sl-red-ink); }
.has-paper-background-color :is(p, li):not(.sl-link-arrow) > a:not([class]):hover { color: var(--sl-ink); }

/* layout helpers for groups: no flow margins inside custom grids */
:is(.sl-grid-2, .sl-grid-3, .sl-grid-4, .sl-stats, .sl-collage, .sl-partners, .sl-head, .sl-tapes) > * { margin-block: 0 !important; }
.sl-grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.sl-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.sl-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; }
.sl-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 56px !important; }
.sl-head > .wp-block-group { display: flex; flex-direction: column; gap: 12px; }
.sl-head > .wp-block-group > * { margin: 0 !important; }
.sl-head > p { max-width: 440px; }
.sl-split { gap: 56px; }
.sl-split > .wp-block-column > * + * { margin-block-start: 24px; }

/* per-block knobs the editor can add as classes */
.sl-tilt-l { --sl-r: -1deg; }
.sl-tilt-r { --sl-r: 1.2deg; }
.sl-pos-top img { object-position: center 25%; }

/* ---------- type ---------- */
.is-style-tag {
	display: inline-block; align-self: flex-start; transform: rotate(-3deg);
	font-family: var(--sl-tag); font-size: 28px; line-height: 1.1;
}
.is-style-tag:not(.has-text-color) { color: var(--sl-yellow); }
.is-style-kicker {
	display: inline-block; width: fit-content; padding: 8px 14px; transform: rotate(-1.5deg);
	background: var(--sl-yellow); color: var(--sl-ink);
	font-size: 13px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; line-height: 1.6;
}
.is-style-pill {
	display: inline-block; width: fit-content; padding: 6px 12px; background: var(--sl-red); color: var(--sl-ink);
	font-size: 13px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase;
}
.sl-label { font-size: 14px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.sl-muted { color: var(--sl-muted); }
.sl-fineprint { font-size: 14px; line-height: 1.5; }
.sl-link-arrow a {
	display: inline-flex; align-items: center; gap: 10px; min-height: 48px;
	color: inherit; font-size: 16px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
	text-decoration: none; border-bottom: 3px solid currentColor;
}
.sl-link-arrow a::after, .sl-arrow .wp-block-button__link::after, .sl-go::after {
	content: ""; width: 18px; height: 18px; flex: none; background: currentColor;
	-webkit-mask: var(--sl-arrow) center / contain no-repeat; mask: var(--sl-arrow) center / contain no-repeat;
	transition: transform .25s var(--sl-ease);
}
.sl-link-arrow a:hover { color: inherit; }
.sl-link-arrow a:hover::after, .sl-arrow .wp-block-button__link:hover::after { transform: translateX(5px); }

/* ---------- buttons ---------- */
.wp-block-button__link { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 56px; transition: transform .25s var(--sl-ease), box-shadow .25s var(--sl-ease), background-color .25s, color .25s; }
.wp-block-button:not(.is-style-outline):not(.is-style-outline-yellow) .wp-block-button__link:hover { transform: translate(-2px, -2px); box-shadow: 7px 7px 0 var(--sl-shadow, var(--sl-ink)); }
.sl-shadow-red { --sl-shadow: var(--sl-red); }
.sl-shadow-red .wp-block-button__link { box-shadow: 5px 5px 0 var(--sl-red); }
.wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: var(--sl-white); border-color: currentColor; box-shadow: none; }
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--sl-white); color: var(--sl-ink); }
.has-paper-background-color .wp-block-button.is-style-outline .wp-block-button__link { color: var(--sl-ink); }
.has-paper-background-color .wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--sl-ink); color: var(--sl-paper); }
.has-red-background-color .wp-block-button.is-style-outline .wp-block-button__link { color: var(--sl-ink); }
.has-red-background-color .wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--sl-ink); color: var(--sl-red); }
.wp-block-button.is-style-outline-yellow .wp-block-button__link { background: transparent; color: var(--sl-yellow); border-color: var(--sl-yellow); box-shadow: none; }
.wp-block-button.is-style-outline-yellow .wp-block-button__link:hover { background: var(--sl-yellow); color: var(--sl-ink); }

/* ---------- posters, tape, stickers ---------- */
/* Tilt/hover use the individual rotate/translate/scale properties, never `transform`,
   so they compose with the reveal animation instead of being overridden by it. */
.is-style-poster, .is-style-poster-tape { position: relative; rotate: var(--sl-r, 0deg); transition: rotate .45s var(--sl-ease), scale .45s var(--sl-ease); }
:is(.is-style-poster, .is-style-poster-tape) img { width: 100%; height: 100%; object-fit: cover; border: 6px solid var(--sl-paper); }
:is(.is-style-poster, .is-style-poster-tape):hover { rotate: 0deg; scale: 1.015; }
.is-style-poster-tape::before, .is-style-poster-tape::after {
	content: ""; position: absolute; z-index: 2; width: 92px; height: 26px;
	background: rgba(255, 210, 63, .85); box-shadow: 0 1px 2px rgba(0, 0, 0, .25);
}
.is-style-poster-tape::before { top: -10px; left: 18px; transform: rotate(-8deg); }
.is-style-poster-tape::after { bottom: -10px; right: 18px; transform: rotate(-6deg); }
.sl-sticker {
	position: absolute; z-index: 3; display: flex; flex-direction: column; align-items: center; justify-content: center;
	width: 124px; height: 124px; margin: 0 !important; border-radius: 50%; background: var(--sl-red); color: var(--sl-ink);
	transform: rotate(-12deg); box-shadow: 4px 4px 0 var(--sl-ink);
	font-family: var(--sl-display); font-size: 22px; line-height: 1; text-align: center; text-transform: uppercase;
}
.sl-sticker strong { font-weight: 400; font-size: 30px; }
.sl-date-tape {
	position: absolute; left: 12px; bottom: 12px; z-index: 2; margin: 0 !important; padding: 6px 10px; transform: rotate(-3deg);
	background: var(--sl-yellow); color: var(--sl-ink); font-family: var(--sl-display); font-size: 20px; line-height: 1.2;
}

/* ---------- header ---------- */
.sl-header { position: fixed; inset: 0 0 auto 0; z-index: 50; transition: background .3s var(--sl-ease), box-shadow .3s var(--sl-ease); }
.admin-bar .sl-header { top: var(--wp-admin--admin-bar--height, 32px); }
/* No filter/backdrop-filter/transform on the header: they make it the containing block of the
   fixed mobile menu overlay, which then shrinks to the header's height once the page is scrolled. */
.sl-header.is-solid { background: rgba(12, 11, 16, .94); box-shadow: 0 1px 0 var(--sl-line); }
.sl-header { padding-inline: var(--wp--custom--gutter); }
.sl-header__bar { max-width: var(--wp--style--global--wide-size, 1280px); margin-inline: auto !important; gap: 24px; padding-block: 18px; transition: padding .3s var(--sl-ease); }
.sl-header.is-solid .sl-header__bar { padding-block: 10px; }
.sl-brand { gap: 12px; }
.sl-brand .wp-block-site-logo img { width: 56px; height: 56px; object-fit: contain; }
.sl-brand__name a { display: flex; flex-direction: column; gap: 4px; color: var(--sl-white); text-decoration: none; line-height: 1; }
.sl-brand__name strong { font-family: var(--sl-display); font-weight: 400; font-size: 30px; letter-spacing: .02em; }
.sl-brand__name span { font-size: 11px; font-weight: 800; letter-spacing: .2em; color: var(--sl-yellow); }
.sl-header__actions { gap: 12px; }
.sl-header__actions > * { margin: 0; }
.sl-donate-top .wp-block-button__link { min-height: 48px; padding: 0 22px; font-size: 15px; rotate: -2deg; }
.sl-donate-top .wp-block-button__link:hover { rotate: 0deg; }
/* desktop menu */
.sl-nav-desktop .wp-block-navigation-item__content { position: relative; padding-block: 6px; color: var(--sl-white); text-decoration: none; }
.sl-nav-desktop .wp-block-navigation-item__content::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--sl-yellow); transform: scaleX(0); transform-origin: left; transition: transform .3s var(--sl-ease); }
.sl-nav-desktop .wp-block-navigation-item__content:hover::after,
.sl-nav-desktop .current-menu-item > .wp-block-navigation-item__content::after { transform: scaleX(1); }
/* mobile menu: only the toggle lives in the header, the overlay is parts/navigation-overlay.html */
.sl-nav-mobile .wp-block-navigation__responsive-container-open {
	align-items: center; justify-content: center; width: 48px; height: 48px;
	border: 2px solid var(--sl-white); color: var(--sl-white);
}
.sl-nav-mobile .wp-block-navigation__responsive-container-open svg { width: 26px; height: 26px; }
@media (min-width: 1101px) { .sl-nav-mobile { display: none !important; } }
@media (max-width: 1100px) { .sl-nav-desktop { display: none !important; } }

/* overlay */
.wp-block-navigation__responsive-container.is-menu-open:has(.sl-overlay) { padding: 0; background: var(--sl-ink); }
.sl-overlay { display: flex; flex-direction: column; gap: 32px; min-height: 100%; padding: 24px var(--wp--custom--gutter) 40px; background: var(--sl-ink); }
.sl-overlay > * { margin: 0 !important; }
.sl-overlay__top { justify-content: space-between; }
.sl-overlay__top .wp-block-site-logo img { width: 48px; height: 48px; object-fit: contain; }
.sl-overlay .wp-block-navigation-overlay-close { width: 48px; height: 48px; border: 2px solid var(--sl-white); color: var(--sl-white); background: transparent; }
.sl-overlay__nav .wp-block-navigation-item__content { font-family: var(--sl-display); font-size: 52px; line-height: 1.05; text-transform: uppercase; color: var(--sl-white); letter-spacing: 0; }
.sl-overlay__nav .wp-block-navigation-item__content:hover { color: var(--sl-yellow); }

/* ---------- hero ---------- */
.sl-hero { position: relative; display: flex; align-items: flex-end; min-height: 880px; overflow: hidden; background: var(--sl-ink); }
.sl-hero > * { margin: 0 !important; }
.sl-hero__media { position: absolute !important; inset: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: minmax(0, 1fr); }
.sl-hero__media > * { margin: 0 !important; }
.sl-hero__media .wp-block-video, .sl-hero__media video { width: 100%; height: 100%; }
.sl-hero__media video { display: block; object-fit: cover; }
.sl-hero::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(12, 11, 16, .55) 0%, rgba(12, 11, 16, .55) 72%, var(--sl-ink) 100%); }
.sl-hero__content { position: relative; z-index: 2; width: 100%; padding-top: 180px; padding-bottom: 150px; }
.sl-hero__inner > * + * { margin-block-start: 28px; }
.sl-hero__headline { position: relative; width: fit-content; }
.sl-hero__headline > * { margin: 0 !important; }
.sl-hero__title { color: var(--sl-white); }
.sl-hero__title mark { position: relative; display: inline-block; background: none; color: var(--sl-red); }
.sl-hero__title mark::after {
	content: ""; position: absolute; left: -2%; bottom: -.12em; width: 104%; height: .32em;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 700 40' preserveAspectRatio='none'%3E%3Cpath d='M6 26 C 120 8, 250 34, 380 18 S 600 8, 694 22' fill='none' stroke='%23FFD23F' stroke-width='7' stroke-linecap='round'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
}
.sl-hero__tag { position: absolute; right: -240px; top: 36%; font-size: 38px !important; transform: rotate(-8deg) !important; white-space: nowrap; }
.sl-hero__text { max-width: 620px; font-size: 20px; line-height: 1.55; }
.sl-hero__place {
	position: absolute; right: var(--wp--custom--gutter); bottom: 120px; z-index: 2; display: flex; align-items: center; gap: 8px;
	font-size: 14px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--sl-white);
}
.sl-hero__place::before {
	content: ""; width: 18px; height: 18px; background: var(--sl-yellow);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5'%3E%3Cpath d='M12 21s-7-6.2-7-11.5A7 7 0 0 1 19 9.5C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5'%3E%3Cpath d='M12 21s-7-6.2-7-11.5A7 7 0 0 1 19 9.5C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* pause control for the moving hero (added by theme.js) */
.sl-motion-toggle {
	position: absolute; right: var(--wp--custom--gutter); top: 120px; z-index: 3; display: inline-flex; align-items: center; gap: 8px;
	min-height: 40px; padding: 0 14px; border: 2px solid rgba(255, 255, 255, .7); background: rgba(12, 11, 16, .55); color: var(--sl-white);
	font: 800 12px/1 var(--wp--preset--font-family--body); letter-spacing: .1em; text-transform: uppercase; cursor: pointer;
}
.sl-motion-toggle::before { content: ""; width: 10px; height: 12px; border-inline: 3px solid currentColor; box-sizing: border-box; }
.sl-motion-toggle[aria-pressed="true"]::before { border: 0; border-left: 10px solid currentColor; border-block: 6px solid transparent; width: 0; height: 0; }
.sl-motion-toggle:hover { border-color: var(--sl-yellow); color: var(--sl-yellow); }
.sl-motion-paused .sl-marquee { animation-play-state: paused; }

/* ---------- tapes ---------- */
/* Dark strip between hero and the next section: the tapes open like a wedge, overlapping only at the left end. */
.sl-tapes { --dy: 36px; position: relative; z-index: 4; height: 210px; margin-top: -72px !important; overflow-x: clip; pointer-events: none; }
.sl-tape { position: absolute; top: 50%; left: -3%; width: 106%; padding: 14px 0; overflow: hidden; box-shadow: 0 5px 0 rgba(0, 0, 0, .45); color: var(--sl-ink); }
.sl-tape--yellow { background: var(--sl-yellow); transform: translateY(calc(-50% - var(--dy))) rotate(-2deg); }
.sl-tape--red { background: var(--sl-red); transform: translateY(calc(-50% + var(--dy))) rotate(1.6deg); }
.sl-marquee { display: flex; width: max-content; animation: sl-marquee 66s linear infinite; font-family: var(--sl-display); font-size: 30px; line-height: 1; letter-spacing: .04em; text-transform: uppercase; }
.sl-marquee span { white-space: pre; }
.sl-tape--red .sl-marquee { animation-direction: reverse; animation-duration: 88s; }
@keyframes sl-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ---------- about ---------- */
.sl-collage { position: relative; min-height: 560px; }
.sl-collage > .wp-block-image { position: absolute; margin: 0; }
.sl-collage__a { width: 66%; top: 0; left: 0; --sl-r: -2.5deg; aspect-ratio: 3 / 2; }
.sl-collage__b { width: 40%; top: 34%; right: 0; --sl-r: 3deg; aspect-ratio: 2 / 3; z-index: 2; }
.sl-collage__c { width: 52%; bottom: 0; left: 8%; --sl-r: 1.5deg; aspect-ratio: 3 / 2; }
.sl-collage .sl-sticker { top: -30px; right: 34%; }
.sl-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; margin-top: 88px !important; padding-top: 40px; border-top: 3px solid currentColor; }
.sl-stat { display: flex; flex-direction: column; gap: 8px; }
.sl-stat > * { margin: 0 !important; }
.sl-stat__num { font-family: var(--sl-display); font-size: 96px; line-height: 1; }
.sl-stat__label { font-size: 18px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }

/* ---------- murals ---------- */
.sl-murals { gap: 40px; }
.sl-mural > * + * { margin-block-start: 14px; }
.sl-mural .is-style-poster img { aspect-ratio: 4 / 3; }
.sl-mural--main .is-style-poster img { aspect-ratio: 4 / 5; }
.sl-mural__media { position: relative; }
.sl-mural__media > * { margin: 0 !important; }
.sl-mural__media .sl-sticker { top: -22px; left: -18px; }
.sl-mural .sl-label { color: var(--sl-yellow); }
.sl-mural p:not(.sl-label) { color: var(--sl-paper-dim); }
.sl-mural + .sl-mural { margin-top: 48px; }

/* ---------- feature (one shot) ---------- */
.sl-feature { gap: 56px; padding: 40px; background: var(--sl-ink-2); border: 3px solid var(--sl-paper); }
.sl-feature img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.sl-feature .wp-block-column > * + * { margin-block-start: 20px; }
.sl-feature .has-lead-font-size { color: var(--sl-paper-dim); max-width: 560px; }

/* ---------- cards ---------- */
/* whole card clickable through its title link */
.sl-card { position: relative; }
.sl-card :is(h3, h2) a { color: inherit; text-decoration: none; }
.sl-card :is(h3, h2) a::after { content: ""; position: absolute; inset: 0; z-index: 3; }
.sl-event > * + * { margin-block-start: 14px; }
.sl-event__img { position: relative; overflow: hidden; }
.sl-event__img > * { margin: 0 !important; }
.sl-event__img img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; transition: transform .6s var(--sl-ease); }
.sl-event:hover .sl-event__img img { transform: scale(1.05); }
.sl-where { font-size: 15px; font-weight: 700; color: var(--sl-muted-ink); }

.sl-join { display: flex; flex-direction: column; background: var(--sl-ink-2); border: 2px solid var(--sl-line); transition: translate .35s var(--sl-ease), rotate .35s var(--sl-ease), border-color .35s var(--sl-ease); }
.sl-join:hover { translate: 0 -6px; rotate: -.6deg; border-color: var(--sl-yellow); }
.sl-join > * { margin: 0 !important; }
.sl-join .wp-block-image { overflow: hidden; }
.sl-join img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; filter: grayscale(.35) contrast(1.05); transition: filter .45s var(--sl-ease), transform .6s var(--sl-ease); }
.sl-join:hover img { filter: none; transform: scale(1.04); }
.sl-join__body { padding: 26px; }
.sl-join__body > * + * { margin-block-start: 12px; }
.sl-join__num { font-family: var(--sl-display); font-size: 22px; letter-spacing: .06em; color: var(--sl-yellow); }
.sl-join__body p:not([class*="sl-"]) { font-size: 16px; color: var(--sl-muted); }
.sl-go { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--sl-yellow); }
.sl-card:hover .sl-go::after { transform: translateX(5px); }

.sl-service { display: flex; flex-direction: column; background: var(--sl-paper); color: var(--sl-ink); --sl-heading: currentColor; transition: translate .35s var(--sl-ease), box-shadow .35s var(--sl-ease); }
.sl-service:hover { translate: -4px -4px; box-shadow: 8px 8px 0 var(--sl-ink); }
.sl-service > * { margin: 0 !important; }
.sl-service .wp-block-image { overflow: hidden; }
.sl-service img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .6s var(--sl-ease); }
.sl-service:hover img { transform: scale(1.05); }
.sl-service__body { padding: 22px; }
.sl-service__body > * + * { margin-block-start: 10px; }
.sl-service__body p { font-size: 16px; line-height: 1.55; }

/* ---------- donate ---------- */
.sl-donate__title { font-size: clamp(64px, 8.5vw, 136px) !important; line-height: .88 !important; }
.sl-donate-photo { max-width: 380px; justify-self: end; --sl-r: 3deg; }
.sl-donate-photo img { aspect-ratio: 4 / 5; }
.sl-donate-box { --sl-heading: var(--sl-white); --sl-focus: var(--sl-yellow); padding: 36px; background: var(--sl-ink); color: var(--sl-paper); box-shadow: 8px 8px 0 var(--sl-yellow); }
.sl-donate-box > * + * { margin-block-start: 16px; }
.sl-donate-box :is(h2, h3) { font-size: 40px; line-height: 1; }
.sl-donate-box p { font-size: 16px; }
.sl-copy { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; border: 2px dashed var(--sl-yellow); }
.sl-copy__value { font-family: inherit; font-size: 22px; font-weight: 800; letter-spacing: .06em; color: var(--sl-yellow); background: none; overflow-wrap: anywhere; }
.sl-copy--empty .sl-copy__value { font-size: 18px; letter-spacing: .02em; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.sl-copy--empty .sl-copy__value:hover { color: var(--sl-white); }
.sl-copy__btn {
	display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border: 0; cursor: pointer;
	background: var(--sl-yellow); color: var(--sl-ink); font: 800 14px/1 var(--wp--preset--font-family--body); letter-spacing: .06em; text-transform: uppercase;
}
.sl-copy__btn::before {
	content: ""; width: 18px; height: 18px; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5'%3E%3Crect x='9' y='9' width='12' height='12'/%3E%3Cpath d='M5 15V3h12'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5'%3E%3Crect x='9' y='9' width='12' height='12'/%3E%3Cpath d='M5 15V3h12'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---------- partners ---------- */
.sl-partners { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px 28px; }
.sl-partner { position: relative; rotate: var(--sl-r, 0deg); transition: rotate .4s var(--sl-ease), translate .4s var(--sl-ease); }
.sl-partner:nth-child(4n+1) { --sl-r: -1.6deg; }
.sl-partner:nth-child(4n+2) { --sl-r: 1.2deg; }
.sl-partner:nth-child(4n+3) { --sl-r: -.8deg; }
.sl-partner:nth-child(4n) { --sl-r: 1.8deg; }
.sl-partner::before {
	content: ""; position: absolute; z-index: 2; top: -11px; left: 50%; width: 76px; height: 22px;
	translate: -50% 0; rotate: -5deg; background: rgba(255, 210, 63, .85); box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
}
.sl-partner.wp-block-image { aspect-ratio: 3 / 2; margin: 0; background: var(--sl-ink-2); border: 2px solid var(--sl-line); }
/* logo laid out inside the card box, so the card keeps its ratio whatever the image size */
.sl-partner.wp-block-image img { position: absolute; inset: 26px 32px; width: calc(100% - 64px); height: calc(100% - 52px) !important; object-fit: contain; transition: scale .4s var(--sl-ease); }
.sl-partner:hover { rotate: 0deg; translate: 0 -5px; }
.sl-partner.wp-block-image:hover { border-color: var(--sl-yellow); }
.sl-partner:hover img { scale: 1.06; }
.sl-partner--cta { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; aspect-ratio: 3 / 2; padding: 16px; background: var(--sl-yellow); color: var(--sl-ink); text-align: center; box-shadow: 6px 6px 0 var(--sl-red); --sl-heading: currentColor; }
.sl-partner--cta::before { background: rgba(242, 238, 228, .9); }
.sl-partner--cta > * { margin: 0 !important; }
.sl-partner--cta h3 { font-size: clamp(26px, 2.4vw, 36px); }
.sl-partner--cta .sl-go { color: var(--sl-ink); font-size: 14px; }

/* ---------- instagram (Smash Balloon feed restyled as a 6-up square grid) ---------- */
/* The saved feed ignores shortcode overrides, so layout is forced here: header, captions and
   "load more" hidden, first 6 posts only, square crops whatever the plugin's JS computes. */
.sl-instagram #sb_instagram { width: 100% !important; padding: 0 !important; }
.sl-instagram #sb_instagram :is(.sb_instagram_header, #sbi_load, .sbi_info_wrapper, .sbi_link) { display: none !important; }
.sl-instagram #sb_instagram #sbi_images { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px !important; padding: 0 !important; }
.sl-instagram #sb_instagram .sbi_item { width: auto !important; max-width: none !important; margin: 0 !important; padding: 0 !important; overflow: hidden; }
.sl-instagram #sb_instagram .sbi_item:nth-child(n+7) { display: none !important; }
.sl-instagram #sb_instagram .sbi_photo { height: auto !important; aspect-ratio: 1 / 1; padding: 0 !important; background-size: cover !important; }
.sl-instagram #sb_instagram .sbi_photo img { width: 100% !important; height: 100% !important; object-fit: cover; }
.sl-instagram #sb_instagram .sbi_item:hover .sbi_photo img { transform: scale(1.06); }

/* ---------- footer ---------- */
.sl-footer { --sl-heading: var(--sl-white); overflow: hidden; }
.sl-footer-inner { padding-top: 72px; padding-bottom: 32px; }
.sl-newsletter { gap: 48px; align-items: center; padding: 32px 40px; border: 3px solid var(--sl-yellow); }
.sl-newsletter p { color: var(--sl-paper-dim); }
.sl-newsletter .wp-block-column > * + * { margin-block-start: 12px; }
.sl-foot-cols { gap: 40px; margin-top: 56px !important; }
.sl-foot-cols h3 { font-family: var(--wp--preset--font-family--body); font-size: 13px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--sl-yellow); }
.sl-foot-cols .wp-block-column > * + * { margin-block-start: 12px; }
.sl-foot-cols a { color: var(--sl-white); font-size: 15px; overflow-wrap: anywhere; }
.sl-foot-cols a:hover { color: var(--sl-yellow); }
.sl-foot-cols p, .sl-foot-list { font-size: 15px; }
.sl-foot-list { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 8px; }
/* the long site list runs in two columns so the footer stays short */
.sl-foot-list--split { display: grid; grid-template-columns: repeat(2, max-content); gap: 8px 28px; }
.sl-foot-list li { margin: 0; }
.sl-wordmark { margin-top: 48px !important; font-family: var(--sl-display); font-size: clamp(56px, 12vw, 200px); line-height: .8; text-align: center; color: transparent; -webkit-text-stroke: 2px var(--sl-faint); user-select: none; }
.sl-foot-bottom { flex-wrap: wrap; justify-content: space-between; gap: 16px; padding-top: 24px; border-top: 1px solid var(--sl-line); font-size: 14px; color: var(--sl-muted-2); }
.sl-foot-bottom > * { margin: 0 !important; }

/* ---------- Fluent Forms (default skin disabled in inc/forms.php) ---------- */
.fluentform .ff-el-group { margin-bottom: 14px; }
.fluentform .ff-el-input--label label { font-size: 14px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--sl-white); }
.fluentform .ff-el-form-control {
	width: 100%; min-height: 56px; padding: 0 18px; border: 2px solid var(--sl-paper); border-radius: 0;
	background: var(--sl-ink); color: var(--sl-white); font: 17px var(--wp--preset--font-family--body);
}
.fluentform textarea.ff-el-form-control { min-height: 160px; padding-block: 14px; }
.fluentform select.ff-el-form-control { appearance: auto; }
.fluentform .ff-el-form-control::placeholder { color: var(--sl-muted-2); }
.fluentform .ff-el-form-control:focus { outline: 3px solid var(--sl-yellow); outline-offset: 2px; }
.fluentform .ff-el-tc, .fluentform .ff-el-form-check { font-size: 14px; line-height: 1.5; color: var(--sl-muted); }
.fluentform .ff-el-form-check-label, .fluentform .ff_tc_label { display: flex !important; align-items: flex-start; gap: 10px; }
.fluentform input[type=checkbox] { width: 20px; height: 20px; margin: 1px 0 0; flex: none; accent-color: var(--sl-yellow); }
.fluentform .ff-btn-submit {
	min-height: 56px; padding: 0 28px; border: 0; border-radius: 0; cursor: pointer;
	background: var(--sl-yellow) !important; color: var(--sl-ink) !important;
	font: 800 16px/1 var(--wp--preset--font-family--body); letter-spacing: .06em; text-transform: uppercase;
}
.fluentform .ff-btn-submit:hover { opacity: 1; filter: brightness(1.05); }
.fluentform .error.text-danger { margin-top: 6px; color: #FF8A80; font-size: 14px; font-weight: 700; }
.ff-message-success { padding: 16px 18px; border: 2px dashed var(--sl-yellow); color: var(--sl-yellow); font-weight: 700; box-shadow: none; }
/* newsletter in the footer: email + button on one row, consent below */
.sl-newsletter .fluentform fieldset { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px 12px; align-items: end; }
.sl-newsletter .fluentform fieldset > .ff-el-group { grid-column: 1 / -1; margin: 0; }
.sl-newsletter .fluentform fieldset > .ff-el-group:has(input[type=email]) { grid-column: 1; grid-row: 1; }
.sl-newsletter .fluentform fieldset > .ff_submit_btn_wrapper { grid-column: 2; grid-row: 1; }
.sl-newsletter .fluentform fieldset > .ff-el-group:has(.ff-el-tc) { grid-row: 2; }

/* ---------- page heads (inner pages, news) ---------- */
.sl-page-head { padding-top: 200px; padding-bottom: 72px; }
.sl-page-head > * + * { margin-block-start: 16px; }
.sl-page-head__inner > * + * { margin-block-start: 20px; }
.sl-page-head__inner .has-lead-font-size { max-width: 720px; color: var(--sl-paper-dim); }
.sl-page-head__inner .wp-block-buttons { margin-top: 32px; }

/* ---------- inner page components ---------- */
/* timeline: year on the left, story on the right, a marker line between */
.sl-timeline { display: flex; flex-direction: column; border-left: 3px solid currentColor; margin-left: 8px; }
.sl-timeline > * { margin: 0 !important; }
.sl-timeline__item { position: relative; display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 8px 32px; padding: 0 0 44px 32px; }
.sl-timeline__item::before { content: ""; position: absolute; left: -11px; top: 10px; width: 19px; height: 19px; border-radius: 50%; background: var(--sl-red); box-shadow: 0 0 0 4px var(--sl-paper); }
.sl-timeline__item > * { margin: 0 !important; }
.sl-timeline__item > :not(.sl-timeline__year) { grid-column: 2; }
.sl-timeline__year { grid-row: 1 / span 2; font-family: var(--sl-display); font-size: 40px; line-height: 1; }
.sl-timeline__item h3 { font-size: var(--wp--preset--font-size--display-xs); }

/* value / step cards */
.sl-value { padding: 28px; background: var(--sl-ink-2); border: 2px solid var(--sl-line); }
.sl-value > * + * { margin-block-start: 12px; }
.sl-value__num { font-family: var(--sl-display); font-size: 44px; line-height: 1; color: var(--sl-yellow); }
.sl-value p:not(.sl-value__num) { font-size: 16px; color: var(--sl-muted); }
.has-paper-background-color .sl-value { background: var(--sl-white); border-color: var(--sl-ink); }
.has-paper-background-color .sl-value p:not(.sl-value__num) { color: var(--sl-muted-ink); }
.has-paper-background-color .sl-value__num { color: var(--sl-red-ink); }

/* text + image rows (services, home of the association) */
.sl-row { gap: 56px; }
.sl-row + .sl-row { margin-top: 96px !important; }
.sl-row .wp-block-column > * + * { margin-block-start: 20px; }
.sl-row .is-style-poster img, .sl-row .is-style-poster-tape img { aspect-ratio: 4 / 3; }
.sl-checklist { list-style: none; padding: 0; }
.sl-checklist li { position: relative; padding-left: 30px; margin-top: 8px; }
.sl-checklist li::before { content: "✦"; position: absolute; left: 0; color: var(--sl-red); }
.has-ink-background-color .sl-checklist li::before, .has-blue-background-color .sl-checklist li::before { color: var(--sl-yellow); }

/* events with photo galleries */
.sl-event-block { gap: 48px; padding-top: 56px; border-top: 3px solid currentColor; }
.sl-event-block + .sl-event-block { margin-top: 72px !important; }
.sl-event-block .wp-block-column > * + * { margin-block-start: 16px; }
.sl-event-block .sl-date-tape { position: static; display: inline-block; }
.sl-gallery.wp-block-gallery { --wp--style--unstable-gallery-gap: 12px; gap: 12px; }
.sl-gallery.wp-block-gallery img { transition: transform .5s var(--sl-ease); }
.sl-gallery .wp-block-image { overflow: hidden; }
/* square crops so every event row has the same height, whatever the photo ratio */
.sl-gallery.wp-block-gallery.has-nested-images figure.wp-block-image { aspect-ratio: 1 / 1; }
.sl-gallery.wp-block-gallery.has-nested-images figure.wp-block-image img { height: 100%; object-fit: cover; }
.sl-gallery .wp-block-image:hover img { transform: scale(1.04); }

/* clothing */
.sl-product { display: flex; flex-direction: column; background: var(--sl-ink-2); border: 2px solid var(--sl-line); color: var(--sl-paper); --sl-heading: var(--sl-white); --sl-focus: var(--sl-yellow); }
.sl-product__body p:not([class]) { font-size: 16px; color: var(--sl-muted); }
.sl-product > * { margin: 0 !important; }
.sl-product .wp-block-image img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.sl-product__body { padding: 24px; }
.sl-product__body > * + * { margin-block-start: 12px; }
.sl-price { font-family: var(--sl-display); font-size: 30px; line-height: 1; color: var(--sl-yellow); }
.sl-sizes { font-size: 14px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--sl-muted); }
.sl-whatsapp .wp-block-button__link { width: 100%; }

/* contact info */
.sl-contact-list { list-style: none; padding: 0; }
.sl-contact-list li { padding: 18px 0; border-bottom: 1px solid var(--sl-line); }
.sl-contact-list li:first-child { padding-top: 0; }
.sl-contact-list strong { display: block; font-size: 13px; letter-spacing: .18em; text-transform: uppercase; color: var(--sl-yellow); }
.sl-contact-list a { color: var(--sl-white); font-size: 20px; overflow-wrap: anywhere; }
.sl-form-card { padding: 40px; background: var(--sl-ink-2); border: 3px solid var(--sl-yellow); }
.sl-form-card > * + * { margin-block-start: 16px; }

/* ---------- cookie notice (inc/privacy.php + parts/cookie-banner.html) ---------- */
.sl-cookie { position: fixed; left: var(--wp--custom--gutter); bottom: 24px; z-index: 45; width: min(440px, calc(100vw - 2 * var(--wp--custom--gutter))); animation: sl-cookie-in .5s var(--sl-ease) .6s both; }
.sl-cookie[hidden] { display: none; }
.sl-cookie__card { position: relative; padding: 26px 26px 22px; background: var(--sl-ink-2); color: var(--sl-paper); border: 3px solid var(--sl-yellow); box-shadow: 6px 6px 0 var(--sl-red); rotate: -1deg; --sl-heading: var(--sl-white); --sl-focus: var(--sl-yellow); }
.sl-cookie__card::before { content: ""; position: absolute; top: -12px; left: 50%; width: 84px; height: 24px; translate: -50% 0; rotate: -4deg; background: rgba(255, 210, 63, .85); box-shadow: 0 1px 2px rgba(0, 0, 0, .3); }
.sl-cookie__card > * + * { margin-block-start: 12px; }
.sl-cookie__card .is-style-tag { font-size: 24px; }
.sl-cookie__card p:not([class]) { font-size: 15px; line-height: 1.5; color: var(--sl-paper-dim); }
.sl-cookie__actions { gap: 12px 20px; margin-top: 18px !important; }
.sl-cookie__actions > * { margin: 0 !important; }
.sl-cookie__ok .wp-block-button__link { min-height: 48px; padding: 0 22px; font-size: 14px; cursor: pointer; }
.sl-cookie .sl-link-arrow a { min-height: 40px; font-size: 13px; color: var(--sl-white); }
@keyframes sl-cookie-in { from { opacity: 0; translate: 0 24px; } to { opacity: 1; translate: 0 0; } }
@media (prefers-reduced-motion: reduce) { .sl-cookie { animation: none; } }
@media (max-width: 720px) { .sl-cookie { bottom: 12px; } .sl-cookie__card { rotate: 0deg; padding: 22px 18px 18px; } }

/* placeholders still waiting for real data: visible on purpose */
.sl-todo { padding: 2px 8px; background: var(--sl-yellow); color: var(--sl-ink); font-weight: 800; }
.sl-prose > * + * { margin-block-start: 1.2em; }
.sl-prose h2 { font-size: var(--wp--preset--font-size--display-s); margin-block-start: 1.6em; }
.sl-prose a { color: inherit; text-decoration-color: var(--sl-yellow); text-decoration-thickness: 2px; }
/* questions (FAQ) and sub-headings inside news: plain bold text, lighter than the poster titles */
.sl-prose h3 { margin-block-start: 1.6em; font-family: var(--wp--preset--font-family--body); font-size: 20px; font-weight: 800; line-height: 1.35; letter-spacing: 0; text-transform: none; }
.sl-prose h3 + p { margin-block-start: .4em; }
/* news photos are mostly vertical (Instagram): keep faces and murals inside the crop */
.wp-block-post-featured-image img { object-position: 50% 25%; }

/* ---------- motion (only with JS, off for reduced motion) ---------- */
/* Reveal is a keyframe animation on transform/opacity, so it never overrides component transitions. */
.js .sl-reveal { opacity: 0; }
.js .sl-reveal.is-in { animation: sl-reveal .7s var(--sl-ease) var(--sl-d, 0s) both; }
.js .sl-hero__title mark { clip-path: polygon(-10% -30%, -10% -30%, -10% 140%, -10% 140%); animation: sl-spray 1s .45s var(--sl-ease) forwards; }
.js .sl-hero__title mark::after { clip-path: inset(0 100% 0 0); animation: sl-draw 1s 1.35s var(--sl-ease) forwards; }
@keyframes sl-reveal { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
@keyframes sl-spray { to { clip-path: polygon(-10% -30%, 110% -30%, 110% 140%, -10% 140%); } }
@keyframes sl-draw { to { clip-path: inset(0 0 0 0); } }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.sl-marquee { animation: none; }
	.js .sl-reveal, .js .sl-reveal.is-in { opacity: 1; animation: none; }
	.js .sl-hero__title mark, .js .sl-hero__title mark::after { clip-path: none; animation: none; }
	.is-style-poster, .is-style-poster-tape, .sl-partner, .sl-join, .sl-service { transition: none; }
}

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
	.sl-hero__tag { display: none; }
}
@media (max-width: 1024px) {
	:root { --sl-section: 96px; }
	.sl-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sl-grid-3 { gap: 20px; }
	.sl-hero__place { display: none; }
	.sl-motion-toggle { top: auto; bottom: 84px; }
	.sl-donate-photo { justify-self: start; }
	.sl-instagram #sb_instagram #sbi_images { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 781px) {
	/* core columns stack here: give stacked columns breathing room */
	.sl-split, .sl-murals, .sl-feature, .sl-newsletter, .sl-foot-cols { gap: 40px; }
	/* stacked footer: links flow in rows instead of one long column */
	.sl-footer-inner { padding-top: 56px; }
	.sl-newsletter { gap: 20px; }
	.sl-newsletter p { font-size: 16px; }
	.sl-foot-cols { gap: 28px; margin-top: 40px !important; }
	.sl-foot-list, .sl-foot-list--split { display: flex; flex-flow: row wrap; gap: 6px 20px; }
	.sl-wordmark { margin-top: 32px !important; }
}
@media (max-width: 720px) {
	:root { --sl-section: 80px; }
	.sl-hero { min-height: 760px; }
	.sl-hero__media { grid-template-columns: minmax(0, 1fr); }
	.sl-hero__media > :not(:first-child) { display: none; }
	.sl-hero__content { padding-top: 140px; padding-bottom: 120px; }
	/* icon only on phones, the label stays for screen readers */
	.sl-motion-toggle { width: 40px; padding: 0; justify-content: center; }
	.sl-motion-toggle__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
	.sl-brand__name span { display: none; }
	.sl-brand { gap: 8px; }
	.sl-brand .wp-block-site-logo img { width: 42px; height: 42px; }
	.sl-brand__name strong { font-size: 24px; }
	.sl-header__actions { gap: 8px; }
	.sl-donate-top .wp-block-button__link { min-height: 44px; padding: 0 12px; font-size: 13px; }
	.sl-nav-mobile .wp-block-navigation__responsive-container-open { width: 44px; height: 44px; }
	.wp-block-button__link { white-space: normal; text-align: center; }
	.sl-tapes { --dy: 30px; height: 170px; margin-top: -60px !important; }
	.sl-marquee { font-size: 22px; }
	.is-style-torn { --torn-h: 22px; }
	.sl-collage { min-height: 420px; }
	.sl-stats { grid-template-columns: minmax(0, 1fr); gap: 28px; margin-top: 56px !important; }
	.sl-stat__num { font-size: 76px; }
	.sl-grid-2, .sl-grid-3 { grid-template-columns: minmax(0, 1fr); }
	.sl-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
	.sl-grid-4.sl-stack-mobile { grid-template-columns: minmax(0, 1fr); }
	.sl-event h3 { font-size: 22px; }
	.sl-join img { aspect-ratio: 4 / 3; }
	.sl-service__body { padding: 14px; }
	.sl-service h3 { font-size: 20px; overflow-wrap: break-word; }
	.sl-feature, .sl-newsletter, .sl-donate-box { padding: 24px; }
	.sl-copy__value { font-size: 18px; }
	.sl-newsletter .fluentform fieldset { grid-template-columns: minmax(0, 1fr); }
	.sl-newsletter .fluentform fieldset > .ff_submit_btn_wrapper { grid-column: 1; grid-row: 3; }
	.sl-newsletter .fluentform .ff-btn-submit { width: 100%; }
	.sl-partners { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 16px; }
	.sl-partner.wp-block-image, .sl-partner--cta { aspect-ratio: 4 / 3; }
	.sl-partner.wp-block-image img { inset: 18px; width: calc(100% - 36px); height: calc(100% - 36px) !important; }
	.sl-instagram #sb_instagram #sbi_images { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sl-overlay__nav .wp-block-navigation-item__content { font-size: 44px; }
	.sl-page-head { padding-top: 150px; padding-bottom: 48px; }
	.sl-timeline__item { grid-template-columns: minmax(0, 1fr); padding-left: 24px; }
	.sl-timeline__item > :not(.sl-timeline__year) { grid-column: 1; }
	.sl-timeline__year { grid-row: auto; font-size: 32px; }
	.sl-row + .sl-row, .sl-event-block + .sl-event-block { margin-top: 56px !important; }
	.sl-form-card { padding: 24px; }
}
@media (max-width: 380px) {
	.sl-brand { gap: 6px; }
	.sl-brand .wp-block-site-logo img { width: 36px; height: 36px; }
	.sl-brand__name strong { font-size: 20px; }
	.sl-header__actions { gap: 6px; }
	.sl-donate-top .wp-block-button__link { padding: 0 10px; font-size: 12px; }
}