/*
Theme Name: Aimee Goes Rogue
Theme URI: https://aimeegoesrogue.com
Author: Aimee Rogers
Author URI: https://aimeegoesrogue.com
Description: A block theme for Aimee Goes Rogue, a freelance games writing portfolio. White and mint with deep teal, torn-edge photographic heroes, Nunito headings and a Caveat handwritten flourish. Built from Aimee's own mockups. Every page is ordinary blocks, so text and images are changed by clicking.
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 7.4
Version: 2.0.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: aimee-goes-rogue
Tags: blog, portfolio, one-column, two-columns, block-patterns, full-site-editing, custom-colors, custom-logo, custom-menu, editor-style, featured-images, threaded-comments, translation-ready
*/

/* ---------------------------------------------------------------------------
   Colours, fonts, spacing and block defaults all live in theme.json, which is
   what lets the Site Editor show them as controls. This file holds the pieces
   theme.json cannot express: the torn hero edge, card and badge layout, the
   filter pills, the timeline, the sidebar and the blog article styles.
   --------------------------------------------------------------------------- */

:root {
	--agr-line: #e4eeec;
	--agr-line-strong: #cfe6e2;
	--agr-radius: 12px;
	--agr-radius-lg: 16px;
}

body { overflow-wrap: break-word; }

/* Long single words in headings and figures should shrink or overflow,
   never break mid-word. */
:where(h1, h2, h3, .agr-stat__num, .agr-eyebrow) { overflow-wrap: normal; hyphens: none; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.skip-link:focus {
	background: #fff; color: var(--wp--preset--color--ink);
	padding: .75rem 1.25rem; z-index: 100000;
}


/* =========================================================================
   HEADER
   ========================================================================= */

.agr-header {
	position: relative;
	z-index: 20;
}

.agr-header .wp-block-site-logo img { height: auto; }

.agr-nav .wp-block-navigation-item__content {
	position: relative;
	padding-block: 4px;
}

.agr-nav .wp-block-navigation-item__content::after {
	content: "";
	position: absolute; left: 0; right: 0; bottom: -2px;
	height: 2px; border-radius: 2px;
	background: var(--wp--preset--color--teal);
	transform: scaleX(0); transform-origin: center;
	transition: transform .18s ease;
}

.agr-nav .current-menu-item > .wp-block-navigation-item__content::after,
.agr-nav .current_page_item > .wp-block-navigation-item__content::after,
.agr-nav .wp-block-navigation-item__content:hover::after { transform: scaleX(1); }

/* The pill button in the header sits tighter than a body button. */
.agr-header .wp-block-button__link { padding: .72rem 1.4rem; }


/* =========================================================================
   HERO  — photographic cover, scrim fading to the right, torn white edge
   ========================================================================= */

.agr-hero {
	position: relative;
	padding-block: clamp(3.25rem, 6vw, 5rem) clamp(4.5rem, 8vw, 6.5rem);
	overflow: hidden;
}

.agr-hero.is-short { padding-block: clamp(2.75rem, 5vw, 4rem) clamp(4rem, 7vw, 5.5rem); }

/* Fade the overlay out towards the right so the photograph shows through.
   The scrim stays at full strength across the left, where the headline sits,
   so the text always has solid ground under it. How dark that scrim is stays
   on the block's own "Overlay opacity" slider. */
.agr-hero > .wp-block-cover__background {
	-webkit-mask-image: linear-gradient(90deg, #000 0%, #000 58%, rgba(0,0,0,.5) 76%, transparent 96%);
	mask-image: linear-gradient(90deg, #000 0%, #000 58%, rgba(0,0,0,.5) 76%, transparent 96%);
}

/* The torn paper edge along the bottom. */
.agr-hero::after {
	content: "";
	position: absolute; left: 0; right: 0; bottom: -1px;
	height: clamp(20px, 2.6vw, 44px);
	background: url(assets/torn-edge.svg) no-repeat center bottom / 100% 100%;
	z-index: 3;
	pointer-events: none;
}

/* Line the headline up with the left edge of the content below it, whatever
   width setting the inner group happens to carry. */
.agr-hero > .wp-block-cover__inner-container {
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
}

.wp-block-cover.agr-hero .agr-hero__copy {
	max-width: 34rem;
	margin-inline: 0 auto;
	text-align: left;
}

.agr-hero :where(h1, h2, p, li) { color: #fff; }
.agr-hero .agr-eyebrow { color: rgba(255,255,255,.82); }
.agr-hero p:not(.agr-eyebrow) { color: rgba(255,255,255,.88); }

/* The second line of a hero headline, picked out in aqua. */
.agr-hero .has-aqua-color { color: var(--wp--preset--color--aqua) !important; }

/* The pale button used on the homepage hero. */
.is-style-agr-aqua .wp-block-button__link,
.wp-block-button.is-style-agr-aqua .wp-block-button__link {
	background: var(--wp--preset--color--aqua);
	border-color: var(--wp--preset--color--aqua);
	color: var(--wp--preset--color--ink);
}
.wp-block-button.is-style-agr-aqua .wp-block-button__link:hover {
	background: #fff; border-color: #fff; color: var(--wp--preset--color--ink);
}

/* A plain underlined link sitting beside a button in a hero. */
.agr-hero .agr-readmore a {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 6px;
	text-decoration-thickness: 2px;
}

.agr-hero .wp-block-button.is-style-outline .wp-block-button__link {
	color: #fff;
	border-color: rgba(255,255,255,.65);
	background: transparent;
}
.agr-hero .wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: #fff; color: var(--wp--preset--color--ink); border-color: #fff;
}


/* =========================================================================
   SECTION HEADINGS  — title, a rule that grows, a small label at the far end
   ========================================================================= */

.agr-eyebrow {
	font-size: .78rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .14em;
	color: var(--wp--preset--color--teal);
	margin: 0;
}

.agr-sectionhead { align-items: center; }
.agr-sectionhead .wp-block-separator {
	flex: 1 1 3rem;
	min-width: 2rem;
	border: 0;
	border-top: 1px solid var(--agr-line-strong);
	opacity: 1;
	margin: 0;
	align-self: center;
}
.agr-sectionhead h2 { margin: 0; }
.agr-sectionhead .agr-eyebrow { white-space: nowrap; }

@media (max-width: 700px) {
	.agr-sectionhead .wp-block-separator { display: none; }
}


/* =========================================================================
   CARDS  — used for blog posts, portfolio pieces and recent articles
   ========================================================================= */

.agr-card {
	background: #fff;
	border: 1px solid var(--agr-line);
	border-radius: var(--agr-radius);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: 0 1px 2px rgba(15,23,34,.05);
	transition: transform .2s ease, box-shadow .2s ease;
	height: 100%;
}

.agr-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 14px 32px rgba(15,23,34,.12);
}

.agr-card__media { position: relative; margin: 0; line-height: 0; }

.agr-card__media .wp-block-post-featured-image { margin: 0; }

.agr-card__media img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 0;
	display: block;
}

/* The category chip sitting on the image. */
.agr-card__media .wp-block-post-terms {
	position: absolute;
	top: 12px; left: 12px;
	margin: 0;
	background: rgba(255,255,255,.95);
	color: var(--wp--preset--color--ink);
	padding: .34rem .7rem;
	border-radius: 7px;
	font-size: .68rem;
	line-height: 1.3;
	box-shadow: 0 1px 3px rgba(15,23,34,.18);
}
.agr-card__media .wp-block-post-terms a { color: inherit; text-decoration: none; }

/* WordPress's constrained layout puts `margin-inline: auto` on child blocks.
   Inside these column-flex components that centres them, so it is reset here. */
.agr-card__body > *,
.agr-card__media > *,
.agr-minicard > *,
.agr-timeline__row > * {
	margin-left: 0;
	margin-right: 0;
	max-width: none;
}

.agr-card__body {
	padding: 1.15rem 1.3rem 1.4rem;
	display: flex;
	flex-direction: column;
	gap: .6rem;
	flex: 1;
}

.agr-card__body .wp-block-post-title { margin: 0; }
.agr-card__body .wp-block-post-excerpt { margin: 0; }
.agr-card__body .wp-block-post-excerpt__more-text { display: none; }

/* Date / read-time line, pushed to the bottom of the card. */
.agr-card__meta {
	margin-top: auto;
	padding-top: .3rem;
	display: flex;
	gap: .6rem;
	align-items: center;
	flex-wrap: wrap;
}

.agr-readmore a,
.agr-readmore {
	font-size: .74rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .09em;
	color: var(--wp--preset--color--teal);
	text-decoration: none;
}
.agr-readmore a:hover { text-decoration: underline; }

.agr-card.is-plain {
	border: 0; box-shadow: none; background: transparent;
}
.agr-card.is-plain:hover { transform: none; box-shadow: none; }
.agr-card.is-plain /* WordPress's constrained layout puts `margin-inline: auto` on child blocks.
   Inside these column-flex components that centres them, so it is reset here. */
.agr-card__body > *,
.agr-card__media > *,
.agr-minicard > *,
.agr-timeline__row > * {
	margin-left: 0;
	margin-right: 0;
	max-width: none;
}

.agr-card__body { padding-inline: 0; padding-bottom: 0; }
.agr-card.is-plain .agr-card__media img { border-radius: var(--agr-radius); }


/* =========================================================================
   FILTER PILLS
   ========================================================================= */

.agr-pills { gap: .6rem !important; }

.agr-pills .wp-block-button__link {
	background: var(--wp--preset--color--mint-deep);
	border-color: var(--wp--preset--color--mint-deep);
	color: var(--wp--preset--color--teal);
	padding: .58rem 1.15rem;
	font-size: .78rem;
	letter-spacing: .02em;
	text-transform: none;
}

.agr-pills .wp-block-button__link:hover {
	background: var(--wp--preset--color--teal);
	border-color: var(--wp--preset--color--teal);
	color: #fff;
}

/* Added server-side to whichever pill matches the page being viewed. */
.agr-pills .wp-block-button.is-current .wp-block-button__link {
	background: var(--wp--preset--color--teal);
	border-color: var(--wp--preset--color--teal);
	color: #fff;
}

.agr-filterbar {
	background: var(--wp--preset--color--mint);
	border-radius: var(--agr-radius);
	padding: .85rem 1rem;
}

.agr-filterbar .wp-block-search__input {
	border: 1px solid var(--agr-line-strong);
	border-radius: 999px;
	padding: .55rem 1rem;
	background: #fff;
	font-size: .9rem;
	min-width: 12rem;
}
.agr-filterbar .wp-block-search__button {
	border-radius: 999px;
	padding: .55rem 1.2rem;
	font-size: .78rem;
}
.agr-filterbar .wp-block-search__label { display: none; }


/* =========================================================================
   PANELS, ICON CIRCLES, DIVIDED COLUMNS
   ========================================================================= */

.agr-panel {
	background: var(--wp--preset--color--mint);
	border-radius: var(--agr-radius-lg);
	padding: clamp(1.6rem, 3vw, 2.4rem);
}

.agr-panel.is-white {
	background: #fff;
	border: 1px solid var(--agr-line);
}

/* An image block turned into a round icon badge.

   The circle sizes itself around the image rather than caging it, so the
   Width setting in the block sidebar controls both. Set the image to 26px
   for a line icon, larger for a detailed illustration. */
.agr-ico,
.agr-ico-white {
	display: grid !important;
	place-items: center;
	width: max-content;
	min-width: 56px;
	min-height: 56px;
	aspect-ratio: 1;
	padding: 15px;
	border-radius: 50%;
	margin: 0;
	flex: none;
}
.agr-ico { background: var(--wp--preset--color--mint); }
.agr-ico-white { background: #fff; }

.agr-ico img,
.agr-ico-white img {
	width: 26px;
	height: auto;
	max-width: none;
	border-radius: 0;
	display: block;
}

/* Centre-aligned badges still centre, despite the margin reset above. */
.agr-ico.aligncenter,
.agr-ico-white.aligncenter { margin-inline: auto; }

/* Columns separated by hairlines, as in "Features / Reviews / Guides". */
.agr-divided .wp-block-column + .wp-block-column {
	border-left: 1px solid var(--agr-line-strong);
	padding-left: clamp(.75rem, 1.8vw, 1.5rem);
}
.agr-divided .wp-block-column { padding-right: clamp(0rem, 1vw, .75rem); min-width: 7rem; }

@media (max-width: 781px) {
	.agr-divided .wp-block-column + .wp-block-column {
		border-left: 0; border-top: 1px solid var(--agr-line-strong);
		padding-left: 0; padding-top: 1.5rem;
	}
}


/* =========================================================================
   STATS ROW
   ========================================================================= */

/* Stats laid out as a grid so they wrap rather than crush in a narrow column. */
.agr-statgrid > * + * { border-left: 1px solid var(--agr-line-strong); padding-left: 1rem; }
@media (max-width: 1100px) {
	.agr-statgrid > * + * { border-left: 0; padding-left: 0; }
}

.agr-stat { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; min-width: 0; }
.agr-stat > .wp-block-group { min-width: 0; flex: 1 1 6rem; }
.agr-stat__num {
	font-family: var(--wp--preset--font-family--nunito);
	font-weight: 800;
	font-size: clamp(1.05rem, 1.5vw, 1.45rem);
	line-height: 1.15;
	color: var(--wp--preset--color--ink);
	margin: 0;
	font-variant-numeric: tabular-nums;
}
.agr-stat__num.is-teal { color: var(--wp--preset--color--teal); }
.agr-stat__label { margin: 0; font-size: .84rem; line-height: 1.35; }


/* =========================================================================
   TIMELINE
   ========================================================================= */

.agr-timeline { position: relative; }

.agr-timeline .agr-timeline__row {
	position: relative;
	padding-left: 2.1rem;
	padding-bottom: 1.1rem;
	display: flex;
	gap: 1.1rem;
	align-items: baseline;
	flex-wrap: wrap;
}

.agr-timeline .agr-timeline__row::before {
	content: "";
	position: absolute; left: 0; top: .45em;
	width: 13px; height: 13px; border-radius: 50%;
	background: var(--wp--preset--color--teal);
	box-shadow: 0 0 0 3px #fff;
	z-index: 1;
}

.agr-timeline .agr-timeline__row::after {
	content: "";
	position: absolute; left: 6px; top: .45em;
	width: 1px; bottom: -.3rem;
	background: var(--agr-line-strong);
}

.agr-timeline .agr-timeline__row:last-child { padding-bottom: 0; }
.agr-timeline .agr-timeline__row:last-child::after { display: none; }

.agr-timeline__year {
	margin: 0;
	min-width: 4.5rem;
	font-weight: 800;
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--nunito);
}
.agr-timeline__text { margin: 0; flex: 1 1 14rem; }


/* =========================================================================
   BLOG SIDEBAR
   ========================================================================= */

.agr-widget {
	border: 1px solid var(--agr-line);
	border-radius: var(--agr-radius);
	padding: 1.25rem 1.35rem;
	background: #fff;
}
.agr-widget.is-mint { background: var(--wp--preset--color--mint); border-color: transparent; }
.agr-widget > :first-child { margin-top: 0; }

/* Icon above the newsletter heading, drawn in CSS so the template part stays
   free of hard-coded file paths. */
.agr-newsletter h2::before {
	content: "";
	display: block;
	width: 56px; height: 56px;
	margin: 0 auto .85rem;
	border-radius: 50%;
	background: #fff url(assets/icons/gamepad.svg) no-repeat center / 26px 26px;
}

/* The categories block, styled as a list of rows with counts. */
.agr-cats ul,
ul.agr-cats { list-style: none; margin: 0; padding: 0; }

.agr-cats li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .6rem;
	padding: .5rem 0;
	border-bottom: 1px solid var(--agr-line);
	font-size: .92rem;
}
.agr-cats li:last-child { border-bottom: 0; }

.agr-cats li a {
	color: var(--wp--preset--color--ink);
	font-weight: 600;
	text-decoration: none;
	display: flex;
	align-items: center;
	gap: .55rem;
	flex: 1;
}
.agr-cats li a::before {
	content: "";
	width: 8px; height: 8px; border-radius: 2px;
	background: var(--wp--preset--color--teal);
	flex: none;
}
.agr-cats li a:hover { color: var(--wp--preset--color--teal); }

/* WordPress prints the count in parentheses; this pushes it to the right. */
.agr-cats li { color: var(--wp--preset--color--slate); font-variant-numeric: tabular-nums; }

/* Popular posts: small thumbnail beside two lines of text. */
.agr-minicard { display: flex; gap: .75rem; align-items: flex-start; }
.agr-minicard .wp-block-post-featured-image { flex: none; margin: 0; width: 66px; }
.agr-minicard .wp-block-post-featured-image img {
	width: 66px; height: 50px; object-fit: cover; border-radius: 7px;
}
.agr-minicard .wp-block-post-title {
	margin: 0; font-size: .88rem; line-height: 1.3; font-weight: 700;
}
.agr-minicard .wp-block-post-date { margin: .2rem 0 0; }


/* =========================================================================
   CALL TO ACTION BAND
   ========================================================================= */

.agr-cta {
	background: var(--wp--preset--color--mint);
	border-radius: var(--agr-radius-lg);
	padding: clamp(1.25rem, 2.5vw, 1.75rem) clamp(1.25rem, 3vw, 2.25rem);
	align-items: center;
}
.agr-cta h2, .agr-cta h3 { margin: 0; font-size: 1.35rem; }
.agr-cta p { margin: 0; }


/* =========================================================================
   HANDWRITTEN FLOURISH + THE PAPER QUOTE CARD
   ========================================================================= */

.agr-script {
	font-family: var(--wp--preset--font-family--caveat);
	font-size: clamp(1.5rem, 2.6vw, 2rem);
	line-height: 1.25;
	color: var(--wp--preset--color--teal);
	margin: 0;
}

.agr-note {
	background: #fbfaf7;
	border-radius: 4px;
	padding: 1.6rem 1.8rem;
	box-shadow: 0 2px 10px rgba(15,23,34,.08);
	position: relative;
}
.agr-note p {
	font-family: var(--wp--preset--font-family--caveat);
	font-size: 1.35rem;
	line-height: 1.45;
	color: #33403e;
	margin: 0;
}
.agr-note .agr-sign {
	font-size: 2rem;
	color: var(--wp--preset--color--ink);
	margin-top: .6rem;
}


/* =========================================================================
   FOOTER
   ========================================================================= */

.agr-footer { color: rgba(255,255,255,.75); }
.agr-footer a { color: #fff; text-decoration: none; font-weight: 600; }
.agr-footer a:hover { text-decoration: underline; }
/* One logo file serves both bars: knocked out to white against the dark footer. */
.agr-footer .wp-block-site-logo img {
	height: auto;
	filter: brightness(0) invert(1);
}

.agr-footer .wp-block-navigation { --wp--preset--color--ink: #fff; }
.agr-footer .wp-block-navigation a { color: #fff; }
.agr-footer .wp-block-page-list { gap: 1.4rem; }


/* =========================================================================
   THE BLOG ARTICLE  — the "easy blog CSS" for writing posts
   Write a post with ordinary blocks and it comes out looking like this.
   ========================================================================= */

.agr-article .wp-block-post-content {
	font-size: 1.075rem;
	line-height: 1.78;
}

.agr-article .wp-block-post-content > * + * { margin-top: 1.35rem; }

.agr-article .wp-block-post-content > h2 {
	margin-top: 2.75rem;
	margin-bottom: .25rem;
	font-size: 1.65rem;
}

.agr-article .wp-block-post-content > h3 {
	margin-top: 2rem;
	margin-bottom: .1rem;
	font-size: 1.3rem;
}

.agr-article .wp-block-post-content > h4 { margin-top: 1.7rem; margin-bottom: 0; }

.agr-article .wp-block-post-content :where(ul, ol) { padding-left: 1.3rem; }
.agr-article .wp-block-post-content :where(ul, ol) li + li { margin-top: .45rem; }
.agr-article .wp-block-post-content li::marker { color: var(--wp--preset--color--teal); }

.agr-article .wp-block-post-content .wp-block-image { margin-block: 2rem; }
.agr-article .wp-block-post-content figcaption { text-align: center; }

.agr-article .wp-block-post-content blockquote {
	background: var(--wp--preset--color--mint);
	border-left: 3px solid var(--wp--preset--color--teal);
	border-radius: 0 var(--agr-radius) var(--agr-radius) 0;
	padding: 1.25rem 1.5rem;
	margin-block: 2rem;
	font-style: normal;
}
.agr-article .wp-block-post-content blockquote p { font-size: 1.15rem; line-height: 1.55; }
.agr-article .wp-block-post-content blockquote cite {
	display: block; margin-top: .6rem; font-size: .85rem; font-style: normal;
	color: var(--wp--preset--color--slate);
}

.agr-article .wp-block-post-content .wp-block-pullquote {
	border: 0; padding: 1.5rem 0; margin-block: 2.5rem;
	border-top: 2px solid var(--wp--preset--color--mint-deep);
	border-bottom: 2px solid var(--wp--preset--color--mint-deep);
}
.agr-article .wp-block-post-content .wp-block-pullquote p {
	font-family: var(--wp--preset--font-family--nunito);
	font-weight: 800; font-size: 1.5rem; line-height: 1.3;
	color: var(--wp--preset--color--ink);
}

.agr-article .wp-block-post-content .wp-block-table { font-size: .95rem; }
.agr-article .wp-block-post-content .wp-block-table th {
	background: var(--wp--preset--color--mint); text-align: left;
}
.agr-article .wp-block-post-content .wp-block-table td,
.agr-article .wp-block-post-content .wp-block-table th {
	border-color: var(--agr-line); padding: .6rem .8rem;
}

.agr-article .wp-block-post-content a { text-decoration: underline; text-underline-offset: 2px; }

/* First paragraph of a post reads a touch larger, like a standfirst. */
.agr-article .wp-block-post-content > p:first-child {
	font-size: 1.18rem;
	line-height: 1.65;
	color: #3b444b;
}

.agr-article-meta { align-items: center; }

/* Share / tag row under a post. */
.agr-tags .wp-block-post-terms__separator { display: none; }
.agr-tags a {
	display: inline-block;
	background: var(--wp--preset--color--mint);
	color: var(--wp--preset--color--teal);
	padding: .3rem .75rem;
	border-radius: 999px;
	margin: 0 .35rem .45rem 0;
	font-size: .78rem;
	text-decoration: none;
}
.agr-tags a:hover { background: var(--wp--preset--color--teal); color: #fff; }


/* =========================================================================
   PAGINATION
   ========================================================================= */

.wp-block-query-pagination { gap: .4rem; }

.wp-block-query-pagination-numbers .page-numbers,
.wp-block-query-pagination-previous,
.wp-block-query-pagination-next {
	display: inline-grid;
	place-items: center;
	min-width: 2.3rem; height: 2.3rem;
	padding: 0 .6rem;
	border-radius: 999px;
	border: 1px solid var(--agr-line);
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	font-size: .9rem;
	font-weight: 700;
}

.wp-block-query-pagination-numbers .page-numbers:hover,
.wp-block-query-pagination-previous:hover,
.wp-block-query-pagination-next:hover {
	border-color: var(--wp--preset--color--teal);
	color: var(--wp--preset--color--teal);
	text-decoration: none;
}

.wp-block-query-pagination-numbers .page-numbers.current {
	background: var(--wp--preset--color--teal);
	border-color: var(--wp--preset--color--teal);
	color: #fff;
}
.wp-block-query-pagination-numbers .page-numbers.dots { border-color: transparent; }


/* =========================================================================
   SMALL SCREENS
   ========================================================================= */

@media (max-width: 781px) {
	.wp-block-cover.agr-hero .agr-hero__copy { max-width: none; }
	.agr-hero > .wp-block-cover__background {
		-webkit-mask-image: none; mask-image: none;
	}
	.agr-cta { text-align: left; }
	.agr-stat { gap: .7rem; }
}

@media (max-width: 600px) {
	.agr-filterbar { padding: .75rem; }
	.agr-filterbar .wp-block-search__input { min-width: 0; }
}


/* =========================================================================
   MOTION
   ========================================================================= */

@media (prefers-reduced-motion: reduce) {
	.agr-card,
	.agr-nav .wp-block-navigation-item__content::after,
	.wp-block-button__link { transition: none; }
	.agr-card:hover { transform: none; }
}