/* ============================================================
   GRASSHOPPER COURSE membership layer — paywall states, PMPro
   form skinning, library grid, pricing cards. Loads after site.
   ============================================================ */

/* ============ LOCK CHIP (inline span gc-lock) ============ */
.gc-lock {
	display: inline-block;
	font-family: var(--gc-font-mono);
	font-size: 9.5px;
	letter-spacing: var(--gc-track-label);
	text-transform: uppercase;
	color: var(--gc-grey-soft);
	border: 1px solid var(--gc-hairline-strong);
	border-radius: var(--gc-r-blade);
	padding: 3px 10px;
	margin-left: 12px;
	vertical-align: middle;
}
.gc-lock.is-free { color: var(--gc-leaf-deep); border-color: rgba(76, 97, 31, .45); }

/* ============ PAYWALL CARD (PMPro restricted-content message) ============ */
.gc-paywall {
	background: var(--gc-gloss);
	background-image: var(--gc-dots);
	border: 1px solid var(--gc-hairline-strong);
	border-radius: var(--gc-r-node);
	padding: clamp(28px, 4vw, 48px);
	text-align: center;
	position: relative;
	overflow: hidden;
	overflow: clip;
	margin-top: 34px;
}
.gc-paywall::before { /* wire running into a closed socket */
	content: "";
	position: absolute;
	left: 0; right: 55%; top: 26px;
	height: 24px;
	border-bottom: 2px solid var(--gc-hairline-strong);
	border-bottom-right-radius: 100% 100%;
	pointer-events: none;
}
.gc-paywall::after {
	content: "";
	position: absolute;
	right: calc(55% - 5px); top: 44px;
	width: 10px; height: 10px;
	border-radius: 999px;
	background: var(--gc-leaf);
	box-shadow: 0 0 0 4px rgba(120, 148, 63, .2);
	pointer-events: none;
}
.gc-paywall h3 { margin: 6px 0 0; font-size: clamp(1.3rem, 2.4vw, 1.7rem); }
.gc-paywall p { max-width: 46ch; margin: 14px auto 0; color: var(--gc-grey); }
.gc-paywall .wp-block-buttons, .gc-paywall .gc-paywall-actions { margin-top: 26px; display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.gc-paywall .gc-paywall-meta {
	font-family: var(--gc-font-mono);
	font-size: 10.5px;
	letter-spacing: var(--gc-track-label);
	text-transform: uppercase;
	color: var(--gc-grey-soft);
	margin-top: 22px;
}
.gc-paywall a.gc-btn, .gc-paywall a.gc-btn-outline { text-decoration: none; }

/* generic gc buttons for non-block contexts (paywall, PMPro templates) */
a.gc-btn, .gc-btn {
	display: inline-block;
	font-family: var(--gc-font-sans);
	font-size: 14.5px;
	letter-spacing: .04em;
	background: var(--gc-ink);
	color: var(--gc-paper) !important;
	border-radius: var(--gc-r-blade) var(--gc-r-blade) var(--gc-r-blade) 26px;
	padding: 14px 30px;
	transition: background var(--gc-speed) var(--gc-ease), transform var(--gc-speed) var(--gc-ease);
}
a.gc-btn:hover, .gc-btn:hover { background: var(--gc-leaf-deep); color: #fff !important; transform: translateY(-2px); }
a.gc-btn-outline, .gc-btn-outline {
	display: inline-block;
	font-family: var(--gc-font-sans);
	font-size: 14.5px;
	background: rgba(255, 255, 255, .5);
	border: 2px solid rgba(23, 24, 18, .6);
	color: var(--gc-ink) !important;
	font-weight: 500;
	border-radius: 26px var(--gc-r-blade) var(--gc-r-blade) var(--gc-r-blade);
	padding: 12px 28px;
	transition: border-color var(--gc-speed) var(--gc-ease), background var(--gc-speed) var(--gc-ease);
}
a.gc-btn-outline:hover { border-color: var(--gc-leaf-deep); background: rgba(120, 148, 63, .12); }

/* ============ SINGLE TUTORIAL scaffolding ============ */
.gc-post-meta {
	font-family: var(--gc-font-mono);
	font-size: 11px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--gc-grey-soft);
	margin-top: 10px;
}
.gc-post-nav { display: flex; justify-content: space-between; gap: 20px; margin-top: 56px; }

/* ============ PMPro FORM SKINNING (v3 frontend classes) ============ */
.pmpro_form, #pmpro_form, .pmpro_card {
	font-family: var(--gc-font-sans);
}
.pmpro_card {
	background: var(--gc-surface-gloss);
	border: 1px solid var(--gc-hairline);
	border-radius: var(--gc-r-node);
	box-shadow: var(--gc-sheen), 0 22px 40px -34px rgba(23, 24, 18, .5);
}
.pmpro_card_content h2, .pmpro_card h2, .pmpro_form legend {
	font-family: var(--gc-font-sans);
	font-weight: 500;
	letter-spacing: -.015em;
}
.pmpro_form input[type="text"], .pmpro_form input[type="email"], .pmpro_form input[type="password"],
.pmpro_form input[type="number"], .pmpro_form input[type="tel"], .pmpro_form select, .pmpro_form textarea,
#loginform input[type="text"], #loginform input[type="password"] {
	border: 1px solid var(--gc-hairline-strong);
	border-radius: 14px;
	padding: 12px 16px;
	font-family: var(--gc-font-sans);
	font-size: 15px;
	background: var(--gc-gloss);
	width: 100%;
	max-width: 480px;
}
.pmpro_form input:focus, #loginform input:focus { outline: 2px solid rgba(120, 148, 63, .5); border-color: var(--gc-leaf); }
.pmpro_form label, #loginform label {
	font-family: var(--gc-font-mono);
	font-size: 10.5px;
	letter-spacing: var(--gc-track-label);
	text-transform: uppercase;
	color: var(--gc-grey);
	display: block;
	margin-bottom: 6px;
}
.pmpro_btn:not(.pmpro_btn-plain), .pmpro_form .pmpro_btn:not(.pmpro_btn-plain),
input.pmpro_btn:not(.pmpro_btn-plain), button.pmpro_btn:not(.pmpro_btn-plain),
.pmpro_btn-submit, .pmpro_btn-submit-checkout, #wp-submit {
	font-family: var(--gc-font-sans) !important;
	font-size: 14.5px !important;
	letter-spacing: .04em;
	background: var(--gc-ink) !important;
	color: var(--gc-paper) !important;
	border: 0 !important;
	border-radius: var(--gc-r-blade) var(--gc-r-blade) var(--gc-r-blade) 26px !important;
	padding: 15px 34px !important;
	cursor: pointer;
	transition: background var(--gc-speed) var(--gc-ease), transform var(--gc-speed) var(--gc-ease);
}
.pmpro_btn:hover, #wp-submit:hover { background: var(--gc-leaf-deep) !important; transform: translateY(-2px); }
.pmpro_levels_table, .pmpro_level { border: 0; }
.pmpro_spacer { height: 20px; }
/* checkout level costs read as mono spec text */
.pmpro_level_cost_text, .pmpro_checkout_level_cost, .pmpro_price_details {
	font-family: var(--gc-font-mono);
	font-size: 13px;
	color: var(--gc-grey);
}
.pmpro_message, .pmpro_error, .pmpro_success, .pmpro_alert {
	border-radius: var(--gc-r-node);
	border: 1px solid var(--gc-hairline-strong);
	background: var(--gc-leaf-pale);
	padding: 16px 22px;
	font-size: 14.5px;
}
.pmpro_error { background: #f3e3df; border-color: rgba(140, 60, 40, .4); }

/* Plain/toggle buttons (Show Password, etc.) are inline controls, not calls to
   action — the primary-button treatment turns them into 210px dark slabs that
   collide with the fields beside them. */
.pmpro_btn-plain, button.pmpro_btn-plain, .pmpro_btn-password-toggle {
	background: transparent !important;
	color: var(--gc-grey) !important;
	border: 1px solid var(--gc-hairline-strong) !important;
	border-radius: var(--gc-r-blade) !important;
	padding: 6px 14px !important;
	font-family: var(--gc-font-mono) !important;
	font-size: 10.5px !important;
	letter-spacing: var(--gc-track-label);
	text-transform: uppercase;
	transform: none !important;
}
.pmpro_btn-plain:hover, .pmpro_btn-password-toggle:hover {
	background: rgba(120, 148, 63, .12) !important;
	color: var(--gc-ink) !important;
	transform: none !important;
}

/* ============ PRICING CARDS (Group class gc-price) ============ */
.gc-price {
	background: var(--gc-surface-gloss);
	border: 1px solid var(--gc-hairline-strong);
	border-radius: var(--gc-r-node);
	box-shadow: var(--gc-sheen), 0 22px 40px -32px rgba(23, 24, 18, .5);
	padding: clamp(26px, 3vw, 40px);
	position: relative;
	transition: transform var(--gc-speed) var(--gc-ease), box-shadow var(--gc-speed) var(--gc-ease), border-color var(--gc-speed) var(--gc-ease);
}
.gc-price:hover { transform: translateY(-4px); box-shadow: var(--gc-shadow-hover); border-color: rgba(76, 97, 31, .55); }
.gc-price .gc-price-amount {
	font-family: var(--gc-font-mono) !important;
	font-size: clamp(2.2rem, 4vw, 3rem) !important;
	line-height: 1 !important;
	margin: 10px 0 0 !important;
	color: var(--gc-ink);
	/* a price must never break across lines ("£19" / "0") */
	white-space: nowrap;
}
/* narrow columns must not hyphenate feature copy mid-word */
.gc-price li, .gc-price p { overflow-wrap: normal; hyphens: none; }
.gc-price .gc-price-amount small { font-size: .38em; color: var(--gc-grey-soft); letter-spacing: .08em; }
.gc-price.gc-price-featured { border-color: rgba(76, 97, 31, .6); }
.gc-price.gc-price-featured::before {
	content: "BEST VALUE";
	position: absolute;
	top: -11px; left: 26px;
	font-family: var(--gc-font-mono);
	font-size: 9px;
	letter-spacing: .18em;
	background: var(--gc-leaf-deep);
	color: #fff;
	border-radius: 999px;
	padding: 4px 12px;
}
.gc-price ul { padding-left: 1.1em; margin-top: 18px; }
.gc-price li { margin: .45em 0; font-size: 14.5px; }

/* ============ PMPRO WRAPPER SUPPRESSION ============ */
/* PMPro wraps the restricted-content message in its own card with a
   "Membership Required" title + lock icon. Our gc-paywall card already
   carries that message in the site's own language, so strip the outer
   chrome and let ours stand alone. Degrades harmlessly without :has(). */
.pmpro_content_message:has(.gc-paywall) {
	background: none;
	border: 0;
	box-shadow: none;
	padding: 0;
}
.pmpro_content_message:has(.gc-paywall) > .pmpro_card_title { display: none; }
.pmpro_content_message:has(.gc-paywall) .pmpro_card_content { padding: 0; }

/* ============ RESPONSIVE ============ */
@media (max-width: 781px) {
	.gc-paywall::before, .gc-paywall::after { display: none; }
	.gc-post-nav { flex-direction: column; }
}