/*
Theme Name: Gv_Blog
Theme URI: https://www.greenvelope.com/
Author: Greenvelope
Author URI: https://www.greenvelope.com/
Description: WordPress block theme for the Greenvelope blog, ported pixel-for-pixel from the GV MCP and Code Figma design. Uses Brandon Grotesque (via Typekit) + Source Serif 4 typography on the Greenvelope green brand palette.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: gv-blog
Tags: blog, full-site-editing, block-theme, custom-colors, custom-menu, editor-style, featured-images, threaded-comments
*/

/* =========================================================================
   Self-hosted fonts
   Source Serif 4 is loaded as the Google Fonts variable font (opsz 8..60) in
   functions.php, matching greenvelope.com — do not re-declare a static cut
   here or it would override the variable font's optical sizing at headings.
   ========================================================================= */
@font-face {
    font-family: 'Source Serif 4';
    font-style: normal; font-weight: 300; font-display: swap;
    src: url('assets/fonts/SourceSerif4-300.woff2') format('woff2');
}


@font-face {
	font-family: 'Inter';
	font-style: normal; font-weight: 400; font-display: swap;
	src: url('assets/fonts/Inter-400.woff2') format('woff2');
}
@font-face {
	font-family: 'Inter';
	font-style: normal; font-weight: 500; font-display: swap;
	src: url('assets/fonts/Inter-500.woff2') format('woff2');
}

/* =========================================================================
   Resets — match the standalone mockup exactly. The mockup ships with
   border-box sizing + link color inheritance; without these the WP global
   stylesheet defaults add ~128px to any element that has both padding and
   min-height (e.g. .gv-hero becomes 462px instead of 334px) and recolors
   every untyped link to brand-primary with an underline.
   ========================================================================= */

a { color: inherit; text-decoration: none; }

/* =========================================================================
   WP block wrappers — make template-parts transparent to layout so the
   semantic <header>/<aside>/<footer> inside each part act as the direct
   grid/flex children, not the wrapper div WP inserts around them.
   ========================================================================= */
.wp-block-template-part,
.wp-site-blocks > .wp-block-template-part {
	display: contents;
}

/* Kill WP's default --wp--style--block-gap (24px) margins everywhere on
   the page. WP injects them via `:root :where(.is-layout-flow) > *` on
   nearly every container (wp-site-blocks, .gv-main, .wp-block-query, the
   <ul> post-template, each <li>, the .gv-post group) and we drive all
   spacing explicitly via flex `gap` or padding in this theme. */
.wp-site-blocks > *,
.is-layout-flow > *,
.is-layout-constrained > * {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}

/* Reset the browser default <figure> margin inside post cards — otherwise
   the first row of posts is pushed ~16px below the sidebar's first item. */
.gv-post .wp-block-post-featured-image,
.gv-post figure {
	margin: 0;
}

/* Reset the inner <p> margin inside the excerpt block (browser defaults
   16px top/bottom which makes cards taller than expected). */
.gv-post .wp-block-post-excerpt p {
	margin: 0;
}

/* Inside .gv-post we drive spacing with flex `gap`, so suppress any
   is-layout-flow margins WP injects between children. */
.gv-post.is-layout-flow > * + *,
.gv-post .is-layout-flow > * + * {
	margin-block-start: 0;
}

/* =========================================================================
   Header bar (logo + lang/login/signup)
   ========================================================================= */
.gv-header {
	border-bottom: 1px solid #ececed;
	padding: 16px 32px;
	position: sticky;
	top: 0;
	z-index: 100;
	background: #ffffff;
}
/* Keep the sticky header below the WP admin bar when logged in */
.admin-bar .gv-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .gv-header { top: 46px; } }
.gv-header__inner {
	max-width: 1280px; margin: 0 auto;
	display: flex; align-items: center; justify-content: space-between; gap: 32px;
}
.gv-logo { display: inline-block; line-height: 0; }

.gv-header__nav { display: flex; align-items: center; gap: 32px; }
.gv-header__lang { font-size: 14px; font-weight: 500; }

.gv-header__link {
	display: inline-block; 
	padding: 9px 17px;
	color: #333333;
	border: 1px solid #4ab37e; 
	border-radius: 4px;
	font-family: 'brandon-grotesque', 'Brandon Grotesque', 'Inter', sans-serif;
	font-size: 13px; 
	font-weight: bold;
	letter-spacing: 2.5px; 
	text-transform: uppercase;
	cursor: pointer; text-decoration: none;
}

/* =========================================================================
   Buttons
   ========================================================================= */
.gv-btn {
	display: inline-block; 
	padding: 9px 17px;
	background: #4ab37e; color: #ffffff;
	border: 1px solid #4ab37e; 
	border-radius: 4px;
	font-family: 'brandon-grotesque', 'Brandon Grotesque', 'Inter', sans-serif;
	font-size: 13px; 
	font-weight: bold;
	letter-spacing: 2.5px; 
	text-transform: uppercase;
	cursor: pointer; text-decoration: none;
}
.gv-btn:hover { background: #079455; border-color: #079455; color: #fff; }

/* =========================================================================
   Hero
   ========================================================================= */
.gv-hero {
	position: relative; padding: 32px;
	min-height: 334px; display: flex; align-items: center;
	color: #555555;
	background-size: cover; background-position: center;
	border-bottom: solid 1px #cfcfcf;
}
.gv-hero::before {
	content: ''; position: absolute; inset: 0;
	background: rgba(51, 51, 51, 0);
}
.gv-hero__inner { position: relative; max-width: 1280px; width: 100%; margin: 0 auto; }
.gv-hero__content { max-width: 660px; margin: 0 auto; text-align: center; }
.gv-hero__logo { display: block; height: 42px; width: auto; margin: 0 auto 16px; }
.gv-hero h1 {
	margin: 0 0 20px;
	font-family: 'Source Serif 4', Georgia, serif;
	font-size: 52px; font-weight: unset; line-height: 1.1;	
}
/* Subtitle below the title — matches the title color (inherits from .gv-hero) */
.gv-hero__subtitle {
	margin: 0;
	font-family: 'brandon-grotesque', 'Brandon Grotesque', 'Inter', sans-serif;
	font-weight: 400;
	font-size: 22px;
	line-height: 35px;
	text-transform: uppercase;
}
.gv-hero p { font-size: 18px; line-height: 1.5; }
.gv-hero__form {
	display: flex; gap: 8px; flex-wrap: wrap; align-items: flex-start;
	justify-content: center;
	margin-bottom: 12px;
}
.gv-hero__form input[type=email] {
	flex: 1 1 240px; min-width: 0; padding: 12px 14px;
	border: 1px solid #fff; border-radius: 4px;
	background: rgba(255,255,255,0.95); color: #333;
	font-family: inherit; font-size: 16px;
}
.gv-hero__form button { padding: 12px 18px; }
.gv-hero__privacy { font-size: 13px; opacity: 0.85; margin: 0; }
.gv-hero__privacy a { color: #fff; text-decoration: underline; }

/* =========================================================================
   Main layout (sidebar + post grid)
   ========================================================================= */
.gv-main {
	max-width: 1280px; margin: 0 auto;
	padding: 42px 32px 96px;
	display: grid; grid-template-columns: 280px 1fr; gap: 64px;
}

/* =========================================================================
   Sidebar
   ========================================================================= */
.gv-sidebar > * + * { margin-top: 48px; }
.gv-sidebar > .gv-socials { margin-top: 40px; }

.gv-search {
	display: flex; align-items: stretch;
	border: 1px solid #4ab37e; border-radius: 4px;
	padding: 4px; gap: 4px;
}
.gv-search input {
	flex: 1; min-width: 0; border: 0; padding: 8px 12px; font: inherit; background: transparent;
}
.gv-search input:focus { outline: none; }
.gv-search button {
	background: #4ab37e; color: #fff; border: 0; border-radius: 3px;
	padding: 0 12px; cursor: pointer;
	display: inline-flex; align-items: center; justify-content: center;
}
.gv-search button svg { width: 16px; height: 16px; display: block; }

.gv-cat-heading {
	font-family: 'brandon-grotesque', 'Brandon Grotesque', 'Inter', sans-serif;
	font-size: 18px; font-weight: 600;
	color: #4ab37e; margin: 0 0 12px;
	letter-spacing: 3px;
	text-transform: uppercase;
}
.gv-cat-tabs { display: flex; flex-direction: column; gap: 12px; }
.gv-cat-tab {
	font-family: 'brandon-grotesque', 'Brandon Grotesque', 'Inter', sans-serif;
	font-size: 18px; font-weight: 420; line-height: 24px;
	color: #333; padding-left: 16px;
	border-left: 2px solid transparent; margin: 0;
}
.gv-cat-tab.is-active { border-left-color: #4ab37e; color: #4ab37e; }
.gv-cat-tab.is-active a { color: #4ab37e; }
.gv-cat-tab a { color: inherit; text-decoration: none; }

.gv-sidebar-card {
	border: 1px solid #CFCFCF; border-radius: 8px;
	padding: 24px; background: #F8F8F8;
}
.gv-sidebar-card img {
	display: block; width: 100%; border-radius: 6px;
	aspect-ratio: 232 / 125; object-fit: cover;
	background: #f5f5f6; margin-bottom: 16px;
}
.gv-sidebar-card h4 {
	font-family: 'Source Serif 4', Georgia, serif;
	font-size: 24px; font-weight: 300; line-height: 1.27; margin: 0 0 12px;
}
.gv-sidebar-card p {
	margin: 0 0 16px; font-size: 16px; line-height: 1.5; color: #333333;
}

.gv-socials { display: flex; gap: 12px; list-style: none; padding: 0; margin: 0; }
.gv-socials li { display: flex; }
.gv-socials a {
	width: 36px; height: 36px;
	display: inline-flex; align-items: center; justify-content: center;
	background: #e9f7f1; color: #4ab37e;
	border-radius: 999px;
	transition: background 0.15s ease, color 0.15s ease;
}
.gv-socials a:hover { background: #4ab37e; color: #fff; }
.gv-socials i { font-size: 18px; line-height: 1; }

/* =========================================================================
   Post grid (rendered by core/query + core/post-template)
   ========================================================================= */
.gv-posts.wp-block-post-template,
.gv-posts {
	display: grid; grid-template-columns: repeat(2, 1fr); gap: 48px 64px;
	list-style: none; padding: 0; margin: 0;
}
.gv-post { display: flex; flex-direction: column; gap: 16px; list-style: none; align-self: start; }

/* Put the aspect-ratio + radius on the figure (parent) so both cards get
   the exact same height regardless of img intrinsic ratio. Let the img fill
   100% with object-fit: cover. */
.gv-post .wp-block-post-featured-image,
.gv-post figure {
	margin: 0;
	width: 100%;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: 12px;
	background: #f5f5f6;
}
.gv-post .wp-block-post-featured-image a,
.gv-post .wp-block-post-featured-image img,
.gv-post figure img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
}
.gv-post-cats {
	margin: 20px 0 0; font-size: 14px; font-weight: 500; color: #85888e;
}
.gv-post-cats a,
.gv-post-cats a:visited,
.gv-post-cats a:focus {
	color: #85888e !important;
	text-decoration: none !important;
}
.gv-post-cats a:first-of-type,
.gv-post-cats a:first-of-type:visited,
.gv-post-cats a:first-of-type:focus {
	color: #4ab37e !important;
}
.gv-post-cats a:hover { color: #079455 !important; }

.gv-post .wp-block-post-title {
	margin: 0;
	font-family: 'Source Serif 4', Georgia, serif;
	font-size: 24px; font-weight: 300; line-height: 1.33;
}
.gv-post .wp-block-post-title a,
.gv-post .wp-block-post-title a:visited,
.gv-post .wp-block-post-title a:focus {
	color: #333 !important;
	text-decoration: none !important;
}
.gv-post .wp-block-post-title a:hover { color: #079455 !important; }
.gv-post .wp-block-post-excerpt {
	margin: 0; font-size: 16px; color: #333333; font-weight: normal;
}
.gv-post .wp-block-post-excerpt__more-link,
.gv-post .wp-block-post-excerpt__excerpt + p { display: none; }

.gv-pagination {
	display: flex; align-items: center; justify-content: center; gap: 8px;
	margin-top: 48px;
	padding-top: 20px;
}
.gv-pagination a, .gv-pagination span {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 36px; height: 36px; padding: 0 8px;
	border: 1px solid #ececed; border-radius: 4px;
	font-size: 14px; color: #777; text-decoration: none;
}
.gv-pagination .current,
.gv-pagination .wp-block-query-pagination-numbers .current {
	background: #e9f7f1; color: #079455; border-color: #e9f7f1;
}

/* =========================================================================
   CTA: Make & Send Invitations + Testimonial card
   ========================================================================= */
.gv-cta-invitations { border-top: 1px solid #ececed; padding: 80px 32px; }
.gv-cta-invitations__inner {
	max-width: 1280px; margin: 0 auto;
	display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center;
}
.gv-cta-invitations h2 {
	margin: 0 0 24px;
	font-family: 'Source Serif 4', Georgia, serif;
	font-size: 48px; font-weight: 300; line-height: 1.1; letter-spacing: -0.02em;
}
.gv-check-list { list-style: none; padding: 0; margin: 0 0 24px; display: flex; flex-direction: column; gap: 12px; }
.gv-check-list li { position: relative; padding-left: 28px; font-size: 16px; }
.gv-check-list li::before { content: '✓'; position: absolute; left: 0; top: 0; color: #079455; font-weight: 700; }
.gv-cta-invitations__small { margin: 16px 0 0; font-size: 14px; color: #777; }

.gv-testimonial-card {
	position: relative; border-radius: 12px; overflow: hidden;
	aspect-ratio: 1 / 1; background: #f5f5f6;
}
.gv-testimonial-card__image-link {
	position: absolute; inset: 0; display: block;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.4s ease;
}
.gv-testimonial-card__image-link.is-active {
	opacity: 1;
	visibility: visible;
}
.gv-testimonial-card__image {
	width: 100%; height: 100%; object-fit: cover; display: block;
}
.gv-testimonial-card__overlay {
	position: absolute; left: 0; right: 0; bottom: 0;
	padding: 48px 32px 32px; color: #fff;
	background: linear-gradient(to top, rgba(7,148,85,0.95) 0%, rgba(7,148,85,0.85) 70%, rgba(7,148,85,0) 100%);
	display: grid;
}
/* Slider — stack each testimonial in the same grid cell so the overlay
   height is driven by the tallest slide; only the active slide is visible. */
.gv-testimonial-card__slide {
	grid-area: 1 / 1;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.4s ease;
	pointer-events: none;
}
.gv-testimonial-card__slide.is-active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}
.gv-testimonial-card__quote { font-size: 16px; line-height: 1.5; margin: 0 0 24px; }
.gv-testimonial-card__row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.gv-testimonial-card__author { font-size: 14px; font-weight: 500; margin: 0; }
.gv-testimonial-card__stars { font-size: 14px; opacity: 0.9; letter-spacing: 2px; margin: 4px 0 0; }
.gv-testimonial-card__nav { display: flex; gap: 8px; }
.gv-testimonial-card__nav button {
	width: 32px; height: 32px;
	border: 1px solid rgba(255,255,255,0.6); background: transparent; color: #fff;
	border-radius: 50%; cursor: pointer;
}

/* =========================================================================
   Newsletter panel
   ========================================================================= */
.gv-newsletter { padding: 64px 32px; }
.gv-newsletter__inner {
	max-width: 1280px; margin: 0 auto;
	background: #f5f5f6; border-radius: 16px; padding: 48px 64px;
	display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center;
}
.gv-newsletter h3 {
	font-family: 'Source Serif 4', Georgia, serif;
	font-size: 30px; font-weight: 300; line-height: 1.27;
	margin: 0 0 8px;
}
.gv-newsletter p { margin: 0; color: #777; font-size: 16px; }
.gv-newsletter__form { display: flex; gap: 12px; flex-wrap: wrap; }
.gv-newsletter__form input[type=email] {
	flex: 1 1 240px; min-width: 0; padding: 12px 14px;
	border: 1px solid #cecfd2; border-radius: 4px;
	background: #fff; font: inherit;
}
.gv-newsletter__disclaimer {
	margin-top: 12px; font-size: 14px; font-style: italic; color: #777; flex-basis: 100%;
}
.gv-newsletter__disclaimer a { font-style: italic; text-decoration: underline; color: inherit; }

/* =========================================================================
   Footer — ported from greenvelope.com main site
   ========================================================================= */
.gv-public-footer {
	background-color: #333333; color: #fff; padding: 15px 20px;
	position: relative; user-select: none;
}
.gv-public-footer .gv-content {
	align-items: baseline; display: flex; max-width:1280px; margin: auto;
}


.gv-public-footer .gv-content .logo .gv-logo a { display: inline-block; }
.gv-public-footer .gv-content .logo .gv-logo a picture img {
	display: inherit; position: relative; top: 3px;
}
.gv-public-footer .gv-content .links {
	align-items: center; display: flex; flex: 1 1 auto; flex-wrap: wrap; text-align: right;
}
.gv-public-footer .gv-content .links ol.link-group {
	display: inline-block; flex: 1 1 auto; list-style-type: none;
	margin: 0 10px; padding: 0; white-space: normal;
}
.gv-public-footer .gv-content .links ol.link-group.separator > li {
	border-left: 1px solid #fff; padding-left: 10px;
}
.gv-public-footer .gv-content .links ol.link-group.separator > li.first {
	border-left: 0; padding-left: 0;
}
.gv-public-footer .gv-content .links ol.link-group > li {
	display: inline-block; font-size: 18px; margin: 5px;
}
.gv-public-footer .gv-content .links ol.link-group > li > a {
	color: #fff; cursor: pointer; text-decoration: none;
}

.gv-public-footer li>a>i {
    font-size: 24px;
}

@media screen and (max-width: 767px), screen and (max-height: 450px) {
	.gv-public-footer .gv-content { display: block; }
	.gv-public-footer .gv-content .logo { display: block; text-align: center; }
	.gv-public-footer .gv-content .logo .gv-logo { margin-right: 0; }
	.gv-public-footer .gv-content .logo .gv-logo a { top: 0; }
	.gv-public-footer .gv-content .links {
		display: flex; flex-direction: column-reverse; margin-top: 15px; text-align: center;
	}
	.gv-public-footer .gv-content .links > ol.link-group { white-space: normal; }
	.gv-public-footer .gv-content .links > ol.link-group.separator > li {
		border-left: 0; padding-left: 0;
	}
}

/* =========================================================================
   Single post — article header (breadcrumb + title + byline)
   ========================================================================= */
.gv-article__header { text-align: center; }

.gv-article__title.wp-block-post-title {
	font-family: 'Source Serif 4', Georgia, serif;
	font-size: 40px; font-weight: 300;
	letter-spacing: -0.02em; color: #333333; margin: 0;
}

.gv-breadcrumb {
	font-family: 'brandon-grotesque', 'Brandon Grotesque', 'Inter', sans-serif;
	font-size: 16px; font-weight: 500; line-height: 24px;
	color: #777777; margin: 0; padding-bottom:10px;
}
.gv-breadcrumb a,
.gv-breadcrumb a:visited,
.gv-breadcrumb a:focus { color: #777777; text-decoration: none; padding: 0px 5px;}
.gv-breadcrumb a:first-child,
.gv-breadcrumb a:first-child:visited,
.gv-breadcrumb a:first-child:focus { color: #079455; }
.gv-breadcrumb a:hover { text-decoration: underline; }

.gv-byline {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
	gap: 12px 48px; margin: 18px 0 0;
	font-family: 'brandon-grotesque', 'Brandon Grotesque', 'Inter', sans-serif;
	font-size: 16px; line-height: 24px; padding-top: 12px;
}
.gv-byline__item { display: inline-flex; gap: 8px; }
.gv-byline__label { color: #777777; }
.gv-byline__value { color: #333333; font-weight: 500; }

/* Featured image (post thumbnail), centered + rounded */
.gv-featured { margin: 0 auto; max-width: 760px; }
.gv-featured.wp-block-post-featured-image { margin-bottom: 0; }
.gv-featured a,
.gv-featured.wp-block-post-featured-image a { display: block; line-height: 0; }
.gv-featured img,
.gv-featured.wp-block-post-featured-image img {
	display: block; width: 100%; height: auto;
	border-radius: 12px;
}

/* =========================================================================
   Single post — rich text body (post-content output)
   Re-enables vertical margins inside .gv-post-body that the global
   .is-layout-constrained > * !important rule above strips.
   ========================================================================= */
.gv-post-body { color: #333333; }
.gv-post-body > p,
.gv-post-body > h2,
.gv-post-body > h3,
.gv-post-body > h4,
.gv-post-body > ol,
.gv-post-body > ul,
.gv-post-body > blockquote,
.gv-post-body > figure,
.gv-post-body > hr {
	margin-block-start: 0 !important;
	margin-block-end: 20px !important;
}
.gv-post-body > p {
	font-family: 'brandon-grotesque', 'Brandon Grotesque', 'Inter', sans-serif;
	font-size: 20px; line-height: 28px; color: #333333;
}
.gv-post-body > p:first-of-type { font-size: 22px; line-height: 30px; }
.gv-post-body > h2 {
	font-family: 'Source Serif 4', Georgia, serif;
	font-size: 30px; line-height: 38px; font-weight: 300; color: #333333;
	margin-block-start: 40px !important;
	margin-block-end: 16px !important;
}
.gv-post-body > h3 {
	font-family: 'Source Serif 4', Georgia, serif;
	font-size: 24px; line-height: 32px; font-weight: 300; color: #333333;
	margin-block-start: 32px !important;
	margin-block-end: 12px !important;
}
.gv-post-body > h4 {
	font-family: 'Source Serif 4', Georgia, serif;
	font-size: 20px; line-height: 28px; font-weight: 300; color: #333333;
	margin-block-start: 24px !important;
	margin-block-end: 8px !important;
}
.gv-post-body > blockquote {
	font-family: 'Source Serif 4', Georgia, serif;
	font-style: italic; font-weight: 300; color: #333333;
	font-size: 24px; line-height: 36px;
	padding: 0; border: 0;
	margin-block-start: 32px !important;
	margin-block-end: 48px !important;
}
.gv-post-body > blockquote p { margin: 0 0 12px; font-size: inherit; line-height: inherit; font-family: inherit; }
.gv-post-body > blockquote cite { font-style: normal; font-size: 16px; color: #777; }
.gv-post-body > ol,
.gv-post-body > ul {
	font-family: 'brandon-grotesque', 'Brandon Grotesque', 'Inter', sans-serif;
	font-size: 20px; line-height: 28px; color: #333333;
	padding-left: 26px;
}
.gv-post-body > ol li,
.gv-post-body > ul li { margin-bottom: 12px; padding-left: 6px; }
.gv-post-body > hr {
	height: 1px; background: #ececed; border: 0;
	margin-block-start: 32px !important;
	margin-block-end: 32px !important;
}
.gv-post-body > figure.wp-block-image {
	margin-block-start: 48px !important;
	margin-block-end: 48px !important;
}
.gv-post-body > figure.wp-block-image img {
	display: block; width: 100%; height: auto; border-radius: 12px;
}
.gv-post-body > figure.wp-block-image figcaption {
	margin-top: 16px; text-align: center;
	font-size: 16px; line-height: 20px; color: #777777;
}
.gv-post-body > figure.wp-block-image figcaption a { text-decoration: underline; }
.gv-post-body a { color: inherit; text-decoration: underline; }
.gv-post-body a:hover { color: #079455; }

/* =========================================================================
   Single post — share row
   ========================================================================= */
.gv-share-row {
	display: flex; align-items: center; gap: 12px;
	padding-top: 32px; border-top: 1px solid #ececed;
}
.gv-share-row__spacer { flex: 1; }
.gv-share-copy {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 8px 16px; border: 1px solid #cecfd2; border-radius: 4px;
	font-family: 'brandon-grotesque', 'Brandon Grotesque', 'Inter', sans-serif;
	font-size: 13px; font-weight: 500; letter-spacing: 0.06em;
	color: #333333; background: #fff; cursor: pointer;
	transition: border-color .15s ease, color .15s ease;
}
.gv-share-copy:hover { border-color: #4ab37e; color: #4ab37e; }
.gv-share-copy svg { width: 16px; height: 16px; display: block; }
.gv-share-btn {
	width: 40px; height: 40px; border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center;
	border: 1px solid #cecfd2; background: #fff; color: #777777;
	transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.gv-share-btn:hover { background: #4ab37e; border-color: #4ab37e; color: #fff; }
.gv-share-btn svg { width: 18px; height: 18px; display: block; }

/* =========================================================================
   Single post — Related Resources grid
   ========================================================================= */
.gv-related { padding: 64px 32px 96px; }
.gv-related__inner { max-width: 1280px; margin: 0 auto; }
.gv-related__heading {
	font-family: 'Source Serif 4', Georgia, serif;
	font-size: 48px; line-height: 60px; font-weight: 300; letter-spacing: -0.02em;
	color: #333333; text-align: center; margin: 0 0 48px;
}
.gv-related__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.gv-related-card { display: flex; flex-direction: column; }
.gv-related-card__media { display: block; line-height: 0; }
.gv-related-card__image {
	display: block; width: 100%; aspect-ratio: 384 / 240;
	object-fit: cover; border-radius: 12px; background: #f5f5f6;
}
.gv-related-card__image--empty { background: #f5f5f6; }
.gv-related-card__title {
	margin: 20px 0 12px;
	font-family: 'brandon-grotesque', 'Brandon Grotesque', 'Inter', sans-serif;
	font-size: 22px; line-height: 30px; font-weight: 500; color: #333333;
}
.gv-related-card__title a,
.gv-related-card__title a:visited { color: inherit; text-decoration: none; }
.gv-related-card__title a:hover { color: #079455; }
.gv-related-card__link {
	display: inline-flex; align-items: center; gap: 6px;
	font-family: 'brandon-grotesque', 'Brandon Grotesque', 'Inter', sans-serif;
	font-size: 13px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase;
	color: #079455; text-decoration: none;
}
.gv-related-card__link:hover { text-decoration: underline; }

/* =========================================================================
   Single post — CTA: Ready to See the Difference
   ========================================================================= */
.gv-cta-difference { background: #f5f5f6; }
.gv-cta-difference__inner {
	max-width: 1280px; margin: 0 auto;
	display: grid; grid-template-columns: 1fr 1fr; align-items: stretch;
}
.gv-cta-difference__content { padding: 96px 64px 96px 32px; align-self: center; }
.gv-cta-difference__heading {
	font-family: 'Source Serif 4', Georgia, serif;
	font-size: 52px; line-height: 68px; font-weight: 300; letter-spacing: -0.04em;
	color: #333333; margin: 0 0 24px;
}
.gv-cta-difference__text {
	font-family: 'brandon-grotesque', 'Brandon Grotesque', 'Inter', sans-serif;
	font-size: 18px; line-height: 26px; color: #333333; margin: 0 0 16px;
}
.gv-cta-difference__text a { color: inherit; text-decoration: underline; }
.gv-cta-difference__actions { margin-top: 24px; }
.gv-cta-difference__media { position: relative; min-height: 530px; }
.gv-cta-difference__media img {
	position: absolute; inset: 0;
	width: 100%; object-fit: cover; padding-top: 20px;
}


.gv-compare-invite-banner-inner {
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 0;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px;
}

.gv-compare-invite-banner-copy {
    box-sizing: border-box;
    flex: 0 1 384px;
    max-width: 384px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
}

.gv-compare-invite-banner-title {
    margin: 0;
    max-width: 100%;
    font-family: "Source Serif 4", serif;
    font-size: 48px;
    font-weight: 300;
    line-height: 1.2;
    color: #333;
}

.gv-compare-invite-banner-copy-body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    max-width: 100%;
}

.gv-compare-invite-banner-lead, .gv-compare-invite-banner-sub {
    margin: 0;
    font-family: "brandon-grotesque", sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 30px;
    color: #333;
}

.gv-compare-invite-banner-sub {
    max-width: 340px;
}

.gv-compare-invite-banner-cta-wrap {
    margin: 0;
    padding-top: 16px;
}
.gv-compare-invite-banner-link {
    color: #333;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.gv-compare-invite-banner-cta-wrap .gv-button.sign-up {
    width: 125px;
}

.gv-button {
    background-color: #4ab37e;
    border: 1px solid rgba(0, 0, 0, 0);
    border-radius: 5px;
    color: #fff;
    display: inline-block;
    font-family: "brandon-grotesque";
    font-size: 18px;
    padding: 9px 25px;
    text-align: center;
    text-decoration: none;
    user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    white-space: nowrap;
}

/* =========================================================================
   Responsive
   ========================================================================= */
@media (max-width: 960px) {
	.gv-main { grid-template-columns: 1fr; }
	.gv-posts { grid-template-columns: 1fr; gap: 32px; }
	.gv-cta-invitations__inner, .gv-newsletter__inner { grid-template-columns: 1fr; gap: 32px; }
	.gv-newsletter__inner { padding: 32px; }
	.gv-hero h1 { font-size: 36px; }
	.gv-cta-invitations h2 { font-size: 36px; }

	/* single post */
	.gv-article__title.wp-block-post-title { font-size: 36px; line-height: 44px; }
	.gv-related__grid { grid-template-columns: 1fr; }
	.gv-cta-difference__inner { grid-template-columns: 1fr; }
	.gv-cta-difference__content { padding: 56px 32px; }
	.gv-cta-difference__heading { font-size: 36px; line-height: 44px; }
	.gv-cta-difference__media { min-height: 320px; }
}