/*
Theme Name: BCSV 2026
Version: 12.5.0
Description: Modern heritage theme for the Bus and Coach Society of Victoria (bcsv.org.au). A complete 2026 rebuild — archival transport aesthetic with a modern editorial layout. Install alongside the current theme for testing.
Author: MP Productions
Tags: heritage, responsive, transport, society
*/

/* ==========================================================================
   BCSV 2026 — complete stylesheet.
   This REPLACES the old Travelify stylesheet entirely: one file, no
   conflicting layers. Structure follows the theme's existing markup
   (#branding, #main-nav, #main, #primary, #secondary, #footerarea).

   CONTENTS
     1  Tokens
     2  Reset & base
     3  Typography
     4  Layout & wrappers
     5  Header / branding
     6  Navigation (destination blind)
     7  Hero slider
     8  Page title band
     9  Content & articles
    10  WordPress core classes
    11  Comments
    12  Pagination
    13  Widgets & sidebar
    14  Footer
    15  Forms & buttons
    16  Front page sections
    17  Plugin compatibility
    18  Icons (Genericons)
    19  Responsive
    20  Motion & accessibility
   ========================================================================== */

/* ==========================================================================
   1. TOKENS
   ========================================================================== */
:root {
	/* Heritage palette */
	--green:        #1d4034;   /* deep bottle green — primary */
	--green-dark:   #14302a;
	--green-deep:   #0e241f;   /* footer / blind */
	--green-light:  #2c5b4b;
	--brass:        #b0842f;   /* aged brass */
	--brass-light:  #cfa04a;
	--brass-dark:   #8f691f;
	--amber:        #f4b12b;   /* destination-blind amber */
	--maroon:       #7c2b3a;   /* heritage accent */

	/* Neutrals — warm paper */
	--paper:        #fffdf8;   /* cards */
	--surface:      #f4efe3;   /* page background */
	--surface-2:    #e9e0cd;   /* bands */
	--line:         #ddd2ba;
	--line-soft:    #ebe3d2;

	/* Ink */
	--ink:          #241f18;
	--ink-body:     #3c352c;
	--ink-soft:     #5d5548;
	--muted:        #857b6b;

	/* Type */
	--display: "Fraunces", Georgia, "Times New Roman", serif;
	--signage: "Oswald", "Arial Narrow", Arial, sans-serif;
	--body:    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	/* Scale */
	--step--1: clamp(0.86rem, 0.83rem + 0.14vw, 0.94rem);
	--step-0:  clamp(1rem, 0.96rem + 0.2vw, 1.12rem);
	--step-1:  clamp(1.2rem, 1.12rem + 0.4vw, 1.45rem);
	--step-2:  clamp(1.45rem, 1.3rem + 0.75vw, 1.95rem);
	--step-3:  clamp(1.75rem, 1.5rem + 1.25vw, 2.6rem);
	--step-4:  clamp(2.1rem, 1.7rem + 2vw, 3.4rem);

	/* Geometry */
	--radius:    10px;
	--radius-sm: 6px;
	--container: 1220px;
	--measure:   72ch;
	--nav-h:     56px;
	--gap:       clamp(1.5rem, 3vw, 2.5rem);

	/* Elevation */
	--shadow-sm: 0 1px 2px rgba(36,31,24,.05), 0 2px 8px rgba(36,31,24,.05);
	--shadow:    0 2px 4px rgba(36,31,24,.05), 0 10px 28px rgba(36,31,24,.09);
	--shadow-lg: 0 20px 56px rgba(36,31,24,.20);

	--ease: cubic-bezier(.2,.7,.3,1);
}

/* ==========================================================================
   2. RESET & BASE
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	/* anchor targets clear the sticky nav */
	scroll-padding-top: calc(var(--nav-h) + 1rem);
}

body {
	margin: 0;
	background: var(--surface);
	color: var(--ink-body);
	font-family: var(--body);
	font-size: var(--step-0);
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

/* neutralise the legacy custom-background image WordPress may inject */
body.custom-background { background-image: none !important; background-color: var(--surface) !important; }

h1,h2,h3,h4,h5,h6,p,blockquote,figure,ul,ol,dl,dd { margin: 0; }
ul,ol { padding: 0; list-style: none; }

img, picture, video, canvas, svg, iframe, embed, object {
	display: block; max-width: 100%; height: auto;
}

a { color: var(--green); text-decoration: none; }

button, input, select, textarea { font: inherit; color: inherit; }

table { border-collapse: collapse; width: 100%; }

hr { border: 0; height: 1px; background: var(--line); margin: 2.5rem 0; }

::selection { background: var(--amber); color: #241606; }

/* ==========================================================================
   3. TYPOGRAPHY
   ========================================================================== */
h1,h2,h3,h4,h5,h6 {
	font-family: var(--display);
	color: var(--green-dark);
	font-weight: 600;
	line-height: 1.15;
	letter-spacing: -.012em;
	text-wrap: balance;
}
h1 { font-size: var(--step-4); }
h2 { font-size: var(--step-3); }
h3 { font-size: var(--step-2); }
h4 { font-size: var(--step-1); }
h5,h6 { font-size: var(--step-0); }

p { margin: 0 0 1.15em; }
p:last-child { margin-bottom: 0; }

strong, b { font-weight: 650; color: var(--ink); }
em, i { font-style: italic; }
small { font-size: var(--step--1); }

code, pre, kbd, samp {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: .92em;
}
code { background: var(--surface-2); padding: .15em .4em; border-radius: 4px; }
pre {
	background: var(--green-deep); color: #f0e9d8; padding: 1.25rem 1.5rem;
	border-radius: var(--radius-sm); overflow-x: auto; margin: 0 0 1.5em;
}
pre code { background: none; padding: 0; color: inherit; }

/* Signage label — the uppercase condensed motif used throughout */
.eyebrow,
.bcsv-eyebrow {
	display: inline-block;
	font-family: var(--signage);
	font-weight: 500;
	font-size: .8rem;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--brass-dark);
}

/* ==========================================================================
   4. LAYOUT & WRAPPERS
   ========================================================================== */
.wrapper {
	max-width: none;
	width: auto;
	margin: 0;
	background: transparent;
	box-shadow: none;
	border-radius: 0;
}

.container {
	width: 100%;
	max-width: var(--container);
	margin-inline: auto;
	padding-inline: clamp(1rem, 4vw, 2rem);
}

#main {
	padding-block: clamp(2.25rem, 5vw, 3.75rem);
}

/* content + sidebar grid */
#container { width: 100%; }

#main #container {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--gap);
}
@media (min-width: 950px) {
	/* default: right sidebar */
	body:not(.no-sidebar-template):not(.one-column-template) #main #container:has(#secondary) {
		grid-template-columns: minmax(0, 1fr) 310px;
		align-items: start;
	}
	/* left sidebar variant */
	body.left-sidebar-template #main #container:has(#secondary) #primary { order: 2; }
	body.left-sidebar-template #main #container:has(#secondary) #secondary { order: 1; }
}
#primary { min-width: 0; }
#secondary { min-width: 0; }
@media (min-width: 950px) {
	#secondary { position: sticky; top: calc(var(--nav-h) + 1.5rem); }
}

/* no-sidebar / one-column reading width */
body.no-sidebar-template #primary,
body.one-column-template #primary,
body.no-sidebar-template #content,
body.one-column-template #content { margin: 0 auto; width: 100%; }

/* full-bleed helper */
.bcsv-fullbleed {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

.clearfix::after { content: ""; display: table; clear: both; }

/* ==========================================================================
   5. HEADER / BRANDING
   ========================================================================== */
#branding {
	position: relative;
	/* A real z-index (not `isolation`) so the nav's dropdowns can sit above
	   page content. `isolation:isolate` trapped them inside this element's
	   stacking context, which let article images paint over the menus. */
	z-index: 60;
	background: linear-gradient(165deg, var(--green-light) 0%, var(--green) 45%, var(--green-dark) 100%);
	border-top: 4px solid var(--brass);
}
/* subtle engraved texture */
#branding::before {
	content: "";
	position: absolute; inset: 0; z-index: -1; opacity: .5;
	background-image:
		radial-gradient(circle at 12% 20%, rgba(255,255,255,.07), transparent 42%),
		radial-gradient(circle at 88% 75%, rgba(0,0,0,.18), transparent 55%);
}

#branding .hgroup-wrap {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: clamp(1rem, 3vw, 2rem);
	padding-block: clamp(1.1rem, 2.4vw, 1.6rem);
	flex-wrap: wrap;
}
/* .hgroup-right is printed BEFORE #site-logo in the theme's markup —
   flex order puts the identity first without touching the HTML. */
#branding .hgroup-wrap #site-logo    { order: 1; }
#branding .hgroup-wrap .hgroup-right { order: 2; }

/* Safety net: if a search form is ever printed loose as a direct child of
   #branding (an old hook did exactly that), keep it in normal flow inside
   the header rather than letting it float over the logo. */
#branding > .searchform,
#branding > form.searchform {
	max-width: var(--container);
	margin: 0 auto;
	padding-inline: clamp(1rem, 4vw, 2rem);
	background: none;
	border: 0;
}

/* ---- Override stale custom CSS from the OLD theme -----------------------
   Theme Options > Custom CSS still prints these inline, and an inline
   <style> in the document head outranks this file:
       .searchform      { height:30px; float:right; margin-top:50px; … }
       #branding input.s{ border:1px solid #d0d0d0; width:120px; text-indent:10px; }
   They squash the pill and put a grey box around the input, so they are
   neutralised here. Best practice is still to clear that Custom CSS box.  */
#branding .searchform,
#branding form.searchform {
	height: auto !important;
	float: none !important;
	margin: 0 !important;
}
#branding .searchform input.s,
#branding .searchform input.field,
#branding .searchform input[type="text"],
#branding input.s {
	width: 100% !important;
	min-width: 0 !important;
	height: auto !important;
	border: 0 !important;
	text-indent: 0 !important;
	background: none !important;
	padding: .42rem .5rem .42rem .85rem !important;
	box-shadow: none !important;
}
#branding .searchform input.submit,
#branding .searchform input[type="submit"] {
	width: 32px !important;
	height: 32px !important;
	flex: none !important;
	text-indent: -9999px !important;
}

/* --- Logo + wordmark --------------------------------------------------- */
#site-logo {
	display: flex;
	align-items: center;
	gap: clamp(.85rem, 2vw, 1.25rem);
	float: none;
	margin: 0;
	min-width: 0;
}

/* The society logo is black line-art. Rather than crushing it to a white
   silhouette (which destroyed the detail), it sits on a cream enamel
   plaque — every line stays readable and it reads as a heritage badge. */
.site-logo-link { display: block; flex: none; }
.site-logo-link img,
#site-title img,
.custom-logo {
	filter: none;
	background: var(--paper);
	padding: 9px 13px;
	border-radius: var(--radius-sm);
	box-shadow: 0 2px 0 rgba(0,0,0,.22), inset 0 0 0 1px rgba(36,31,24,.08);
	max-height: 74px;
	width: auto;
	transition: transform .2s var(--ease);
}
.site-logo-link:hover img { transform: translateY(-2px); }

.site-identity { min-width: 0; }

#site-title {
	margin: 0;
	font-family: var(--display);
	font-size: clamp(1.6rem, 3.6vw, 2.15rem);
	font-weight: 600;
	line-height: 1;
	letter-spacing: .005em;
}
#site-title a { color: #fffdf8; display: block; }
#site-title a:hover { color: var(--amber); }

#site-description {
	margin: .45rem 0 0;
	font-family: var(--signage);
	font-size: clamp(.68rem, 1.5vw, .8rem);
	font-weight: 400;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: rgba(255,253,248,.72);
	line-height: 1.4;
}

/* --- Header right (search + social) ------------------------------------ */
.hgroup-right {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 1rem;
	float: none;
	margin: 0 0 0 auto;   /* keep flush right */
	flex-wrap: nowrap;
}

/* A single translucent pill that sits on the green. The submit collapses to a
   magnifier glyph so the control stays compact at every width. */
.searchform,
#searchform,
.search-form {
	display: flex;
	align-items: center;
	width: 100%;
	max-width: 300px;
	margin: 0;
	background: rgba(255,253,248,.12);
	border: 1px solid rgba(255,253,248,.28);
	border-radius: 999px;
	padding: 3px 3px 3px 4px;
	transition: background .2s var(--ease), border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.searchform:focus-within,
#searchform:focus-within,
.search-form:focus-within {
	background: rgba(255,253,248,.2);
	border-color: var(--amber);
	box-shadow: 0 0 0 3px rgba(244,177,43,.22);
}

.searchform .field,
.searchform input[type="text"],
.searchform input[type="search"],
#searchform input[type="text"],
.search-form .search-field {
	flex: 1 1 auto;
	min-width: 0;
	width: 100%;
	background: none;
	border: 0;
	border-radius: 999px;
	padding: .42rem .5rem .42rem .85rem;
	font-family: var(--body);
	font-size: .88rem;
	color: #fffdf8;
	box-shadow: none;
}
.searchform .field::placeholder,
#searchform input[type="text"]::placeholder { color: rgba(255,253,248,.6); }
.searchform .field:focus,
#searchform input[type="text"]:focus { outline: none; box-shadow: none; }

/* submit → circular brass magnifier */
.searchform .submit,
.searchform input[type="submit"],
#searchform input[type="submit"],
.search-form .search-submit {
	flex: none;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background-color: var(--brass);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23241606' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 17px 17px;
	/* hide the "Search" value text without hiding the control */
	font-size: 0;
	color: transparent;
	text-indent: -9999px;
	cursor: pointer;
	box-shadow: none;
	transition: background-color .18s var(--ease), transform .14s var(--ease);
}
.searchform .submit:hover,
#searchform input[type="submit"]:hover,
.search-form .search-submit:hover { background-color: var(--brass-light); transform: none; }
.searchform .submit:active { transform: scale(.94); }

/* social icons */
.social-icons { float: none; margin: 0; }
.social-icons ul { display: flex; gap: .4rem; margin: 0; }
.social-icons ul li { margin: 0; float: none; padding: 0; }
.social-icons ul li a {
	display: grid;
	place-items: center;
	width: 38px; height: 38px;
	border-radius: 50%;
	background: rgba(255,253,248,.12);
	color: #fffdf8;
	font-size: 19px;
	transition: background .18s var(--ease), transform .18s var(--ease), color .18s var(--ease);
}
.social-icons ul li a:hover {
	background: var(--amber);
	color: #241606 !important;
	transform: translateY(-2px);
}

/* header image (if used) */
.header-image { width: 100%; height: auto; }

/* ==========================================================================
   6. NAVIGATION — the destination blind
   ========================================================================== */
#main-nav {
	position: sticky;
	top: 0;
	z-index: 100;
	background: rgba(22,19,13,.94);
	-webkit-backdrop-filter: saturate(160%) blur(10px);
	backdrop-filter: saturate(160%) blur(10px);
	box-shadow: 0 2px 0 var(--brass), 0 8px 22px rgba(14,36,31,.3);
}
@supports not (backdrop-filter: blur(4px)) { #main-nav { background: #16130d; } }
/* faint horizontal ruling, like a roller blind */
#main-nav::after {
	content: "";
	position: absolute; inset: 0;
	pointer-events: none;
	background-image: repeating-linear-gradient(180deg, rgba(255,255,255,.028) 0 1px, transparent 1px 3px);
}

#main-nav .container {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	position: relative;
}

#main-nav ul.root {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	margin: 0;
}
#main-nav ul.root > li { position: relative; }

#main-nav ul.root a {
	display: block;
	padding-inline: clamp(.7rem, 1.5vw, 1.15rem);
	line-height: var(--nav-h);
	font-family: var(--signage);
	font-weight: 500;
	font-size: .93rem;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--amber);
	white-space: nowrap;
	transition: background .16s var(--ease), color .16s var(--ease);
	position: relative;
}
#main-nav ul.root > li > a::after {
	content: "";
	position: absolute; left: 50%; right: 50%; bottom: 0; height: 3px;
	background: var(--amber);
	transition: left .22s var(--ease), right .22s var(--ease);
}
#main-nav ul.root > li:hover > a,
#main-nav ul.root > li:focus-within > a { background: rgba(244,177,43,.13); color: #ffd77e; }
#main-nav ul.root > li:hover > a::after,
#main-nav ul.root > li:focus-within > a::after,
#main-nav ul.root > li.current-menu-item > a::after,
#main-nav ul.root > li.current_page_item > a::after,
#main-nav ul.root > li.current-menu-ancestor > a::after,
#main-nav ul.root > li.current_page_ancestor > a::after { left: 0; right: 0; }

#main-nav ul.root > li.current-menu-item > a,
#main-nav ul.root > li.current_page_item > a,
#main-nav ul.root > li.current-menu-ancestor > a,
#main-nav ul.root > li.current_page_ancestor > a { color: #ffe0a0; }

/* dropdown */
#main-nav ul.root ul {
	position: absolute;
	top: 100%; left: 0;
	min-width: 250px;
	background: #16130d;
	border-top: 2px solid var(--brass);
	box-shadow: var(--shadow-lg);
	padding: .35rem 0;
	opacity: 0; visibility: hidden;
	transform: translateY(8px);
	transition: opacity .18s var(--ease), transform .18s var(--ease), visibility .18s;
	z-index: 110;
}
#main-nav ul.root li:hover > ul,
#main-nav ul.root li:focus-within > ul { opacity: 1; visibility: visible; transform: translateY(0); }
#main-nav ul.root ul li { width: 100%; }
#main-nav ul.root ul a {
	line-height: 1.4;
	padding: .68rem 1.15rem;
	font-size: .84rem;
	letter-spacing: .06em;
	color: rgba(244,177,43,.9);
	white-space: normal;
}
#main-nav ul.root ul a::after { display: none; }
#main-nav ul.root ul a:hover { background: rgba(244,177,43,.14); color: #ffd77e; }
#main-nav ul.root ul ul { top: 0; left: 100%; }

/* caret */
#main-nav ul.root > li.menu-item-has-children > a,
#main-nav ul.root > li.page_item_has_children > a { padding-right: 2rem; }
#main-nav ul.root > li.menu-item-has-children > a::before,
#main-nav ul.root > li.page_item_has_children > a::before {
	content: "";
	position: absolute; right: 1rem; top: 50%;
	width: 6px; height: 6px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-70%) rotate(45deg);
	opacity: .8;
}

/* mobile toggle (injected by bcsv-modern.js) */
.bcsv-nav-toggle {
	display: none;
	align-items: center;
	gap: .65rem;
	margin: .6rem 0;
	padding: .6rem 1rem;
	background: rgba(244,177,43,.14);
	border: 1px solid rgba(244,177,43,.4);
	border-radius: var(--radius-sm);
	color: var(--amber);
	font-family: var(--signage);
	font-size: .85rem;
	font-weight: 500;
	letter-spacing: .12em;
	text-transform: uppercase;
	cursor: pointer;
}
.bcsv-nav-toggle .bar {
	display: block; width: 18px; height: 2px; background: currentColor;
	box-shadow: 0 6px 0 currentColor, 0 -6px 0 currentColor;
}
/* legacy select menu from old theme — never show */
.tinynav, select.tinynav, #main-nav select { display: none !important; }

/* ==========================================================================
   7. HERO SLIDER
   ========================================================================== */
.featured-slider {
	position: relative;
	background: var(--green-deep);
	overflow: hidden;
}
/* jQuery Cycle toggles these classes — without them every slide stacks up. */
.displaynone  { display: none; }
.displayblock { display: block; }
.featured-slider .slides { position: relative; }
.featured-slider figure { margin: 0; }
.featured-slider img {
	width: 100%;
	height: clamp(320px, 56vh, 620px);
	object-fit: cover;
	filter: saturate(.86) contrast(1.03);
}
.featured-slider .slides::after {
	content: "";
	position: absolute; inset: 0;
	pointer-events: none;
	background:
		linear-gradient(90deg, rgba(14,36,31,.9) 0%, rgba(14,36,31,.55) 45%, rgba(14,36,31,0) 78%),
		linear-gradient(0deg, rgba(14,36,31,.75) 0%, transparent 45%);
}
.featured-slider .featured-text {
	position: absolute;
	left: 0; bottom: 0; z-index: 3;
	width: 100%;
	max-width: var(--container);
	margin-inline: auto;
	right: 0;
	padding: clamp(1.5rem, 5vw, 3.5rem) clamp(1rem, 4vw, 2rem);
}
.featured-slider .featured-title { margin: 0 0 .6rem; }
.featured-slider .featured-title a {
	font-family: var(--display);
	font-size: var(--step-4);
	font-weight: 600;
	line-height: 1.06;
	letter-spacing: -.02em;
	color: #fffdf8;
	max-width: 18ch;
	display: inline-block;
	text-wrap: balance;
}
.featured-slider .featured-title a:hover { color: var(--amber); }
.featured-slider .featured-content {
	color: rgba(255,253,248,.9);
	font-size: var(--step-0);
	max-width: 52ch;
}

#controllers {
	position: absolute;
	right: max(1.5rem, calc(50vw - var(--container)/2 + 1rem));
	bottom: 1.5rem;
	z-index: 4;
	display: flex;
	gap: .5rem;
}
#controllers a {
	width: 30px; height: 4px;
	border-radius: 2px;
	background: rgba(255,253,248,.4);
	transition: background .2s var(--ease), transform .2s var(--ease);
}
#controllers a:hover,
#controllers a.activeSlide,
#controllers a.active { background: var(--amber); transform: scaleY(1.6); }

/* ==========================================================================
   8. PAGE TITLE BAND
   ========================================================================== */
.page-title-wrap {
	background: #16130d;
	border-bottom: 3px solid var(--brass);
	padding-block: clamp(1.5rem, 3.5vw, 2.5rem);
	position: relative;
}
.page-title-wrap::after {
	content: "";
	position: absolute; inset: 0; pointer-events: none;
	background-image: repeating-linear-gradient(180deg, rgba(255,255,255,.025) 0 1px, transparent 1px 3px);
}
.page-title-wrap .page-title {
	margin: 0;
	color: var(--amber);
	font-size: var(--step-3);
	padding: 0;
	border: 0;
}
.breadcrumb { margin: 0 0 .5rem; }
.breadcrumb ul { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0; }
.breadcrumb, .breadcrumb a, .breadcrumb span, .breadcrumb li {
	font-family: var(--signage);
	font-size: .76rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: rgba(244,177,43,.7);
}
.breadcrumb a:hover { color: #ffd77e; }

/* ==========================================================================
   9. CONTENT & ARTICLES
   ========================================================================== */
#content { width: 100%; }

.hentry,
#content > article,
article.post,
article.page {
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	padding: clamp(1.4rem, 3.5vw, 3rem);
	margin-bottom: var(--gap);
	box-shadow: var(--shadow-sm);
}
.hentry:last-child { margin-bottom: 0; }

.entry-title {
	font-size: var(--step-3);
	margin: 0 0 .5rem;
	padding: 0;
}
.entry-title a { color: inherit; }
.entry-title a:hover { color: var(--maroon); }

.entry-meta,
.entry-meta-bar,
.byline, .posted-on, .entry-utility {
	font-family: var(--signage);
	font-size: .76rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--muted);
}
.entry-meta a, .byline a, .posted-on a { color: var(--brass-dark); }
.entry-meta a:hover { color: var(--maroon); }
/* meta links shouldn't carry the prose underline */
.entry-meta a, .entry-meta a:hover { background-image: none; padding-bottom: 0; }

.entry-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .3rem .95rem;
	margin-bottom: 1.5rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--line-soft);
}
.entry-meta > span { display: inline-flex; align-items: center; gap: .45rem; }
/* dot separator between meta items */
.entry-meta > span + span::before {
	content: "";
	flex: none;
	width: 4px; height: 4px;
	border-radius: 50%;
	background: var(--line);
}
.entry-meta .byline::before {
	content: "By";
	opacity: .7;
	letter-spacing: .08em;
}
/* the theme prints published + modified dates back to back */
.entry-meta .posted-on time + time::before {
	content: "· updated ";
	margin-left: .3rem;
	opacity: .75;
}

/* NOTE: hard <br> tags inside post titles (left over from the old narrow
   layout) are converted to spaces in PHP — see bcsv_soften_title_breaks()
   in functions.php. Hiding them in CSS would run the words together. */

/* --- Prose ------------------------------------------------------------- */
.entry-content,
.entry-summary {
	color: var(--ink-body);
	font-size: var(--step-0);
	line-height: 1.75;
}
.entry-content > * + * { margin-top: 1.15em; }
.entry-content p { margin: 0; }

.entry-content h1, .entry-content h2, .entry-content h3,
.entry-content h4, .entry-content h5, .entry-content h6 {
	margin-top: 1.9em;
	margin-bottom: .55em;
	padding: 0;
	color: var(--green-dark);
}
.entry-content h2 { font-size: var(--step-2); }
.entry-content h3 { font-size: var(--step-1); }
.entry-content h2::after {
	content: "";
	display: block;
	width: 48px; height: 3px;
	background: var(--brass);
	margin-top: .5rem;
	border-radius: 2px;
}
.entry-content > :first-child { margin-top: 0; }

/* Links inside prose: a clean underline that grows on hover.
   (Replaces the old grey strike-through-looking links.) */
.entry-content a:not([class*="btn"]):not([class*="button"]):not(.more-link):not(.readmore),
#content a:not([class*="btn"]):not([class*="button"]):not(.more-link):not(.readmore),
.textwidget a:not([class*="btn"]):not([class*="button"]) {
	color: var(--green);
	font-weight: 500;
	text-decoration: none;
	background-image: linear-gradient(var(--brass), var(--brass));
	background-repeat: no-repeat;
	background-position: 0 100%;
	background-size: 100% 1px;
	padding-bottom: 1px;
	transition: background-size .22s var(--ease), color .18s var(--ease);
}
.entry-content a:not([class*="btn"]):not([class*="button"]):not(.more-link):not(.readmore):hover,
#content a:not([class*="btn"]):not([class*="button"]):not(.more-link):not(.readmore):hover,
.textwidget a:not([class*="btn"]):not([class*="button"]):hover {
	color: var(--maroon);
	background-size: 100% 2px;
}

/* Never let a plugin's own button inherit the prose-link treatment.
   (This was painting green text + a brass underline onto the Virtual
   Museum's green .vm-btn, making the label invisible.) */
.entry-content a[class*="btn"], .entry-content a[class*="button"],
#content a[class*="btn"], #content a[class*="button"] {
	background-image: none;
	text-decoration: none;
	padding-bottom: 0;
}

/* Buttons must never inherit the prose link treatment (green-on-green text
   and a gradient underline). This wins wherever a button sits. */
a.button, a.button:link, a.button:visited,
.entry-content a.button, #content a.button,
.wp-block-button__link, .entry-content .wp-block-button__link {
	color: #fffdf8;
	background-image: none;
	text-decoration: none;
	padding-bottom: .78rem;
}
a.button:hover, .entry-content a.button:hover, #content a.button:hover { color: #fffdf8; }

a.button--accent, .entry-content a.button--accent, #content a.button--accent,
a.btn-accent { color: #241606; }
a.button--accent:hover, .entry-content a.button--accent:hover { color: #241606; }

a.button--ghost, .entry-content a.button--ghost { color: var(--green); }
a.button--ghost:hover, .entry-content a.button--ghost:hover { color: #fffdf8; }

/* lists */
.entry-content ul, .entry-content ol { padding-left: 1.4em; }
.entry-content ul > li { list-style: disc; }
.entry-content ol > li { list-style: decimal; }
.entry-content li { margin-bottom: .45em; }
.entry-content li::marker { color: var(--brass); }
.entry-content ul ul, .entry-content ol ol { margin-top: .45em; }

.entry-content dl { margin-bottom: 1.15em; }
.entry-content dt { font-weight: 650; color: var(--ink); }
.entry-content dd { margin: 0 0 .8em 1.2em; }

/* blockquote */
.entry-content blockquote {
	position: relative;
	margin: 1.8em 0;
	padding: 1.1rem 1.5rem;
	background: var(--surface);
	border-left: 4px solid var(--brass);
	border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
	font-family: var(--display);
	font-size: var(--step-1);
	font-style: italic;
	line-height: 1.5;
	color: var(--ink-soft);
}
.entry-content blockquote cite {
	display: block;
	margin-top: .6rem;
	font-family: var(--signage);
	font-size: .78rem;
	font-style: normal;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--muted);
}

/* images */
.entry-content img { border-radius: var(--radius-sm); }
.entry-content figure { margin: 1.6em 0; }
.entry-content figcaption,
.wp-caption-text {
	margin-top: .55rem;
	font-size: var(--step--1);
	color: var(--muted);
	font-style: italic;
	text-align: center;
}

/* tables */
.entry-content table {
	margin: 1.6em 0;
	font-size: var(--step--1);
	border: 1px solid var(--line);
	border-radius: var(--radius-sm);
	overflow: hidden;
	background: var(--paper);
}
.entry-content th {
	background: var(--green);
	color: #fffdf8;
	font-family: var(--signage);
	font-weight: 500;
	letter-spacing: .06em;
	text-transform: uppercase;
	text-align: left;
	padding: .75rem .9rem;
	font-size: .78rem;
}
.entry-content td { padding: .7rem .9rem; border-top: 1px solid var(--line-soft); }
.entry-content tbody tr:nth-child(even) td { background: rgba(233,224,205,.4); }

/* read more */
.more-link, .readmore, .entry-meta-bar .readmore {
	display: inline-block;
	margin-top: .6rem;
	font-family: var(--signage);
	font-size: .78rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--brass-dark);
	background: none !important;
	border: 0;
	padding: 0;
}
.more-link:hover, .readmore:hover { color: var(--maroon); }
.more-link::after, .readmore::after { content: " →"; }

/* archive header */
.archive-header, .page-header { margin-bottom: var(--gap); }
.archive-title, .page-header .entry-title { font-size: var(--step-3); }

/* ==========================================================================
   10. WORDPRESS CORE CLASSES
   ========================================================================== */
.alignleft   { float: left;  margin: .4rem 1.6rem 1.2rem 0; }
.alignright  { float: right; margin: .4rem 0 1.2rem 1.6rem; }
.aligncenter { display: block; margin-inline: auto; }
.alignnone   { margin: 1rem 0; }
.alignwide, .alignfull { margin-inline: 0; max-width: 100%; }

.wp-caption { max-width: 100%; margin-bottom: 1.4rem; }
.wp-caption img { margin: 0; }

.sticky { border-color: var(--brass); box-shadow: var(--shadow); }

.gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: .8rem; margin: 1.6em 0; }
.gallery-item { margin: 0 !important; width: auto !important; }
.gallery-item img { border: 0 !important; width: 100%; border-radius: var(--radius-sm); }
.gallery-caption { font-size: var(--step--1); color: var(--muted); }

.screen-reader-text, .assistive-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;
}
.screen-reader-text:focus, .assistive-text:focus {
	position: static !important;
	width: auto; height: auto;
	clip: auto; margin: 0;
	padding: .6rem 1rem; background: var(--amber); color: #241606;
}

.bypostauthor { }

/* ==========================================================================
   11. COMMENTS
   ========================================================================== */
#comments {
	margin-top: var(--gap);
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	padding: clamp(1.4rem, 3.5vw, 2.5rem);
}
#comments .comments-title, #reply-title {
	font-size: var(--step-2);
	margin-bottom: 1.2rem;
}
.commentlist { margin: 0; }
.commentlist li.comment { margin-bottom: 1.5rem; }
.commentlist .children { margin-left: clamp(1rem, 4vw, 2.5rem); margin-top: 1.5rem; }
article.comment {
	background: var(--surface);
	border: 1px solid var(--line-soft);
	border-radius: var(--radius-sm);
	padding: 1.1rem 1.3rem;
}
.comment-author { display: flex; align-items: center; gap: .7rem; font-weight: 600; color: var(--ink); }
.comment-author img, .avatar { border-radius: 50%; }
.comment-meta, .comment-metadata {
	font-family: var(--signage); font-size: .74rem; letter-spacing: .08em;
	text-transform: uppercase; color: var(--muted); margin-bottom: .6rem;
}
.reply a {
	font-family: var(--signage); font-size: .74rem; letter-spacing: .1em;
	text-transform: uppercase; color: var(--brass-dark);
}
.comment-form label { display: block; margin-bottom: .3rem; }
.comment-form p { margin-bottom: 1rem; }

/* ==========================================================================
   12. PAGINATION
   ========================================================================== */
.pagination, .wp-pagenavi, .navigation, .default-wp-page {
	display: flex; flex-wrap: wrap; gap: .4rem;
	margin: var(--gap) 0 0;
	align-items: center;
}
.pagination a, .pagination span,
.wp-pagenavi a, .wp-pagenavi span,
.default-wp-page a, .nav-previous a, .nav-next a {
	display: inline-block;
	padding: .5rem .9rem;
	border: 1px solid var(--line);
	border-radius: var(--radius-sm);
	background: var(--paper);
	color: var(--ink-body);
	font-family: var(--signage);
	font-size: .82rem;
	letter-spacing: .06em;
	transition: background .16s var(--ease), color .16s var(--ease), border-color .16s var(--ease);
}
.pagination a:hover, .wp-pagenavi a:hover, .default-wp-page a:hover,
.nav-previous a:hover, .nav-next a:hover { background: var(--green); color: #fffdf8; border-color: var(--green); }
.pagination .current, .wp-pagenavi .current {
	background: var(--green); color: #fffdf8; border-color: var(--green); font-weight: 500;
}

/* ==========================================================================
   13. WIDGETS & SIDEBAR
   ========================================================================== */
.widget {
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	padding: 1.35rem 1.4rem;
	margin-bottom: 1.35rem;
	box-shadow: var(--shadow-sm);
}
.widget:last-child { margin-bottom: 0; }

.widget-title, .widget h3.widget-title, .widget h2.widget-title {
	position: relative;
	margin: 0 0 1rem;
	padding-bottom: .6rem;
	font-family: var(--signage);
	font-size: .92rem;
	font-weight: 500;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--green-dark);
	border-bottom: 1px solid var(--line);
}
.widget-title::after {
	content: "";
	position: absolute; left: 0; bottom: -1px;
	width: 44px; height: 2px;
	background: var(--brass);
}

.widget ul li {
	padding: .5rem 0;
	border-bottom: 1px solid var(--line-soft);
	font-size: var(--step--1);
}
.widget ul li:last-child { border-bottom: 0; padding-bottom: 0; }
.widget ul li a { color: var(--ink-body); }
.widget ul li a:hover { color: var(--green); }
.widget ul ul { margin-top: .5rem; padding-left: .9rem; }

.widget select { width: 100%; }
.widget img { border-radius: var(--radius-sm); }

/* tag cloud */
.tagcloud { display: flex; flex-wrap: wrap; gap: .35rem; }
.tagcloud a {
	font-size: .78rem !important;
	padding: .3rem .65rem;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: 999px;
	color: var(--ink-soft);
}
.tagcloud a:hover { background: var(--green); color: #fffdf8; border-color: var(--green); }

/* ==========================================================================
   14. FOOTER
   ========================================================================== */
#footerarea {
	background: var(--green-deep);
	border-top: 4px solid var(--brass);
	color: rgba(255,253,248,.72);
	margin-top: clamp(2.5rem, 6vw, 4.5rem);
	font-size: var(--step--1);
}
#footerarea a { color: rgba(255,253,248,.86); }
#footerarea a:hover { color: var(--amber); }

#footerarea .widget-wrap { padding-block: clamp(2rem, 5vw, 3.25rem) 0; }
#footerarea .widget-area {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: clamp(1.5rem, 4vw, 2.75rem);
}
#footerarea .widget {
	background: none;
	border: 0;
	box-shadow: none;
	padding: 0;
	margin: 0;
	/* neutralise legacy float columns */
	width: auto;
	float: none;
}
#footerarea .col-3, #footerarea .col-2, #footerarea .col-4 { width: auto; float: none; margin: 0; }
#footerarea .widget-title { color: #fffdf8; border-bottom-color: rgba(255,253,248,.18); }
#footerarea .widget ul li { border-bottom-color: rgba(255,253,248,.1); }
#footerarea .widget ul li a { color: rgba(255,253,248,.8); }

#site-generator {
	border-top: 1px solid rgba(255,253,248,.13);
	margin-top: clamp(1.75rem, 4vw, 2.5rem);
}
#site-generator .container {
	display: flex;
	flex-wrap: wrap;
	gap: .8rem;
	align-items: center;
	justify-content: space-between;
	padding-block: 1.3rem;
}
#site-generator .copyright {
	font-family: var(--signage);
	font-size: .76rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: rgba(255,253,248,.6);
	margin: 0;
}
#site-generator .copyright h6 { display: inline; margin: 0; font-size: inherit; }
#site-generator .copyright h6 a { color: var(--amber); }
.footer-right { color: rgba(255,253,248,.6); font-size: .8rem; }

/* back to top */
.back-to-top { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 200; margin: 0; }
.back-to-top a {
	display: grid; place-items: center;
	width: 46px; height: 46px;
	border-radius: var(--radius-sm);
	background: var(--brass);
	color: #241606;
	box-shadow: var(--shadow-lg);
	opacity: 0; visibility: hidden;
	transform: translateY(10px);
	transition: opacity .25s var(--ease), transform .25s var(--ease), visibility .25s, background .18s;
	font-size: 0;
}
.back-to-top a::before { content: "↑"; font-size: 1.3rem; font-weight: 700; line-height: 1; }
body.bcsv-scrolled .back-to-top a { opacity: 1; visibility: visible; transform: translateY(0); }
.back-to-top a:hover { background: var(--amber); }

/* ==========================================================================
   15. FORMS & BUTTONS
   ========================================================================== */
input[type="text"], input[type="email"], input[type="url"], input[type="password"],
input[type="search"], input[type="tel"], input[type="number"], input[type="date"],
textarea, select {
	width: 100%;
	max-width: 100%;
	padding: .72rem .9rem;
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: var(--radius-sm);
	color: var(--ink);
	font-size: var(--step--1);
	transition: border-color .16s var(--ease), box-shadow .16s var(--ease);
}
textarea { min-height: 150px; resize: vertical; }
input:focus, textarea:focus, select:focus {
	outline: none;
	border-color: var(--green);
	box-shadow: 0 0 0 3px rgba(29,64,52,.14);
}
label {
	display: inline-block;
	font-family: var(--signage);
	font-size: .78rem;
	font-weight: 500;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ink-soft);
	margin-bottom: .3rem;
}

.button,
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.wp-block-button__link {
	display: inline-block;
	width: auto;
	padding: .78rem 1.6rem;
	background: var(--green);
	color: #fffdf8;
	border: 0;
	border-radius: var(--radius-sm);
	font-family: var(--signage);
	font-size: .84rem;
	font-weight: 500;
	letter-spacing: .1em;
	text-transform: uppercase;
	cursor: pointer;
	box-shadow: 0 2px 0 var(--green-deep);
	transition: background .18s var(--ease), transform .14s var(--ease), box-shadow .14s var(--ease);
}
.button:hover, button:hover,
input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover {
	background: var(--green-dark);
	color: #fffdf8;
	transform: translateY(-1px);
	box-shadow: 0 3px 0 var(--green-deep);
}
.button:active, button:active, input[type="submit"]:active { transform: translateY(1px); box-shadow: 0 1px 0 var(--green-deep); }

.button--accent, .btn-accent {
	background: var(--brass);
	color: #241606;
	box-shadow: 0 2px 0 var(--brass-dark);
}
.button--accent:hover, .btn-accent:hover { background: var(--brass-light); color: #241606; box-shadow: 0 3px 0 var(--brass-dark); }

.button--ghost {
	background: transparent;
	color: var(--green);
	box-shadow: inset 0 0 0 2px var(--green);
}
.button--ghost:hover { background: var(--green); color: #fffdf8; box-shadow: inset 0 0 0 2px var(--green); }

/* ==========================================================================
   16. FRONT PAGE SECTIONS
   ========================================================================== */
.front-page { display: block; }

.home-intro {
	max-width: 760px;
	margin: 0 auto;
	text-align: center;
}
.home-intro .eyebrow { margin-bottom: .7rem; }
.home-intro h2 { font-size: var(--step-3); margin-bottom: .7rem; }
.home-intro .route-line { margin: 1.1rem auto 1.3rem; }
.home-intro p { color: var(--ink-soft); font-size: var(--step-1); line-height: 1.6; }

/* feature cards */
.feature-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
	gap: clamp(1.25rem, 3vw, 2rem);
	margin-top: clamp(2.25rem, 5vw, 3.5rem);
}
.feature-card {
	display: flex;
	flex-direction: column;
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	overflow: hidden;
	box-shadow: var(--shadow-sm);
	transition: transform .28s var(--ease), box-shadow .28s var(--ease);
}
.feature-card:hover,
.feature-card:focus-within {
	transform: translateY(-5px);
	box-shadow: var(--shadow);
	border-color: var(--brass);
}
.feature-card .thumb {
	display: block;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--surface-2);
	position: relative;
}
.feature-card .thumb::after {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(0deg, rgba(14,36,31,.25), transparent 55%);
}
.feature-card .thumb img {
	width: 100%; height: 100%;
	object-fit: cover;
	filter: saturate(.9);
	transition: transform .5s var(--ease);
}
.feature-card:hover .thumb img { transform: scale(1.05); }
.feature-card .body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 1.4rem 1.4rem 1.5rem;
}
.feature-card h3 { font-size: var(--step-1); margin-bottom: .5rem; }
.feature-card p { color: var(--ink-soft); font-size: var(--step--1); flex: 1; margin-bottom: 1.2rem; }
.feature-card .button { align-self: flex-start; }

/* stat band — styled like a timetable strip */
.stat-band {
	background: var(--surface-2);
	border-block: 1px solid var(--line);
	margin-top: clamp(2.5rem, 6vw, 4rem);
}
.stat-band .inner {
	max-width: var(--container);
	margin-inline: auto;
	padding: clamp(1.75rem, 4vw, 2.75rem) clamp(1rem, 4vw, 2rem);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 1.5rem;
	text-align: center;
}
.stat { position: relative; }
.stat + .stat::before {
	content: "";
	position: absolute; left: 0; top: 50%;
	transform: translateY(-50%);
	width: 1px; height: 46px;
	background: var(--line);
}
.stat .n {
	font-family: var(--display);
	font-size: clamp(1.9rem, 4vw, 2.6rem);
	font-weight: 700;
	line-height: 1;
	color: var(--green);
}
.stat .l {
	margin-top: .5rem;
	font-family: var(--signage);
	font-size: .74rem;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--muted);
}

/* membership CTA */
.membership-cta { margin-top: clamp(2.5rem, 6vw, 4rem); }
.membership-cta .inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: clamp(1.25rem, 3vw, 2.5rem);
	background:
		linear-gradient(135deg, var(--green) 0%, var(--green-dark) 100%);
	border-radius: var(--radius);
	padding: clamp(1.6rem, 4vw, 2.75rem);
	box-shadow: var(--shadow);
	position: relative;
	overflow: hidden;
}
.membership-cta .inner::before {
	content: "";
	position: absolute; inset: 0;
	background-image: repeating-linear-gradient(135deg, rgba(255,255,255,.03) 0 12px, transparent 12px 24px);
	pointer-events: none;
}
.membership-cta .text { flex: 1 1 360px; position: relative; }
.membership-cta h2 { color: #fffdf8; font-size: var(--step-2); margin-bottom: .5rem; }
.membership-cta p { color: rgba(255,253,248,.85); margin: 0; font-size: var(--step--1); }
.membership-cta .action { position: relative; }

/* ==========================================================================
   17. PLUGIN COMPATIBILITY
   ========================================================================== */
/* TablePress */
table.tablepress {
	border: 1px solid var(--line);
	border-radius: var(--radius-sm);
	overflow: hidden;
	font-size: var(--step--1);
	background: var(--paper);
}
table.tablepress thead th, table.tablepress tfoot th {
	background: var(--green);
	color: #fffdf8;
	font-family: var(--signage);
	font-weight: 500;
	letter-spacing: .06em;
	text-transform: uppercase;
	padding: .75rem .9rem;
}
table.tablepress td { padding: .7rem .9rem; border-top: 1px solid var(--line-soft); }
table.tablepress .even td { background: rgba(233,224,205,.4); }

/* Contact Form 7 */
.wpcf7 { margin-top: 1rem; }
.wpcf7 label { display: block; width: 100%; }
.wpcf7-form-control-wrap { display: block; margin-bottom: .2rem; }
.wpcf7 .wpcf7-submit { width: auto; }
.wpcf7-response-output {
	border-radius: var(--radius-sm) !important;
	border-width: 1px !important;
	padding: .8rem 1rem !important;
	margin: 1rem 0 0 !important;
	font-size: var(--step--1);
}
.wpcf7-not-valid-tip { color: var(--maroon); font-size: .8rem; }

/* The Events Calendar — let the plugin own its internals, match our chrome */
.tribe-common .tribe-common-c-btn,
.tribe-events .tribe-events-c-view-selector__button,
#tribe-events .tribe-events-button,
.tribe-events-button {
	background: var(--green) !important;
	color: #fffdf8 !important;
	border-radius: var(--radius-sm) !important;
	font-family: var(--signage) !important;
	letter-spacing: .08em;
	text-transform: uppercase;
}
.tribe-common a { color: var(--green); }
.tribe-events-calendar-list__event-title a { font-family: var(--display); }
#tribe-events-content, .tribe-common { font-family: var(--body); }

/* Membership (Indeed Membership Pro) */
.ihc-account-page, .ihc-form-wrap, .ihc-login-form {
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	padding: clamp(1.25rem, 3vw, 2rem);
}
.ihc-form-wrap input[type="submit"], .ihc-button { border-radius: var(--radius-sm) !important; }

/* Team Members */
.tmm_member { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); }

/* WooCommerce (light touch — plugin owns its layout) */
.woocommerce .button, .woocommerce a.button, .woocommerce button.button {
	background: var(--green) !important;
	color: #fffdf8 !important;
	border-radius: var(--radius-sm) !important;
	font-family: var(--signage);
	letter-spacing: .08em;
	text-transform: uppercase;
}
.woocommerce ul.products li.product { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem; }

/* embeds */
.wp-block-embed__wrapper, .fb_iframe_widget, .fb_iframe_widget span { max-width: 100%; }
iframe { max-width: 100%; border-radius: var(--radius-sm); }

/* ==========================================================================
   18. ICONS (Genericons — used by the social links)
   ========================================================================== */
@font-face {
	font-family: 'Genericons';
	src: url('library/font/Genericons.woff') format('woff'),
	     url('library/font/Genericons.ttf') format('truetype'),
	     url('library/font/Genericons.svg#Genericons') format('svg');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
.social-icons ul li a {
	font-family: 'Genericons';
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	speak: none;
	-webkit-font-smoothing: antialiased;
}
.social-icons ul li.facebook a::before     { content: '\f204'; }
.social-icons ul li.twitter a::before      { content: '\f202'; }
.social-icons ul li.google-plus a::before  { content: '\f218'; }
.social-icons ul li.pinterest a::before    { content: '\f209'; }
.social-icons ul li.linkedin a::before     { content: '\f207'; }
.social-icons ul li.tumblr a::before       { content: '\f214'; }
.social-icons ul li.vimeo a::before        { content: '\f212'; }
.social-icons ul li.instagram a::before    { content: '\f215'; }
.social-icons ul li.flickr a::before       { content: '\f211'; }
.social-icons ul li.youtube a::before      { content: '\f213'; }
.social-icons ul li.rss a::before          { content: '\f413'; }
.social-icons ul li.github a::before       { content: '\f200'; }

/* ==========================================================================
   19. RESPONSIVE
   ========================================================================== */
@media (max-width: 1024px) {
	#main-nav ul.root a { padding-inline: .7rem; font-size: .86rem; letter-spacing: .06em; }
}

@media (max-width: 900px) {
	/* Compact two-row header: identity row, then a slim search row.
	   Keeps the logo first and stops the tagline wrapping to a column. */
	#branding .hgroup-wrap {
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: .9rem;
		padding-block: 1rem;
	}
	#site-logo {
		flex-direction: row;
		align-items: center;
		justify-content: center;
		gap: .8rem;
		width: 100%;
		text-align: left;
	}
	.site-logo-link img, #site-title img, .custom-logo { max-height: 54px; padding: 7px 10px; }
	.site-identity { text-align: left; }
	#site-title { font-size: clamp(1.45rem, 6.5vw, 1.9rem); }
	#site-description {
		font-size: .62rem;
		letter-spacing: .14em;
		margin-top: .3rem;
		max-width: 22ch;
	}
	.hgroup-right {
		width: 100%;
		justify-content: center;
		flex-direction: row;
		flex-wrap: nowrap;      /* keep search + socials on one row */
		align-items: center;
		gap: .6rem;
	}
	/* flex-basis 0 (not the 100% width) so it shares the row with the
	   social icons instead of overflowing the viewport */
	.searchform, #searchform, .search-form {
		max-width: none;
		width: auto;
		flex: 1 1 0;
		min-width: 0;
	}
	.social-icons { flex: none; }
	.social-icons ul { flex-wrap: nowrap; }
	.social-icons ul li a { width: 34px; height: 34px; font-size: 17px; }

	/* mobile nav */
	#main-nav { position: relative; }
	#main-nav .container { flex-direction: column; align-items: stretch; }
	.bcsv-nav-toggle { display: inline-flex; align-self: flex-start; }
	#main-nav ul.root {
		display: none;
		flex-direction: column;
		border-top: 1px solid rgba(244,177,43,.18);
		max-height: 70vh;
		overflow-y: auto;
		margin-inline: calc(-1 * clamp(1rem, 4vw, 2rem));
		padding-inline: clamp(1rem, 4vw, 2rem);
	}
	#main-nav.bcsv-open ul.root { display: flex; }
	#main-nav ul.root > li { width: 100%; border-top: 1px solid rgba(244,177,43,.09); }
	#main-nav ul.root > li:first-child { border-top: 0; }
	#main-nav ul.root a { line-height: 1.4; padding: .9rem .25rem; white-space: normal; }
	#main-nav ul.root > li > a::after { display: none; }
	#main-nav ul.root ul {
		position: static;
		opacity: 1; visibility: visible;
		transform: none;
		display: none;
		box-shadow: none;
		border-top: 0;
		background: rgba(0,0,0,.3);
		min-width: 0;
		padding: 0;
	}
	#main-nav ul.root li.bcsv-sub-open > ul { display: block; }
	#main-nav ul.root ul a { padding-left: 1.4rem; }
	#main-nav ul.root > li.menu-item-has-children > a::before { right: .35rem; }
	#main-nav ul.root > li.bcsv-sub-open > a::before { transform: translateY(-30%) rotate(-135deg); }

	.featured-slider .slides::after {
		background: linear-gradient(0deg, rgba(14,36,31,.92) 10%, rgba(14,36,31,.3) 62%, transparent 100%);
	}
	.featured-slider img { height: clamp(260px, 42vh, 380px); }
	.featured-slider .featured-title a { max-width: none; font-size: clamp(1.5rem, 6.4vw, 2.1rem); }
	.featured-slider .featured-content { font-size: .95rem; }
	#controllers { bottom: 1rem; }
	#controllers a { width: 22px; }

	#secondary { position: static; }
}

@media (max-width: 600px) {
	.stat + .stat::before { display: none; }
	.stat-band .inner { grid-template-columns: repeat(2, 1fr); gap: 1.5rem 1rem; }
	.membership-cta .inner { flex-direction: column; align-items: flex-start; }
	#site-generator .container { flex-direction: column; text-align: center; justify-content: center; }
	.alignleft, .alignright { float: none; display: block; margin-inline: auto; }
	.commentlist .children { margin-left: .8rem; }
	#controllers { right: 1rem; }
}

/* ==========================================================================
   20. MOTION & ACCESSIBILITY
   ========================================================================== */
:where(a, button, input, textarea, select, [tabindex]):focus-visible {
	outline: 3px solid var(--amber);
	outline-offset: 2px;
	border-radius: 3px;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
	.feature-card:hover { transform: none; }
	.feature-card:hover .thumb img { transform: none; }
}

@media print {
	#main-nav, .featured-slider, .back-to-top, #footerarea, .hgroup-right { display: none !important; }
	body { background: #fff; color: #000; font-size: 12pt; }
	.hentry { border: 0; box-shadow: none; padding: 0; }
}